forked from AuroraMiddleware/gtk
Hight Contrast: scrollbars
https://bugzilla.gnome.org/show_bug.cgi?id=763797
This commit is contained in:
Jakub Steiner
parent
b88020ec92
commit
a076df852b
@ -16,6 +16,11 @@ $borders_color: mix($bg_color,$fg_color,50%);
|
|||||||
$borders_edge: if($variant == 'light', #fff, #000);
|
$borders_edge: if($variant == 'light', #fff, #000);
|
||||||
$link_color: $selected_bg_color;
|
$link_color: $selected_bg_color;
|
||||||
|
|
||||||
|
$scrollbar_bg_color: if($variant == 'light', mix($bg_color, $fg_color, 95%), mix($base_color, $bg_color, 60%));
|
||||||
|
$scrollbar_slider_color: mix($fg_color, $bg_color, 60%);
|
||||||
|
$scrollbar_slider_hover_color: mix($fg_color, $bg_color, 80%);
|
||||||
|
$scrollbar_slider_active_color: if($variant=='light', darken($selected_bg_color, 10%), lighten($selected_bg_color, 10%));
|
||||||
|
|
||||||
$suggested_color: #4a90d9;
|
$suggested_color: #4a90d9;
|
||||||
$warning_color: #f57900;
|
$warning_color: #f57900;
|
||||||
$error_color: #cc0000;
|
$error_color: #cc0000;
|
||||||
@ -38,6 +43,8 @@ $backdrop_bg_color: $bg_color;
|
|||||||
$backdrop_fg_color: $fg_color;
|
$backdrop_fg_color: $fg_color;
|
||||||
$backdrop_borders_color: mix($borders_color, $bg_color, 90%);
|
$backdrop_borders_color: mix($borders_color, $bg_color, 90%);
|
||||||
$backdrop_dark_fill: mix($fg_color, $bg_color, 30%);
|
$backdrop_dark_fill: mix($fg_color, $bg_color, 30%);
|
||||||
|
$backdrop_scrollbar_bg_color: darken($backdrop_bg_color, 3%);
|
||||||
|
$backdrop_scrollbar_slider_color: mix($backdrop_fg_color, $backdrop_bg_color, 40%);
|
||||||
|
|
||||||
//apps rely on some named colors to be exported
|
//apps rely on some named colors to be exported
|
||||||
/* GTK NAMED COLORS */
|
/* GTK NAMED COLORS */
|
||||||
|
|||||||
@ -1765,82 +1765,178 @@ notebook {
|
|||||||
/**************
|
/**************
|
||||||
* Scrollbars *
|
* Scrollbars *
|
||||||
**************/
|
**************/
|
||||||
|
|
||||||
scrollbar {
|
scrollbar {
|
||||||
background-clip: padding-box;
|
$_slider_min_length: 40px;
|
||||||
background-image: none;
|
|
||||||
border-style: solid;
|
|
||||||
-GtkScrollbar-has-backward-stepper: false;
|
|
||||||
-GtkScrollbar-has-forward-stepper: false;
|
|
||||||
-GtkRange-slider-width: 20;
|
|
||||||
-GtkScrollbar-min-slider-length: 42; // minimum size for the slider.
|
|
||||||
// sadly can't be in '.slider'
|
|
||||||
// where it belongs
|
|
||||||
|
|
||||||
trough { @extend junction; }
|
// disable steppers
|
||||||
|
@at-root * {
|
||||||
$_slider_margin: 3px;
|
-GtkScrollbar-has-backward-stepper: false;
|
||||||
$_slider_fine_tune_margin: 4px;
|
-GtkScrollbar-has-forward-stepper: false;
|
||||||
|
|
||||||
button {
|
|
||||||
border: none;
|
|
||||||
}
|
}
|
||||||
& slider {
|
|
||||||
border-radius: 20px;
|
background-color: $scrollbar_bg_color;
|
||||||
border: 5px solid transparent; //margin
|
transition: 300ms $ease-out-quad;
|
||||||
background-color: mix($bg_color, $fg_color, 50%);
|
|
||||||
&:backdrop, &:disabled {
|
// scrollbar border
|
||||||
background-color: mix($bg_color, $fg_color, 90%);
|
&.top { border-bottom: 1px solid $borders_color; }
|
||||||
}
|
&.bottom { border-top: 1px solid $borders_color; }
|
||||||
&:hover {
|
&.left { border-right: 1px solid $borders_color; }
|
||||||
background-color: mix($bg_color, $fg_color, 30%);
|
&.right { border-left: 1px solid $borders_color; }
|
||||||
}
|
|
||||||
&:hover:active {
|
&:backdrop {
|
||||||
background-color: $selected_bg_color;
|
background-color: $backdrop_scrollbar_bg_color;
|
||||||
}
|
border-color: $backdrop_borders_color;
|
||||||
&.fine-tune {
|
|
||||||
border-width: 8px;
|
|
||||||
&:hover:active {
|
|
||||||
background-color: $selected_bg_color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// slider
|
||||||
|
slider {
|
||||||
|
min-width: 14px;
|
||||||
|
min-height: 14px;
|
||||||
|
margin: -1px;
|
||||||
|
border: 4px solid transparent;
|
||||||
|
border-radius: 12px;
|
||||||
|
background-clip: padding-box;
|
||||||
|
background-color: $scrollbar_slider_color;
|
||||||
|
|
||||||
|
&:hover { background-color: $scrollbar_slider_hover_color; }
|
||||||
|
|
||||||
|
&:hover:active { background-color: $scrollbar_slider_active_color; }
|
||||||
|
|
||||||
|
&:backdrop { background-color: $backdrop_scrollbar_slider_color; }
|
||||||
|
|
||||||
|
&:disabled { background-color: transparent; }
|
||||||
|
}
|
||||||
|
|
||||||
|
&.fine-tune {
|
||||||
|
slider {
|
||||||
|
min-width: 4px;
|
||||||
|
min-height: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.horizontal slider { border-width: 5px 4px; }
|
||||||
|
&.vertical slider { border-width: 4px 5px; }
|
||||||
|
}
|
||||||
|
|
||||||
&.overlay-indicator {
|
&.overlay-indicator {
|
||||||
&:not(.dragging):not(.hovering) { // Overlay scrolling indicator
|
&:not(.dragging):not(.hovering) {
|
||||||
|
border-color: transparent;
|
||||||
opacity: 0.4;
|
opacity: 0.4;
|
||||||
|
background-color: transparent;
|
||||||
-GtkRange-slider-width: 5px;
|
|
||||||
|
|
||||||
slider {
|
slider {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
min-width: 3px;
|
||||||
|
min-height: 3px;
|
||||||
|
background-color: $fg_color;
|
||||||
|
border: 1px solid if($variant == 'light', white, black);
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
min-width: 5px;
|
||||||
|
min-height: 5px;
|
||||||
background-color: $fg_color;
|
background-color: $fg_color;
|
||||||
border: 1px solid white;
|
|
||||||
background-clip: padding-box;
|
background-clip: padding-box;
|
||||||
|
border-radius: 100%;
|
||||||
|
border: 1px solid if($variant == 'light', white, black);
|
||||||
|
-gtk-icon-source: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
trough {
|
&.horizontal {
|
||||||
border-style: none;
|
slider {
|
||||||
background-color: transparent;
|
margin: 0 2px;
|
||||||
|
min-width: $_slider_min_length;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
margin: 1px 2px;
|
||||||
|
min-width: 5px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// w/o the following margin tweaks the slider shrinks when hovering/dragging
|
&.vertical {
|
||||||
&.vertical slider {
|
slider {
|
||||||
margin-top: $_slider_margin - 1px;
|
margin: 2px 0;
|
||||||
margin-bottom: $_slider_margin - 1px;
|
min-height: $_slider_min_length;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.horizontal slider {
|
button {
|
||||||
margin-left: $_slider_margin - 1px;
|
margin: 2px 1px;
|
||||||
margin-right: $_slider_margin - 1px;
|
min-height: 5px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&.dragging,
|
&.dragging,
|
||||||
&.hovering { opacity: 0.7; }
|
&.hovering { opacity: 0.8; }
|
||||||
|
}
|
||||||
|
|
||||||
|
&.horizontal slider { min-width: $_slider_min_length; }
|
||||||
|
|
||||||
|
&.vertical slider { min-height: $_slider_min_length; }
|
||||||
|
|
||||||
|
// button styling
|
||||||
|
button {
|
||||||
|
padding: 0;
|
||||||
|
min-width: 12px;
|
||||||
|
min-height: 12px;
|
||||||
|
border-style: none;
|
||||||
|
border-radius: 0;
|
||||||
|
transition-property: min-height, min-width, color;
|
||||||
|
|
||||||
|
@include button(undecorated);
|
||||||
|
|
||||||
|
color: $scrollbar_slider_color;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
@include button(undecorated);
|
||||||
|
|
||||||
|
color: $scrollbar_slider_hover_color;
|
||||||
|
}
|
||||||
|
&:active, &:checked {
|
||||||
|
@include button(undecorated);
|
||||||
|
|
||||||
|
color: $scrollbar_slider_active_color;
|
||||||
|
}
|
||||||
|
&:disabled {
|
||||||
|
@include button(undecorated);
|
||||||
|
|
||||||
|
color: transparentize($scrollbar_slider_color, 0.8);
|
||||||
|
}
|
||||||
|
&:backdrop {
|
||||||
|
@include button(undecorated);
|
||||||
|
|
||||||
|
color: $backdrop_scrollbar_slider_color;
|
||||||
|
|
||||||
|
&:disabled {
|
||||||
|
@include button(undecorated);
|
||||||
|
|
||||||
|
color: transparentize($backdrop_scrollbar_slider_color, 0.8);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// button icons
|
||||||
|
&.vertical {
|
||||||
|
button {
|
||||||
|
&.down { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); }
|
||||||
|
|
||||||
|
&.up { -gtk-icon-source: -gtk-icontheme('pan-up-symbolic'); }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.horizontal {
|
||||||
|
button {
|
||||||
|
&.down { -gtk-icon-source: -gtk-icontheme('pan-right-symbolic'); }
|
||||||
|
|
||||||
|
&.up { -gtk-icon-source: -gtk-icontheme('pan-left-symbolic'); }
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
treeview ~ scrollbar.vertical {
|
||||||
|
border-top: 1px solid $borders_color;
|
||||||
|
margin-top: -1px;
|
||||||
|
}
|
||||||
|
|
||||||
/**********
|
/**********
|
||||||
* Switch *
|
* Switch *
|
||||||
|
|||||||
@ -1891,48 +1891,147 @@ notebook {
|
|||||||
* Scrollbars *
|
* Scrollbars *
|
||||||
**************/
|
**************/
|
||||||
scrollbar {
|
scrollbar {
|
||||||
background-clip: padding-box;
|
background-color: #0a0a0a;
|
||||||
background-image: none;
|
transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
|
||||||
border-style: solid;
|
* {
|
||||||
-GtkScrollbar-has-backward-stepper: false;
|
-GtkScrollbar-has-backward-stepper: false;
|
||||||
-GtkScrollbar-has-forward-stepper: false;
|
-GtkScrollbar-has-forward-stepper: false; }
|
||||||
-GtkRange-slider-width: 20;
|
scrollbar.top {
|
||||||
-GtkScrollbar-min-slider-length: 42; }
|
border-bottom: 1px solid gray; }
|
||||||
scrollbar button {
|
scrollbar.bottom {
|
||||||
border: none; }
|
border-top: 1px solid gray; }
|
||||||
|
scrollbar.left {
|
||||||
|
border-right: 1px solid gray; }
|
||||||
|
scrollbar.right {
|
||||||
|
border-left: 1px solid gray; }
|
||||||
|
scrollbar:backdrop {
|
||||||
|
background-color: black;
|
||||||
|
border-color: #737373; }
|
||||||
scrollbar slider {
|
scrollbar slider {
|
||||||
border-radius: 20px;
|
min-width: 14px;
|
||||||
border: 5px solid transparent;
|
min-height: 14px;
|
||||||
background-color: gray; }
|
margin: -1px;
|
||||||
scrollbar slider:backdrop, scrollbar slider:disabled {
|
border: 4px solid transparent;
|
||||||
background-color: #1a1a1a; }
|
border-radius: 12px;
|
||||||
|
background-clip: padding-box;
|
||||||
|
background-color: #999999; }
|
||||||
scrollbar slider:hover {
|
scrollbar slider:hover {
|
||||||
background-color: #b3b3b3; }
|
background-color: #cccccc; }
|
||||||
scrollbar slider:hover:active {
|
scrollbar slider:hover:active {
|
||||||
background-color: #aaa; }
|
background-color: #c4c4c4; }
|
||||||
scrollbar slider.fine-tune {
|
scrollbar slider:backdrop {
|
||||||
border-width: 8px; }
|
background-color: #666666; }
|
||||||
scrollbar slider.fine-tune:hover:active {
|
scrollbar slider:disabled {
|
||||||
background-color: #aaa; }
|
background-color: transparent; }
|
||||||
|
scrollbar.fine-tune slider {
|
||||||
|
min-width: 4px;
|
||||||
|
min-height: 4px; }
|
||||||
|
scrollbar.fine-tune.horizontal slider {
|
||||||
|
border-width: 5px 4px; }
|
||||||
|
scrollbar.fine-tune.vertical slider {
|
||||||
|
border-width: 4px 5px; }
|
||||||
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
|
||||||
|
border-color: transparent;
|
||||||
opacity: 0.4;
|
opacity: 0.4;
|
||||||
-GtkRange-slider-width: 5px; }
|
background-color: transparent; }
|
||||||
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
min-width: 3px;
|
||||||
|
min-height: 3px;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
border: 1px solid white;
|
border: 1px solid black; }
|
||||||
background-clip: padding-box; }
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
|
||||||
scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough {
|
min-width: 5px;
|
||||||
border-style: none;
|
min-height: 5px;
|
||||||
background-color: transparent; }
|
background-color: #fff;
|
||||||
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
|
background-clip: padding-box;
|
||||||
margin-top: 2px;
|
border-radius: 100%;
|
||||||
margin-bottom: 2px; }
|
border: 1px solid black;
|
||||||
|
-gtk-icon-source: none; }
|
||||||
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
|
||||||
margin-left: 2px;
|
margin: 0 2px;
|
||||||
margin-right: 2px; }
|
min-width: 40px; }
|
||||||
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
|
||||||
|
margin: 1px 2px;
|
||||||
|
min-width: 5px; }
|
||||||
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
|
||||||
|
margin: 2px 0;
|
||||||
|
min-height: 40px; }
|
||||||
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
|
||||||
|
margin: 2px 1px;
|
||||||
|
min-height: 5px; }
|
||||||
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
|
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
|
||||||
opacity: 0.7; }
|
opacity: 0.8; }
|
||||||
|
scrollbar.horizontal slider {
|
||||||
|
min-width: 40px; }
|
||||||
|
scrollbar.vertical slider {
|
||||||
|
min-height: 40px; }
|
||||||
|
scrollbar button {
|
||||||
|
padding: 0;
|
||||||
|
min-width: 12px;
|
||||||
|
min-height: 12px;
|
||||||
|
border-style: none;
|
||||||
|
border-radius: 0;
|
||||||
|
transition-property: min-height, min-width, color;
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #fff;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: #999999; }
|
||||||
|
scrollbar button:hover {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #fff;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: #cccccc; }
|
||||||
|
scrollbar button:active, scrollbar button:checked {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #fff;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: #c4c4c4; }
|
||||||
|
scrollbar button:disabled {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #fff;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: rgba(153, 153, 153, 0.2); }
|
||||||
|
scrollbar button:backdrop {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #fff;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: #666666; }
|
||||||
|
scrollbar button:backdrop:disabled {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #fff;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: rgba(102, 102, 102, 0.2); }
|
||||||
|
scrollbar.vertical button.down {
|
||||||
|
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
|
||||||
|
scrollbar.vertical button.up {
|
||||||
|
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
|
||||||
|
scrollbar.horizontal button.down {
|
||||||
|
-gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); }
|
||||||
|
scrollbar.horizontal button.up {
|
||||||
|
-gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); }
|
||||||
|
|
||||||
|
treeview ~ scrollbar.vertical {
|
||||||
|
border-top: 1px solid gray;
|
||||||
|
margin-top: -1px; }
|
||||||
|
|
||||||
/**********
|
/**********
|
||||||
* Switch *
|
* Switch *
|
||||||
@ -2672,16 +2771,12 @@ scrolledwindow undershoot.right {
|
|||||||
background-position: right center;
|
background-position: right center;
|
||||||
border: none;
|
border: none;
|
||||||
box-shadow: none; }
|
box-shadow: none; }
|
||||||
placessidebar junction, placessidebar scrollbar trough, scrollbar placessidebar trough,
|
placessidebar junction,
|
||||||
scrolledwindow junction,
|
scrolledwindow junction {
|
||||||
scrolledwindow scrollbar trough,
|
|
||||||
scrollbar scrolledwindow trough {
|
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
background-color: black; }
|
background-color: black; }
|
||||||
placessidebar junction:backdrop, placessidebar scrollbar trough:backdrop, scrollbar placessidebar trough:backdrop,
|
placessidebar junction:backdrop,
|
||||||
scrolledwindow junction:backdrop,
|
scrolledwindow junction:backdrop {
|
||||||
scrolledwindow scrollbar trough:backdrop,
|
|
||||||
scrollbar scrolledwindow trough:backdrop {
|
|
||||||
background-color: transparent; }
|
background-color: transparent; }
|
||||||
|
|
||||||
separator, placessidebar .view separator, placessidebar textview text separator, textview placessidebar text separator, placessidebar iconview separator,
|
separator, placessidebar .view separator, placessidebar textview text separator, textview placessidebar text separator, placessidebar iconview separator,
|
||||||
|
|||||||
@ -1895,48 +1895,147 @@ notebook {
|
|||||||
* Scrollbars *
|
* Scrollbars *
|
||||||
**************/
|
**************/
|
||||||
scrollbar {
|
scrollbar {
|
||||||
background-clip: padding-box;
|
background-color: #f2f2f2;
|
||||||
background-image: none;
|
transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
|
||||||
border-style: solid;
|
* {
|
||||||
-GtkScrollbar-has-backward-stepper: false;
|
-GtkScrollbar-has-backward-stepper: false;
|
||||||
-GtkScrollbar-has-forward-stepper: false;
|
-GtkScrollbar-has-forward-stepper: false; }
|
||||||
-GtkRange-slider-width: 20;
|
scrollbar.top {
|
||||||
-GtkScrollbar-min-slider-length: 42; }
|
border-bottom: 1px solid gray; }
|
||||||
scrollbar button {
|
scrollbar.bottom {
|
||||||
border: none; }
|
border-top: 1px solid gray; }
|
||||||
|
scrollbar.left {
|
||||||
|
border-right: 1px solid gray; }
|
||||||
|
scrollbar.right {
|
||||||
|
border-left: 1px solid gray; }
|
||||||
|
scrollbar:backdrop {
|
||||||
|
background-color: #f7f7f7;
|
||||||
|
border-color: #8d8d8d; }
|
||||||
scrollbar slider {
|
scrollbar slider {
|
||||||
border-radius: 20px;
|
min-width: 14px;
|
||||||
border: 5px solid transparent;
|
min-height: 14px;
|
||||||
background-color: gray; }
|
margin: -1px;
|
||||||
scrollbar slider:backdrop, scrollbar slider:disabled {
|
border: 4px solid transparent;
|
||||||
background-color: #e6e6e6; }
|
border-radius: 12px;
|
||||||
|
background-clip: padding-box;
|
||||||
|
background-color: #666666; }
|
||||||
scrollbar slider:hover {
|
scrollbar slider:hover {
|
||||||
background-color: #4d4d4d; }
|
background-color: #333333; }
|
||||||
scrollbar slider:hover:active {
|
scrollbar slider:hover:active {
|
||||||
background-color: #000; }
|
background-color: black; }
|
||||||
scrollbar slider.fine-tune {
|
scrollbar slider:backdrop {
|
||||||
border-width: 8px; }
|
background-color: #999999; }
|
||||||
scrollbar slider.fine-tune:hover:active {
|
scrollbar slider:disabled {
|
||||||
background-color: #000; }
|
background-color: transparent; }
|
||||||
|
scrollbar.fine-tune slider {
|
||||||
|
min-width: 4px;
|
||||||
|
min-height: 4px; }
|
||||||
|
scrollbar.fine-tune.horizontal slider {
|
||||||
|
border-width: 5px 4px; }
|
||||||
|
scrollbar.fine-tune.vertical slider {
|
||||||
|
border-width: 4px 5px; }
|
||||||
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
|
||||||
|
border-color: transparent;
|
||||||
opacity: 0.4;
|
opacity: 0.4;
|
||||||
-GtkRange-slider-width: 5px; }
|
background-color: transparent; }
|
||||||
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
min-width: 3px;
|
||||||
|
min-height: 3px;
|
||||||
background-color: #000;
|
background-color: #000;
|
||||||
|
border: 1px solid white; }
|
||||||
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
|
||||||
|
min-width: 5px;
|
||||||
|
min-height: 5px;
|
||||||
|
background-color: #000;
|
||||||
|
background-clip: padding-box;
|
||||||
|
border-radius: 100%;
|
||||||
border: 1px solid white;
|
border: 1px solid white;
|
||||||
background-clip: padding-box; }
|
-gtk-icon-source: none; }
|
||||||
scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough {
|
|
||||||
border-style: none;
|
|
||||||
background-color: transparent; }
|
|
||||||
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
|
|
||||||
margin-top: 2px;
|
|
||||||
margin-bottom: 2px; }
|
|
||||||
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
|
||||||
margin-left: 2px;
|
margin: 0 2px;
|
||||||
margin-right: 2px; }
|
min-width: 40px; }
|
||||||
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
|
||||||
|
margin: 1px 2px;
|
||||||
|
min-width: 5px; }
|
||||||
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
|
||||||
|
margin: 2px 0;
|
||||||
|
min-height: 40px; }
|
||||||
|
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
|
||||||
|
margin: 2px 1px;
|
||||||
|
min-height: 5px; }
|
||||||
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
|
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
|
||||||
opacity: 0.7; }
|
opacity: 0.8; }
|
||||||
|
scrollbar.horizontal slider {
|
||||||
|
min-width: 40px; }
|
||||||
|
scrollbar.vertical slider {
|
||||||
|
min-height: 40px; }
|
||||||
|
scrollbar button {
|
||||||
|
padding: 0;
|
||||||
|
min-width: 12px;
|
||||||
|
min-height: 12px;
|
||||||
|
border-style: none;
|
||||||
|
border-radius: 0;
|
||||||
|
transition-property: min-height, min-width, color;
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #000;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: #666666; }
|
||||||
|
scrollbar button:hover {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #000;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: #333333; }
|
||||||
|
scrollbar button:active, scrollbar button:checked {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #000;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: black; }
|
||||||
|
scrollbar button:disabled {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #000;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: rgba(102, 102, 102, 0.2); }
|
||||||
|
scrollbar button:backdrop {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #000;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: #999999; }
|
||||||
|
scrollbar button:backdrop:disabled {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
color: #000;
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
border-color: transparent;
|
||||||
|
color: rgba(153, 153, 153, 0.2); }
|
||||||
|
scrollbar.vertical button.down {
|
||||||
|
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
|
||||||
|
scrollbar.vertical button.up {
|
||||||
|
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
|
||||||
|
scrollbar.horizontal button.down {
|
||||||
|
-gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); }
|
||||||
|
scrollbar.horizontal button.up {
|
||||||
|
-gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); }
|
||||||
|
|
||||||
|
treeview ~ scrollbar.vertical {
|
||||||
|
border-top: 1px solid gray;
|
||||||
|
margin-top: -1px; }
|
||||||
|
|
||||||
/**********
|
/**********
|
||||||
* Switch *
|
* Switch *
|
||||||
@ -2679,16 +2778,12 @@ scrolledwindow undershoot.right {
|
|||||||
background-position: right center;
|
background-position: right center;
|
||||||
border: none;
|
border: none;
|
||||||
box-shadow: none; }
|
box-shadow: none; }
|
||||||
placessidebar junction, placessidebar scrollbar trough, scrollbar placessidebar trough,
|
placessidebar junction,
|
||||||
scrolledwindow junction,
|
scrolledwindow junction {
|
||||||
scrolledwindow scrollbar trough,
|
|
||||||
scrollbar scrolledwindow trough {
|
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
background-color: #f2f2f2; }
|
background-color: #f2f2f2; }
|
||||||
placessidebar junction:backdrop, placessidebar scrollbar trough:backdrop, scrollbar placessidebar trough:backdrop,
|
placessidebar junction:backdrop,
|
||||||
scrolledwindow junction:backdrop,
|
scrolledwindow junction:backdrop {
|
||||||
scrolledwindow scrollbar trough:backdrop,
|
|
||||||
scrollbar scrolledwindow trough:backdrop {
|
|
||||||
background-color: transparent; }
|
background-color: transparent; }
|
||||||
|
|
||||||
separator, placessidebar .view separator, placessidebar textview text separator, textview placessidebar text separator, placessidebar iconview separator,
|
separator, placessidebar .view separator, placessidebar textview text separator, textview placessidebar text separator, placessidebar iconview separator,
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user