css snippets – welcome to somewhereville (.com)

Above: Too dense in some areas, too sparse in many others. My current 2nd brain, third hemisphere, whatever you wanna call it.

Update: 8:58 p.m. – from the "Grand Opening, Grand Closing" Department – the reported issue is already marked closed and completed (and duplicate – remember to check those "Closed" issues in github, folks!) by kepano (https://github.com/kepano/obsidian-minimal/issues/861). Just awaiting the next update before this post becomes useless to everyone.

Most of my existence (timestamp) involves Obsidian, a dozen community plugins, and kepano's Minimal Theme. One plugin I'm trying to use more in research planning/tracking/bite-size-piecing to get things done is the Kanban plugin (despite it not having seen much dev action lately. ? – see https://www.atlassian.com/agile/kanban).

Things are generally just fine between updates, but something odd happened at some point post-v1.8. Specifically, in the default and Minimal themes, the scrollbars in my extended Kanban boards went invisible. This as of Obsidian v1.9.12. See below:

System specs as follows:

Obsidian v1.9.12
Minimal Theme v8.0.4
OSX Sequoia 15.6.1 (with "Show Scrollbars" set to "Always")
Kanban 2.0.51

Goofing in the .css files, such as in https://forum.obsidian.md/t/solved-hover-display-all-scrollbars/10137/4, for either the themes or the plugin lead nowhere specific (except getting the scrollbars back during hover).

What did work was simply re-calling the "entire section controlling scrollbars from the app.css," as described below (from https://forum.obsidian.md/t/right-scrollbar-of-the-note-too-small-after-clicking/81603/4):

"Also, this is the entire section controlling scrollbars from the app.css. The CSS above only includes the sections needed to get that result. If you are looking to adjust further, you may need to add another section or two to your snippet to overwrite the defaults."

This is reproduced below. Simply copy, save as a file in [your vault]/.obsidian/snippets folder (I named mine "Scrollbars.css"), re-open Obsidian, go to Settings -> Appearance -> CSS snippets (at bottom) –> move the slider for "Scrollbars" to active.

body:not(.native-scrollbars) ::-webkit-scrollbar {
  background-color: var(--scrollbar-bg);
  width: 12px;
  height: 12px;
  -webkit-border-radius: var(--radius-l);
  background-color: transparent;
}
body:not(.native-scrollbars) ::-webkit-scrollbar-track {
  background-color: transparent;
}
body:not(.native-scrollbars) ::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-thumb-bg);
  -webkit-border-radius: var(--radius-l);
  background-clip: padding-box;
  border: 2px solid transparent;
  border-width: 3px 3px 3px 2px;
  min-height: 45px;
}
body:not(.native-scrollbars) ::-webkit-scrollbar-thumb:active {
  -webkit-border-radius: var(--radius-l);
}
body:not(.native-scrollbars) ::-webkit-scrollbar-thumb:hover,
body:not(.native-scrollbars) ::-webkit-scrollbar-thumb:active {
  background-color: var(--scrollbar-active-thumb-bg);
}
body:not(.native-scrollbars) ::-webkit-scrollbar-corner {
  background: transparent;
}
@supports not selector(::-webkit-scrollbar) {
  body:not(.native-scrollbars) {
    scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-thumb-bg) var(--scrollbar-bg);
  }
}