GTK3: change scrollbar colors
This commit is contained in:
parent
83c0fbfcce
commit
c8c7afdf0c
@ -2957,7 +2957,7 @@ notebook > stack:not(:only-child) {
|
||||
* Scrollbars *
|
||||
**************/
|
||||
scrollbar {
|
||||
background-color: #252831;
|
||||
background-color: #272a34;
|
||||
transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
|
||||
* {
|
||||
-GtkScrollbar-has-backward-stepper: false;
|
||||
@ -2971,7 +2971,7 @@ scrollbar {
|
||||
scrollbar.right {
|
||||
border-left: 1px solid #0d0e11; }
|
||||
scrollbar:backdrop {
|
||||
background-color: #1c1e25;
|
||||
background-color: #272a34;
|
||||
border-color: #111217;
|
||||
transition: 200ms ease-out; }
|
||||
scrollbar slider {
|
||||
@ -2981,11 +2981,11 @@ scrollbar {
|
||||
border: 4px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-clip: padding-box;
|
||||
background-color: #9d9ea0; }
|
||||
background-color: #41434b; }
|
||||
scrollbar slider:hover {
|
||||
background-color: #c5c6c6; }
|
||||
background-color: #4b4d54; }
|
||||
scrollbar slider:hover:active {
|
||||
background-color: #5a97ff; }
|
||||
background-color: #2777ff; }
|
||||
scrollbar slider:backdrop {
|
||||
background-color: #4b4e54; }
|
||||
scrollbar slider:disabled {
|
||||
@ -3046,7 +3046,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: #9d9ea0; }
|
||||
color: #41434b; }
|
||||
scrollbar button:hover {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -3054,7 +3054,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: #c5c6c6; }
|
||||
color: #4b4d54; }
|
||||
scrollbar button:active, scrollbar button:checked {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -3062,7 +3062,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: #5a97ff; }
|
||||
color: #2777ff; }
|
||||
scrollbar button:disabled {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -3070,7 +3070,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: rgba(157, 158, 160, 0.2); }
|
||||
color: rgba(65, 67, 75, 0.2); }
|
||||
scrollbar button:backdrop {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -4398,12 +4398,12 @@ scrolledwindow overshoot.right {
|
||||
scrolledwindow junction {
|
||||
border-color: transparent;
|
||||
border-image: linear-gradient(to bottom, #0d0e11 1px, transparent 1px) 0 0 0 1/0 1px stretch;
|
||||
background-color: #252831; }
|
||||
background-color: #272a34; }
|
||||
scrolledwindow junction:dir(rtl) {
|
||||
border-image-slice: 0 1 0 0; }
|
||||
scrolledwindow junction:backdrop {
|
||||
border-image-source: linear-gradient(to bottom, #111217 1px, transparent 1px);
|
||||
background-color: #1c1e25;
|
||||
background-color: #272a34;
|
||||
transition: 200ms ease-out; }
|
||||
|
||||
separator {
|
||||
|
||||
@ -2957,7 +2957,7 @@ notebook > stack:not(:only-child) {
|
||||
* Scrollbars *
|
||||
**************/
|
||||
scrollbar {
|
||||
background-color: #252831;
|
||||
background-color: #272a34;
|
||||
transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
|
||||
* {
|
||||
-GtkScrollbar-has-backward-stepper: false;
|
||||
@ -2971,7 +2971,7 @@ scrollbar {
|
||||
scrollbar.right {
|
||||
border-left: 1px solid #0d0e11; }
|
||||
scrollbar:backdrop {
|
||||
background-color: #1c1e25;
|
||||
background-color: #272a34;
|
||||
border-color: #111217;
|
||||
transition: 200ms ease-out; }
|
||||
scrollbar slider {
|
||||
@ -2981,11 +2981,11 @@ scrollbar {
|
||||
border: 4px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-clip: padding-box;
|
||||
background-color: #9d9ea0; }
|
||||
background-color: #41434b; }
|
||||
scrollbar slider:hover {
|
||||
background-color: #c5c6c6; }
|
||||
background-color: #4b4d54; }
|
||||
scrollbar slider:hover:active {
|
||||
background-color: #5a97ff; }
|
||||
background-color: #2777ff; }
|
||||
scrollbar slider:backdrop {
|
||||
background-color: #4b4e54; }
|
||||
scrollbar slider:disabled {
|
||||
@ -3046,7 +3046,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: #9d9ea0; }
|
||||
color: #41434b; }
|
||||
scrollbar button:hover {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -3054,7 +3054,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: #c5c6c6; }
|
||||
color: #4b4d54; }
|
||||
scrollbar button:active, scrollbar button:checked {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -3062,7 +3062,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: #5a97ff; }
|
||||
color: #2777ff; }
|
||||
scrollbar button:disabled {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -3070,7 +3070,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: rgba(157, 158, 160, 0.2); }
|
||||
color: rgba(65, 67, 75, 0.2); }
|
||||
scrollbar button:backdrop {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -4398,12 +4398,12 @@ scrolledwindow overshoot.right {
|
||||
scrolledwindow junction {
|
||||
border-color: transparent;
|
||||
border-image: linear-gradient(to bottom, #0d0e11 1px, transparent 1px) 0 0 0 1/0 1px stretch;
|
||||
background-color: #252831; }
|
||||
background-color: #272a34; }
|
||||
scrolledwindow junction:dir(rtl) {
|
||||
border-image-slice: 0 1 0 0; }
|
||||
scrolledwindow junction:backdrop {
|
||||
border-image-source: linear-gradient(to bottom, #111217 1px, transparent 1px);
|
||||
background-color: #1c1e25;
|
||||
background-color: #272a34;
|
||||
transition: 200ms ease-out; }
|
||||
|
||||
separator {
|
||||
|
||||
@ -2968,7 +2968,7 @@ notebook > stack:not(:only-child) {
|
||||
* Scrollbars *
|
||||
**************/
|
||||
scrollbar {
|
||||
background-color: #dedfe2;
|
||||
background-color: #fafafa;
|
||||
transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
|
||||
* {
|
||||
-GtkScrollbar-has-backward-stepper: false;
|
||||
@ -2982,7 +2982,7 @@ scrollbar {
|
||||
scrollbar.right {
|
||||
border-left: 1px solid #d9d9d9; }
|
||||
scrollbar:backdrop {
|
||||
background-color: #f7f7f7;
|
||||
background-color: #fafafa;
|
||||
border-color: #e0e0e0;
|
||||
transition: 200ms ease-out; }
|
||||
scrollbar slider {
|
||||
@ -2992,11 +2992,11 @@ scrollbar {
|
||||
border: 4px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-clip: padding-box;
|
||||
background-color: #9da0a7; }
|
||||
background-color: #ced0d3; }
|
||||
scrollbar slider:hover {
|
||||
background-color: #7d8189; }
|
||||
background-color: #c6c8cc; }
|
||||
scrollbar slider:hover:active {
|
||||
background-color: #005af3; }
|
||||
background-color: #2777ff; }
|
||||
scrollbar slider:backdrop {
|
||||
background-color: #dfdfe2; }
|
||||
scrollbar slider:disabled {
|
||||
@ -3057,7 +3057,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: #9da0a7; }
|
||||
color: #ced0d3; }
|
||||
scrollbar button:hover {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -3065,7 +3065,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: #7d8189; }
|
||||
color: #c6c8cc; }
|
||||
scrollbar button:active, scrollbar button:checked {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -3073,7 +3073,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: #005af3; }
|
||||
color: #2777ff; }
|
||||
scrollbar button:disabled {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -3081,7 +3081,7 @@ scrollbar {
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
-gtk-icon-shadow: none;
|
||||
color: rgba(157, 160, 167, 0.2); }
|
||||
color: rgba(206, 208, 211, 0.2); }
|
||||
scrollbar button:backdrop {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
@ -4421,12 +4421,12 @@ scrolledwindow overshoot.right {
|
||||
scrolledwindow junction {
|
||||
border-color: transparent;
|
||||
border-image: linear-gradient(to bottom, #d9d9d9 1px, transparent 1px) 0 0 0 1/0 1px stretch;
|
||||
background-color: #dedfe2; }
|
||||
background-color: #fafafa; }
|
||||
scrolledwindow junction:dir(rtl) {
|
||||
border-image-slice: 0 1 0 0; }
|
||||
scrolledwindow junction:backdrop {
|
||||
border-image-source: linear-gradient(to bottom, #e0e0e0 1px, transparent 1px);
|
||||
background-color: #f7f7f7;
|
||||
background-color: #fafafa;
|
||||
transition: 200ms ease-out; }
|
||||
|
||||
separator {
|
||||
|
||||
@ -22,10 +22,10 @@ $menu_color: if($variant == 'light', $base_color, mix($borders_color, $bg_color,
|
||||
$popover_bg_color: $menu_color;
|
||||
$popover_hover_color: lighten($menu_color, 5%);
|
||||
|
||||
$scrollbar_bg_color: if($variant == 'light', mix($bg_color, $fg_color, 80%), mix($base_color, $bg_color, 50%));
|
||||
$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%));
|
||||
$scrollbar_bg_color: $base_color;
|
||||
$scrollbar_slider_color: mix($fg_color, $bg_color, if($variant=='light', 30%, 15%));
|
||||
$scrollbar_slider_hover_color: mix($fg_color, $bg_color, if($variant=='light', 35%, 20%));
|
||||
$scrollbar_slider_active_color: $selected_bg_color;
|
||||
|
||||
$warning_color: #fd7d00;
|
||||
$error_color: #bf1717;
|
||||
@ -64,7 +64,7 @@ $backdrop_borders_color: mix($borders_color, $bg_color, 80%);
|
||||
$backdrop_dark_fill: mix($backdrop_borders_color, $backdrop_bg_color, 35%);
|
||||
$backdrop_sidebar_bg_color: mix($backdrop_bg_color, $backdrop_base_color, 50%);
|
||||
|
||||
$backdrop_scrollbar_bg_color: darken($backdrop_bg_color, 3%);
|
||||
$backdrop_scrollbar_bg_color: $scrollbar_bg_color;
|
||||
$backdrop_scrollbar_slider_color: mix($backdrop_fg_color, $backdrop_bg_color, 40%);
|
||||
|
||||
$backdrop_menu_color: if($variant == 'light', $backdrop_base_color, mix($backdrop_bg_color, $backdrop_base_color, 20%));
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user