Allow customizing the scrollbar on a per-sheet-per-theme basis as desired

This commit is contained in:
Oliver-Akins 2024-03-21 00:02:23 -06:00
parent 3b4e2405c1
commit 68b53601d6
2 changed files with 14 additions and 3 deletions

View file

@ -4,15 +4,23 @@
@import url('https://fonts.googleapis.com/css2?family=Pixelify+Sans&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Pixelify+Sans&display=swap');
// Reset the parts of Foundry's styling which gets in the way of what I want .dotdungeon {
.dotdungeon > .window-content { --scrollbar-handle-color: #782e22;
--scrollbar-handle-border-color: var(--color-border-highlight);
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 10px; width: var(--scrollbar-width, 5px);
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background: var(--scrollbar-handle-color);
border-color: var(--scrollbar-handle-border-color);
border-radius: 5px; border-radius: 5px;
} }
}
// Reset the parts of Foundry's styling which gets in the way of what I want
.dotdungeon > .window-content {
h2, h3, h4, h5, h6 { h2, h3, h4, h5, h6 {
@include fvtt_reset; @include fvtt_reset;

View file

@ -20,6 +20,9 @@ $body-font: sans-serif;
--tab-font: #{$title-font}; --tab-font: #{$title-font};
--input-font: #{$body-font}; --input-font: #{$body-font};
--scrollbar-handle-color: #{$primary};
--scrollbar-handle-border-color: color-mix(in lab, white 40%, var(--scrollbar-handle-color));
/* Elevation backgrounds to following Material design */ /* Elevation backgrounds to following Material design */
--elevation-0dp-bg: #{$surface}; --elevation-0dp-bg: #{$surface};
--elevation-1dp-bg: color-mix(in lab, transparent, white 5%); --elevation-1dp-bg: color-mix(in lab, transparent, white 5%);