Archives/horst3180_arc-theme
1
0
Fork 0
mirror of https://github.com/horst3180/arc-theme.git synced 2024-10-27 19:04:02 +00:00
Code Issues Projects Releases Wiki Activity

gtk 3.14: update scrollbar styling

Browse Source
This commit is contained in:
Horst3180 2015-12-03 00:20:09 +01:00
parent ce704e5b61
commit da31b2af0d
7 changed files with 143 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
common/gtk-3.0/3.14/gtk-contained-dark.css
View File

@ -1564,18 +1564,29 @@ column-header .button, column-header .button:hover, column-header .button:active
-GtkRange-trough-border: 0; -GtkRange-trough-border: 0;
-GtkScrollbar-has-backward-stepper: false; -GtkScrollbar-has-backward-stepper: false;
-GtkScrollbar-has-forward-stepper: false; -GtkScrollbar-has-forward-stepper: false;
-GtkRange-slider-width: 11; -GtkRange-slider-width: 13;
-GtkScrollbar-min-slider-length: 42; -GtkScrollbar-min-slider-length: 42;
-GtkRange-stepper-spacing: 0; -GtkRange-stepper-spacing: 0;
-GtkRange-trough-under-steppers: 1; } -GtkRange-trough-under-steppers: 1; }
.scrollbar .button { .scrollbar .button {
border: none; } border: none; }
.scrollbar.trough {
background-color: #3e434f;
border-left: 1px solid #2b2e39; }
.scrollbar.trough.horizontal {
border-left: none;
border-top: 1px solid #2b2e39; }
.scrollbar.slider { .scrollbar.slider {
border-radius: 20px; border-radius: 21px 20px 20px 21px;
border: 3px solid transparent; border: 3px solid transparent;
border-left-width: 4px;
background-color: #767b87; } background-color: #767b87; }
.scrollbar.slider.horizontal {
border-radius: 21px 21px 20px 20px;
border-left-width: 3px;
border-top-width: 4px; }
.scrollbar.slider:hover { .scrollbar.slider:hover {
background-color: #a5abb5; } background-color: #5f6470; }
.scrollbar.slider:prelight:active { .scrollbar.slider:prelight:active {
background-color: #5294E2; } background-color: #5294E2; }
.scrollbar.slider.fine-tune { .scrollbar.slider.fine-tune {
@ -1585,11 +1596,10 @@ column-header .button, column-header .button:hover, column-header .button:active
.scrollbar.slider:insensitive { .scrollbar.slider:insensitive {
background-color: transparent; } background-color: transparent; }
.scrollbars-junction, .scrollbar.trough, .scrollbars-junction,
.scrollbars-junction.frame, .scrollbars-junction.frame {
.frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: #404552; } background-color: #3e434f; }
/********** /**********
* Switch * * Switch *
@ -3356,8 +3366,7 @@ GraniteWidgetsStaticNotebook .frame {
background-color: #5294E2; } background-color: #5294E2; }
.source-list .scrollbar.trough, .source-list .scrollbar.trough,
.source-list .scrollbars-junction, .source-list .scrollbars-junction {
.source-list .scrollbar.trough {
border-image: none; border-image: none;
border-color: transparent; border-color: transparent;
background-color: #383C4A; background-color: #383C4A;
@ -3831,9 +3840,8 @@ GeditFileBrowserWidget {
background-color: rgba(53, 57, 69, 0.95); } background-color: rgba(53, 57, 69, 0.95); }
.maximized GeditFileBrowserWidget { .maximized GeditFileBrowserWidget {
background-color: #353945; } background-color: #353945; }
GeditFileBrowserWidget .scrollbars-junction, GeditFileBrowserWidget .scrollbar.trough, GeditFileBrowserWidget .scrollbars-junction,
GeditFileBrowserWidget .scrollbars-junction.frame, GeditFileBrowserWidget .scrollbars-junction.frame {
GeditFileBrowserWidget .frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: transparent; } background-color: transparent; }
GeditFileBrowserWidget .horizontal { GeditFileBrowserWidget .horizontal {

32
common/gtk-3.0/3.14/gtk-contained-darker.css
View File

@ -1567,18 +1567,29 @@ column-header .button, column-header .button:hover, column-header .button:active
-GtkRange-trough-border: 0; -GtkRange-trough-border: 0;
-GtkScrollbar-has-backward-stepper: false; -GtkScrollbar-has-backward-stepper: false;
-GtkScrollbar-has-forward-stepper: false; -GtkScrollbar-has-forward-stepper: false;
-GtkRange-slider-width: 11; -GtkRange-slider-width: 13;
-GtkScrollbar-min-slider-length: 42; -GtkScrollbar-min-slider-length: 42;
-GtkRange-stepper-spacing: 0; -GtkRange-stepper-spacing: 0;
-GtkRange-trough-under-steppers: 1; } -GtkRange-trough-under-steppers: 1; }
.scrollbar .button { .scrollbar .button {
border: none; } border: none; }
.scrollbar.trough {
background-color: #fcfcfc;
border-left: 1px solid #dcdfe3; }
.scrollbar.trough.horizontal {
border-left: none;
border-top: 1px solid #dcdfe3; }
.scrollbar.slider { .scrollbar.slider {
border-radius: 20px; border-radius: 21px 20px 20px 21px;
border: 3px solid transparent; border: 3px solid transparent;
border-left-width: 4px;
background-color: #b8babf; } background-color: #b8babf; }
.scrollbar.slider.horizontal {
border-radius: 21px 21px 20px 20px;
border-left-width: 3px;
border-top-width: 4px; }
.scrollbar.slider:hover { .scrollbar.slider:hover {
background-color: #8a8e96; } background-color: #cfd1d4; }
.scrollbar.slider:prelight:active { .scrollbar.slider:prelight:active {
background-color: #5294E2; } background-color: #5294E2; }
.scrollbar.slider.fine-tune { .scrollbar.slider.fine-tune {
@ -1588,11 +1599,10 @@ column-header .button, column-header .button:hover, column-header .button:active
.scrollbar.slider:insensitive { .scrollbar.slider:insensitive {
background-color: transparent; } background-color: transparent; }
.scrollbars-junction, .scrollbar.trough, .scrollbars-junction,
.scrollbars-junction.frame, .scrollbars-junction.frame {
.frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: #ffffff; } background-color: #fcfcfc; }
/********** /**********
* Switch * * Switch *
@ -3359,8 +3369,7 @@ GraniteWidgetsStaticNotebook .frame {
background-color: #5294E2; } background-color: #5294E2; }
.source-list .scrollbar.trough, .source-list .scrollbar.trough,
.source-list .scrollbars-junction, .source-list .scrollbars-junction {
.source-list .scrollbar.trough {
border-image: none; border-image: none;
border-color: transparent; border-color: transparent;
background-color: #F5F6F7; background-color: #F5F6F7;
@ -3824,9 +3833,8 @@ GeditFileBrowserWidget {
background-color: rgba(53, 57, 69, 0.95); } background-color: rgba(53, 57, 69, 0.95); }
.maximized GeditFileBrowserWidget { .maximized GeditFileBrowserWidget {
background-color: #353945; } background-color: #353945; }
GeditFileBrowserWidget .scrollbars-junction, GeditFileBrowserWidget .scrollbar.trough, GeditFileBrowserWidget .scrollbars-junction,
GeditFileBrowserWidget .scrollbars-junction.frame, GeditFileBrowserWidget .scrollbars-junction.frame {
GeditFileBrowserWidget .frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: transparent; } background-color: transparent; }
GeditFileBrowserWidget .horizontal { GeditFileBrowserWidget .horizontal {

32
common/gtk-3.0/3.14/gtk-contained-solid-dark.css
View File

@ -1564,18 +1564,29 @@ column-header .button, column-header .button:hover, column-header .button:active
-GtkRange-trough-border: 0; -GtkRange-trough-border: 0;
-GtkScrollbar-has-backward-stepper: false; -GtkScrollbar-has-backward-stepper: false;
-GtkScrollbar-has-forward-stepper: false; -GtkScrollbar-has-forward-stepper: false;
-GtkRange-slider-width: 11; -GtkRange-slider-width: 13;
-GtkScrollbar-min-slider-length: 42; -GtkScrollbar-min-slider-length: 42;
-GtkRange-stepper-spacing: 0; -GtkRange-stepper-spacing: 0;
-GtkRange-trough-under-steppers: 1; } -GtkRange-trough-under-steppers: 1; }
.scrollbar .button { .scrollbar .button {
border: none; } border: none; }
.scrollbar.trough {
background-color: #3e434f;
border-left: 1px solid #2b2e39; }
.scrollbar.trough.horizontal {
border-left: none;
border-top: 1px solid #2b2e39; }
.scrollbar.slider { .scrollbar.slider {
border-radius: 20px; border-radius: 21px 20px 20px 21px;
border: 3px solid transparent; border: 3px solid transparent;
border-left-width: 4px;
background-color: #767b87; } background-color: #767b87; }
.scrollbar.slider.horizontal {
border-radius: 21px 21px 20px 20px;
border-left-width: 3px;
border-top-width: 4px; }
.scrollbar.slider:hover { .scrollbar.slider:hover {
background-color: #a5abb5; } background-color: #5f6470; }
.scrollbar.slider:prelight:active { .scrollbar.slider:prelight:active {
background-color: #5294E2; } background-color: #5294E2; }
.scrollbar.slider.fine-tune { .scrollbar.slider.fine-tune {
@ -1585,11 +1596,10 @@ column-header .button, column-header .button:hover, column-header .button:active
.scrollbar.slider:insensitive { .scrollbar.slider:insensitive {
background-color: transparent; } background-color: transparent; }
.scrollbars-junction, .scrollbar.trough, .scrollbars-junction,
.scrollbars-junction.frame, .scrollbars-junction.frame {
.frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: #404552; } background-color: #3e434f; }
/********** /**********
* Switch * * Switch *
@ -3356,8 +3366,7 @@ GraniteWidgetsStaticNotebook .frame {
background-color: #5294E2; } background-color: #5294E2; }
.source-list .scrollbar.trough, .source-list .scrollbar.trough,
.source-list .scrollbars-junction, .source-list .scrollbars-junction {
.source-list .scrollbar.trough {
border-image: none; border-image: none;
border-color: transparent; border-color: transparent;
background-color: #383C4A; background-color: #383C4A;
@ -3831,9 +3840,8 @@ GeditFileBrowserWidget {
background-color: #353945; } background-color: #353945; }
.maximized GeditFileBrowserWidget { .maximized GeditFileBrowserWidget {
background-color: #353945; } background-color: #353945; }
GeditFileBrowserWidget .scrollbars-junction, GeditFileBrowserWidget .scrollbar.trough, GeditFileBrowserWidget .scrollbars-junction,
GeditFileBrowserWidget .scrollbars-junction.frame, GeditFileBrowserWidget .scrollbars-junction.frame {
GeditFileBrowserWidget .frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: transparent; } background-color: transparent; }
GeditFileBrowserWidget .horizontal { GeditFileBrowserWidget .horizontal {

32
common/gtk-3.0/3.14/gtk-contained-solid-darker.css
View File

@ -1567,18 +1567,29 @@ column-header .button, column-header .button:hover, column-header .button:active
-GtkRange-trough-border: 0; -GtkRange-trough-border: 0;
-GtkScrollbar-has-backward-stepper: false; -GtkScrollbar-has-backward-stepper: false;
-GtkScrollbar-has-forward-stepper: false; -GtkScrollbar-has-forward-stepper: false;
-GtkRange-slider-width: 11; -GtkRange-slider-width: 13;
-GtkScrollbar-min-slider-length: 42; -GtkScrollbar-min-slider-length: 42;
-GtkRange-stepper-spacing: 0; -GtkRange-stepper-spacing: 0;
-GtkRange-trough-under-steppers: 1; } -GtkRange-trough-under-steppers: 1; }
.scrollbar .button { .scrollbar .button {
border: none; } border: none; }
.scrollbar.trough {
background-color: #fcfcfc;
border-left: 1px solid #dcdfe3; }
.scrollbar.trough.horizontal {
border-left: none;
border-top: 1px solid #dcdfe3; }
.scrollbar.slider { .scrollbar.slider {
border-radius: 20px; border-radius: 21px 20px 20px 21px;
border: 3px solid transparent; border: 3px solid transparent;
border-left-width: 4px;
background-color: #b8babf; } background-color: #b8babf; }
.scrollbar.slider.horizontal {
border-radius: 21px 21px 20px 20px;
border-left-width: 3px;
border-top-width: 4px; }
.scrollbar.slider:hover { .scrollbar.slider:hover {
background-color: #8a8e96; } background-color: #cfd1d4; }
.scrollbar.slider:prelight:active { .scrollbar.slider:prelight:active {
background-color: #5294E2; } background-color: #5294E2; }
.scrollbar.slider.fine-tune { .scrollbar.slider.fine-tune {
@ -1588,11 +1599,10 @@ column-header .button, column-header .button:hover, column-header .button:active
.scrollbar.slider:insensitive { .scrollbar.slider:insensitive {
background-color: transparent; } background-color: transparent; }
.scrollbars-junction, .scrollbar.trough, .scrollbars-junction,
.scrollbars-junction.frame, .scrollbars-junction.frame {
.frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: #ffffff; } background-color: #fcfcfc; }
/********** /**********
* Switch * * Switch *
@ -3359,8 +3369,7 @@ GraniteWidgetsStaticNotebook .frame {
background-color: #5294E2; } background-color: #5294E2; }
.source-list .scrollbar.trough, .source-list .scrollbar.trough,
.source-list .scrollbars-junction, .source-list .scrollbars-junction {
.source-list .scrollbar.trough {
border-image: none; border-image: none;
border-color: transparent; border-color: transparent;
background-color: #F5F6F7; background-color: #F5F6F7;
@ -3824,9 +3833,8 @@ GeditFileBrowserWidget {
background-color: #353945; } background-color: #353945; }
.maximized GeditFileBrowserWidget { .maximized GeditFileBrowserWidget {
background-color: #353945; } background-color: #353945; }
GeditFileBrowserWidget .scrollbars-junction, GeditFileBrowserWidget .scrollbar.trough, GeditFileBrowserWidget .scrollbars-junction,
GeditFileBrowserWidget .scrollbars-junction.frame, GeditFileBrowserWidget .scrollbars-junction.frame {
GeditFileBrowserWidget .frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: transparent; } background-color: transparent; }
GeditFileBrowserWidget .horizontal { GeditFileBrowserWidget .horizontal {

32
common/gtk-3.0/3.14/gtk-contained-solid.css
View File

@ -1567,18 +1567,29 @@ column-header .button, column-header .button:hover, column-header .button:active
-GtkRange-trough-border: 0; -GtkRange-trough-border: 0;
-GtkScrollbar-has-backward-stepper: false; -GtkScrollbar-has-backward-stepper: false;
-GtkScrollbar-has-forward-stepper: false; -GtkScrollbar-has-forward-stepper: false;
-GtkRange-slider-width: 11; -GtkRange-slider-width: 13;
-GtkScrollbar-min-slider-length: 42; -GtkScrollbar-min-slider-length: 42;
-GtkRange-stepper-spacing: 0; -GtkRange-stepper-spacing: 0;
-GtkRange-trough-under-steppers: 1; } -GtkRange-trough-under-steppers: 1; }
.scrollbar .button { .scrollbar .button {
border: none; } border: none; }
.scrollbar.trough {
background-color: #fcfcfc;
border-left: 1px solid #dcdfe3; }
.scrollbar.trough.horizontal {
border-left: none;
border-top: 1px solid #dcdfe3; }
.scrollbar.slider { .scrollbar.slider {
border-radius: 20px; border-radius: 21px 20px 20px 21px;
border: 3px solid transparent; border: 3px solid transparent;
border-left-width: 4px;
background-color: #b8babf; } background-color: #b8babf; }
.scrollbar.slider.horizontal {
border-radius: 21px 21px 20px 20px;
border-left-width: 3px;
border-top-width: 4px; }
.scrollbar.slider:hover { .scrollbar.slider:hover {
background-color: #8a8e96; } background-color: #cfd1d4; }
.scrollbar.slider:prelight:active { .scrollbar.slider:prelight:active {
background-color: #5294E2; } background-color: #5294E2; }
.scrollbar.slider.fine-tune { .scrollbar.slider.fine-tune {
@ -1588,11 +1599,10 @@ column-header .button, column-header .button:hover, column-header .button:active
.scrollbar.slider:insensitive { .scrollbar.slider:insensitive {
background-color: transparent; } background-color: transparent; }
.scrollbars-junction, .scrollbar.trough, .scrollbars-junction,
.scrollbars-junction.frame, .scrollbars-junction.frame {
.frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: #ffffff; } background-color: #fcfcfc; }
/********** /**********
* Switch * * Switch *
@ -3359,8 +3369,7 @@ GraniteWidgetsStaticNotebook .frame {
background-color: #5294E2; } background-color: #5294E2; }
.source-list .scrollbar.trough, .source-list .scrollbar.trough,
.source-list .scrollbars-junction, .source-list .scrollbars-junction {
.source-list .scrollbar.trough {
border-image: none; border-image: none;
border-color: transparent; border-color: transparent;
background-color: #F5F6F7; background-color: #F5F6F7;
@ -3824,9 +3833,8 @@ GeditFileBrowserWidget {
background-color: #353945; } background-color: #353945; }
.maximized GeditFileBrowserWidget { .maximized GeditFileBrowserWidget {
background-color: #353945; } background-color: #353945; }
GeditFileBrowserWidget .scrollbars-junction, GeditFileBrowserWidget .scrollbar.trough, GeditFileBrowserWidget .scrollbars-junction,
GeditFileBrowserWidget .scrollbars-junction.frame, GeditFileBrowserWidget .scrollbars-junction.frame {
GeditFileBrowserWidget .frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: transparent; } background-color: transparent; }
GeditFileBrowserWidget .horizontal { GeditFileBrowserWidget .horizontal {

32
common/gtk-3.0/3.14/gtk-contained.css
View File

@ -1567,18 +1567,29 @@ column-header .button, column-header .button:hover, column-header .button:active
-GtkRange-trough-border: 0; -GtkRange-trough-border: 0;
-GtkScrollbar-has-backward-stepper: false; -GtkScrollbar-has-backward-stepper: false;
-GtkScrollbar-has-forward-stepper: false; -GtkScrollbar-has-forward-stepper: false;
-GtkRange-slider-width: 11; -GtkRange-slider-width: 13;
-GtkScrollbar-min-slider-length: 42; -GtkScrollbar-min-slider-length: 42;
-GtkRange-stepper-spacing: 0; -GtkRange-stepper-spacing: 0;
-GtkRange-trough-under-steppers: 1; } -GtkRange-trough-under-steppers: 1; }
.scrollbar .button { .scrollbar .button {
border: none; } border: none; }
.scrollbar.trough {
background-color: #fcfcfc;
border-left: 1px solid #dcdfe3; }
.scrollbar.trough.horizontal {
border-left: none;
border-top: 1px solid #dcdfe3; }
.scrollbar.slider { .scrollbar.slider {
border-radius: 20px; border-radius: 21px 20px 20px 21px;
border: 3px solid transparent; border: 3px solid transparent;
border-left-width: 4px;
background-color: #b8babf; } background-color: #b8babf; }
.scrollbar.slider.horizontal {
border-radius: 21px 21px 20px 20px;
border-left-width: 3px;
border-top-width: 4px; }
.scrollbar.slider:hover { .scrollbar.slider:hover {
background-color: #8a8e96; } background-color: #cfd1d4; }
.scrollbar.slider:prelight:active { .scrollbar.slider:prelight:active {
background-color: #5294E2; } background-color: #5294E2; }
.scrollbar.slider.fine-tune { .scrollbar.slider.fine-tune {
@ -1588,11 +1599,10 @@ column-header .button, column-header .button:hover, column-header .button:active
.scrollbar.slider:insensitive { .scrollbar.slider:insensitive {
background-color: transparent; } background-color: transparent; }
.scrollbars-junction, .scrollbar.trough, .scrollbars-junction,
.scrollbars-junction.frame, .scrollbars-junction.frame {
.frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: #ffffff; } background-color: #fcfcfc; }
/********** /**********
* Switch * * Switch *
@ -3359,8 +3369,7 @@ GraniteWidgetsStaticNotebook .frame {
background-color: #5294E2; } background-color: #5294E2; }
.source-list .scrollbar.trough, .source-list .scrollbar.trough,
.source-list .scrollbars-junction, .source-list .scrollbars-junction {
.source-list .scrollbar.trough {
border-image: none; border-image: none;
border-color: transparent; border-color: transparent;
background-color: #F5F6F7; background-color: #F5F6F7;
@ -3824,9 +3833,8 @@ GeditFileBrowserWidget {
background-color: rgba(53, 57, 69, 0.95); } background-color: rgba(53, 57, 69, 0.95); }
.maximized GeditFileBrowserWidget { .maximized GeditFileBrowserWidget {
background-color: #353945; } background-color: #353945; }
GeditFileBrowserWidget .scrollbars-junction, GeditFileBrowserWidget .scrollbar.trough, GeditFileBrowserWidget .scrollbars-junction,
GeditFileBrowserWidget .scrollbars-junction.frame, GeditFileBrowserWidget .scrollbars-junction.frame {
GeditFileBrowserWidget .frame.scrollbar.trough {
border-color: transparent; border-color: transparent;
background-color: transparent; } background-color: transparent; }
GeditFileBrowserWidget .horizontal { GeditFileBrowserWidget .horizontal {

29
common/gtk-3.0/3.14/sass/_common.scss
View File

@ -1844,6 +1844,8 @@ column-header.button.dnd { // for treeview-like derive widgets
* Scrollbars * * Scrollbars *
**************/ **************/
$_scrollbar_bg_color: darken($base_color, 1%);
.scrollbar { .scrollbar {
background-clip: padding-box; background-clip: padding-box;
background-image: none; background-image: none;
@ -1851,7 +1853,7 @@ column-header.button.dnd { // for treeview-like derive widgets
-GtkRange-trough-border: 0; -GtkRange-trough-border: 0;
-GtkScrollbar-has-backward-stepper: false; -GtkScrollbar-has-backward-stepper: false;
-GtkScrollbar-has-forward-stepper: false; -GtkScrollbar-has-forward-stepper: false;
-GtkRange-slider-width: 11; -GtkRange-slider-width: 13;
-GtkScrollbar-min-slider-length: 42; // minimum size for the slider. -GtkScrollbar-min-slider-length: 42; // minimum size for the slider.
// sadly can't be in '.slider' // sadly can't be in '.slider'
// where it belongs // where it belongs
@ -1861,13 +1863,28 @@ column-header.button.dnd { // for treeview-like derive widgets
.button { .button {
border: none; border: none;
} }
&.trough { @extend .scrollbars-junction; } &.trough {
background-color: $_scrollbar_bg_color;
border-left: 1px solid $borders_color;
&.horizontal {
border-left: none;
border-top: 1px solid $borders_color;
}
}
&.slider { &.slider {
border-radius: 20px; border-radius: 21px 20px 20px 21px;
border: 3px solid transparent; //margin :/ border: 3px solid transparent; //margin :/
background-color: mix($bg_color, $fg_color, 60%); border-left-width: 4px;
background-color: mix($fg_color, $bg_color, 40%);
&.horizontal {
border-radius: 21px 21px 20px 20px;
border-left-width: 3px;
border-top-width: 4px;
}
&:hover { &:hover {
background-color: mix($bg_color, $fg_color, 30%); background-color: mix($fg_color, $bg_color, 25%);
} }
&:prelight:active { &:prelight:active {
background-color: $selected_bg_color; background-color: $selected_bg_color;
@ -1887,7 +1904,7 @@ column-header.button.dnd { // for treeview-like derive widgets
.scrollbars-junction, .scrollbars-junction,
.scrollbars-junction.frame { // the small square between two scrollbars .scrollbars-junction.frame { // the small square between two scrollbars
border-color: transparent; border-color: transparent;
background-color: $base_color; background-color: $_scrollbar_bg_color;
} }