From ac62a7fb8dfbe3772ad6513f776c4b5782bdace4 Mon Sep 17 00:00:00 2001 From: Komer Date: Sat, 8 Jan 2022 05:28:57 +0100 Subject: [PATCH] Improvement: GTK3&4 - sidebar row hover colors --- gtk-3.0/apps/_nemo.scss | 2 +- gtk-3.0/gtk-dark.css | 22 ++++++++++------------ gtk-3.0/gtk.css | 22 ++++++++++------------ gtk-3.0/widgets/_sidebar.scss | 9 ++++----- gtk-4.0/gtk-dark.css | 8 +++----- gtk-4.0/gtk.css | 8 +++----- gtk-4.0/widgets/_sidebar.scss | 7 +++---- 7 files changed, 34 insertions(+), 44 deletions(-) diff --git a/gtk-3.0/apps/_nemo.scss b/gtk-3.0/apps/_nemo.scss index d8929c3..f30e184 100755 --- a/gtk-3.0/apps/_nemo.scss +++ b/gtk-3.0/apps/_nemo.scss @@ -8,7 +8,7 @@ iconview.cell { } } - .sidebar, statusbar { + .sidebar, statusbar, .nemo-statusbar { color: darken($fg_color, 2%); background: $headerbar_color; .view, .iconview, row { diff --git a/gtk-3.0/gtk-dark.css b/gtk-3.0/gtk-dark.css index 936b0dd..864efdb 100755 --- a/gtk-3.0/gtk-dark.css +++ b/gtk-3.0/gtk-dark.css @@ -4128,7 +4128,7 @@ treeview ~ scrollbar.vertical { .sidebar row:selected label { color: #fefefe; } .sidebar.source-list { - background: #0E111D; + background: #06070c; padding: 4px 0px; } .sidebar.source-list.view, iconview.sidebar.source-list { transition: all .12s ease-in; } @@ -4160,7 +4160,7 @@ stacksidebar row { /*******************************************************************/ /*--*/ placessidebar.sidebar { - background-color: transparent; + background-color: #06070c; /* background-image:linear-gradient(to right, #171e27 40px, $_sidebar_color 35px,$_sidebar_color 36px, $_sidebar_color 36px,$_sidebar_color 99%, @@ -4174,9 +4174,7 @@ placessidebar.sidebar { placessidebar.sidebar row.sidebar-row:hover { transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: rgba(0, 0, 0, 0.76); - background-color: transparent; - /*rgba(65,67,75,0.4); */ - background-image: linear-gradient(to right, rgba(65, 67, 75, 0) 40px, rgba(0, 0, 0, 0.12) 40px, rgba(0, 0, 0, 0.12) 97%); } + background-color: rgba(191, 195, 205, 0.05); } placessidebar.sidebar row.sidebar-row:active:hover { color: rgba(0, 0, 0, 0.76); background-color: rgba(0, 0, 0, 0.23); } @@ -4186,7 +4184,7 @@ placessidebar.sidebar { background-image: linear-gradient(to right, #ff6a00 40px, rgba(65, 67, 75, 0) 36px, rgba(65, 67, 75, 0) 97%); } placessidebar.sidebar row.sidebar-row:selected:hover { color: #ffffff; - background-color: rgba(0, 0, 0, 0.24); } + background-color: rgba(191, 195, 205, 0.05); } placessidebar.sidebar row.sidebar-row:selected:hover .sidebar-icon { color: #ffffff; } placessidebar.sidebar row.sidebar-row:selected:backdrop { @@ -6696,21 +6694,21 @@ ConversationListView { -NemoPlacesTreeView-disk-full-max-length: 100px; -GtkTreeView-vertical-separator: 7; } -.nemo-window .sidebar, .nemo-window statusbar { +.nemo-window .sidebar, .nemo-window statusbar, .nemo-window .nemo-statusbar { color: #b9bec9; background: #06070c; } - .nemo-window .sidebar .view, .nemo-window .sidebar iconview, .nemo-window .sidebar .iconview, .nemo-window .sidebar row, .nemo-window statusbar .view, .nemo-window statusbar iconview, .nemo-window statusbar .iconview, .nemo-window statusbar row { + .nemo-window .sidebar .view, .nemo-window .sidebar iconview, .nemo-window .sidebar .iconview, .nemo-window .sidebar row, .nemo-window statusbar .view, .nemo-window statusbar iconview, .nemo-window statusbar .iconview, .nemo-window statusbar row, .nemo-window .nemo-statusbar .view, .nemo-window .nemo-statusbar iconview, .nemo-window .nemo-statusbar .iconview, .nemo-window .nemo-statusbar row { background-color: transparent; } - .nemo-window .sidebar .view:hover, .nemo-window .sidebar iconview:hover, .nemo-window .sidebar .iconview:hover, .nemo-window .sidebar row:hover, .nemo-window statusbar .view:hover, .nemo-window statusbar iconview:hover, .nemo-window statusbar .iconview:hover, .nemo-window statusbar row:hover { + .nemo-window .sidebar .view:hover, .nemo-window .sidebar iconview:hover, .nemo-window .sidebar .iconview:hover, .nemo-window .sidebar row:hover, .nemo-window statusbar .view:hover, .nemo-window statusbar iconview:hover, .nemo-window statusbar .iconview:hover, .nemo-window statusbar row:hover, .nemo-window .nemo-statusbar .view:hover, .nemo-window .nemo-statusbar iconview:hover, .nemo-window .nemo-statusbar .iconview:hover, .nemo-window .nemo-statusbar row:hover { color: #ff6a00; background-color: rgba(191, 195, 205, 0.05); } - .nemo-window .sidebar .view:selected, .nemo-window .sidebar iconview:selected, .nemo-window .sidebar .view:active, .nemo-window .sidebar iconview:active, .nemo-window .sidebar .view:checked, .nemo-window .sidebar iconview:checked, .nemo-window .sidebar .iconview:selected, .nemo-window .sidebar .iconview:active, .nemo-window .sidebar .iconview:checked, .nemo-window .sidebar row:selected, .nemo-window .sidebar row:active, .nemo-window .sidebar row:checked, .nemo-window statusbar .view:selected, .nemo-window statusbar iconview:selected, .nemo-window statusbar .view:active, .nemo-window statusbar iconview:active, .nemo-window statusbar .view:checked, .nemo-window statusbar iconview:checked, .nemo-window statusbar .iconview:selected, .nemo-window statusbar .iconview:active, .nemo-window statusbar .iconview:checked, .nemo-window statusbar row:selected, .nemo-window statusbar row:active, .nemo-window statusbar row:checked { + .nemo-window .sidebar .view:selected, .nemo-window .sidebar iconview:selected, .nemo-window .sidebar .view:active, .nemo-window .sidebar iconview:active, .nemo-window .sidebar .view:checked, .nemo-window .sidebar iconview:checked, .nemo-window .sidebar .iconview:selected, .nemo-window .sidebar .iconview:active, .nemo-window .sidebar .iconview:checked, .nemo-window .sidebar row:selected, .nemo-window .sidebar row:active, .nemo-window .sidebar row:checked, .nemo-window statusbar .view:selected, .nemo-window statusbar iconview:selected, .nemo-window statusbar .view:active, .nemo-window statusbar iconview:active, .nemo-window statusbar .view:checked, .nemo-window statusbar iconview:checked, .nemo-window statusbar .iconview:selected, .nemo-window statusbar .iconview:active, .nemo-window statusbar .iconview:checked, .nemo-window statusbar row:selected, .nemo-window statusbar row:active, .nemo-window statusbar row:checked, .nemo-window .nemo-statusbar .view:selected, .nemo-window .nemo-statusbar iconview:selected, .nemo-window .nemo-statusbar .view:active, .nemo-window .nemo-statusbar iconview:active, .nemo-window .nemo-statusbar .view:checked, .nemo-window .nemo-statusbar iconview:checked, .nemo-window .nemo-statusbar .iconview:selected, .nemo-window .nemo-statusbar .iconview:active, .nemo-window .nemo-statusbar .iconview:checked, .nemo-window .nemo-statusbar row:selected, .nemo-window .nemo-statusbar row:active, .nemo-window .nemo-statusbar row:checked { color: #fefefe; background: #ff6a00; } - .nemo-window .sidebar .view:backdrop, .nemo-window .sidebar iconview:backdrop, .nemo-window .sidebar .iconview:backdrop, .nemo-window .sidebar row:backdrop, .nemo-window statusbar .view:backdrop, .nemo-window statusbar iconview:backdrop, .nemo-window statusbar .iconview:backdrop, .nemo-window statusbar row:backdrop { + .nemo-window .sidebar .view:backdrop, .nemo-window .sidebar iconview:backdrop, .nemo-window .sidebar .iconview:backdrop, .nemo-window .sidebar row:backdrop, .nemo-window statusbar .view:backdrop, .nemo-window statusbar iconview:backdrop, .nemo-window statusbar .iconview:backdrop, .nemo-window statusbar row:backdrop, .nemo-window .nemo-statusbar .view:backdrop, .nemo-window .nemo-statusbar iconview:backdrop, .nemo-window .nemo-statusbar .iconview:backdrop, .nemo-window .nemo-statusbar row:backdrop { color: #676a75; background-color: inherit; } - .nemo-window .sidebar .view:backdrop:selected, .nemo-window .sidebar iconview:backdrop:selected, .nemo-window .sidebar .iconview:backdrop:selected, .nemo-window .sidebar row:backdrop:selected, .nemo-window statusbar .view:backdrop:selected, .nemo-window statusbar iconview:backdrop:selected, .nemo-window statusbar .iconview:backdrop:selected, .nemo-window statusbar row:backdrop:selected { + .nemo-window .sidebar .view:backdrop:selected, .nemo-window .sidebar iconview:backdrop:selected, .nemo-window .sidebar .iconview:backdrop:selected, .nemo-window .sidebar row:backdrop:selected, .nemo-window statusbar .view:backdrop:selected, .nemo-window statusbar iconview:backdrop:selected, .nemo-window statusbar .iconview:backdrop:selected, .nemo-window statusbar row:backdrop:selected, .nemo-window .nemo-statusbar .view:backdrop:selected, .nemo-window .nemo-statusbar iconview:backdrop:selected, .nemo-window .nemo-statusbar .iconview:backdrop:selected, .nemo-window .nemo-statusbar row:backdrop:selected { color: rgba(254, 254, 254, 0.5); background-color: rgba(255, 106, 0, 0.6); } diff --git a/gtk-3.0/gtk.css b/gtk-3.0/gtk.css index 936b0dd..864efdb 100755 --- a/gtk-3.0/gtk.css +++ b/gtk-3.0/gtk.css @@ -4128,7 +4128,7 @@ treeview ~ scrollbar.vertical { .sidebar row:selected label { color: #fefefe; } .sidebar.source-list { - background: #0E111D; + background: #06070c; padding: 4px 0px; } .sidebar.source-list.view, iconview.sidebar.source-list { transition: all .12s ease-in; } @@ -4160,7 +4160,7 @@ stacksidebar row { /*******************************************************************/ /*--*/ placessidebar.sidebar { - background-color: transparent; + background-color: #06070c; /* background-image:linear-gradient(to right, #171e27 40px, $_sidebar_color 35px,$_sidebar_color 36px, $_sidebar_color 36px,$_sidebar_color 99%, @@ -4174,9 +4174,7 @@ placessidebar.sidebar { placessidebar.sidebar row.sidebar-row:hover { transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: rgba(0, 0, 0, 0.76); - background-color: transparent; - /*rgba(65,67,75,0.4); */ - background-image: linear-gradient(to right, rgba(65, 67, 75, 0) 40px, rgba(0, 0, 0, 0.12) 40px, rgba(0, 0, 0, 0.12) 97%); } + background-color: rgba(191, 195, 205, 0.05); } placessidebar.sidebar row.sidebar-row:active:hover { color: rgba(0, 0, 0, 0.76); background-color: rgba(0, 0, 0, 0.23); } @@ -4186,7 +4184,7 @@ placessidebar.sidebar { background-image: linear-gradient(to right, #ff6a00 40px, rgba(65, 67, 75, 0) 36px, rgba(65, 67, 75, 0) 97%); } placessidebar.sidebar row.sidebar-row:selected:hover { color: #ffffff; - background-color: rgba(0, 0, 0, 0.24); } + background-color: rgba(191, 195, 205, 0.05); } placessidebar.sidebar row.sidebar-row:selected:hover .sidebar-icon { color: #ffffff; } placessidebar.sidebar row.sidebar-row:selected:backdrop { @@ -6696,21 +6694,21 @@ ConversationListView { -NemoPlacesTreeView-disk-full-max-length: 100px; -GtkTreeView-vertical-separator: 7; } -.nemo-window .sidebar, .nemo-window statusbar { +.nemo-window .sidebar, .nemo-window statusbar, .nemo-window .nemo-statusbar { color: #b9bec9; background: #06070c; } - .nemo-window .sidebar .view, .nemo-window .sidebar iconview, .nemo-window .sidebar .iconview, .nemo-window .sidebar row, .nemo-window statusbar .view, .nemo-window statusbar iconview, .nemo-window statusbar .iconview, .nemo-window statusbar row { + .nemo-window .sidebar .view, .nemo-window .sidebar iconview, .nemo-window .sidebar .iconview, .nemo-window .sidebar row, .nemo-window statusbar .view, .nemo-window statusbar iconview, .nemo-window statusbar .iconview, .nemo-window statusbar row, .nemo-window .nemo-statusbar .view, .nemo-window .nemo-statusbar iconview, .nemo-window .nemo-statusbar .iconview, .nemo-window .nemo-statusbar row { background-color: transparent; } - .nemo-window .sidebar .view:hover, .nemo-window .sidebar iconview:hover, .nemo-window .sidebar .iconview:hover, .nemo-window .sidebar row:hover, .nemo-window statusbar .view:hover, .nemo-window statusbar iconview:hover, .nemo-window statusbar .iconview:hover, .nemo-window statusbar row:hover { + .nemo-window .sidebar .view:hover, .nemo-window .sidebar iconview:hover, .nemo-window .sidebar .iconview:hover, .nemo-window .sidebar row:hover, .nemo-window statusbar .view:hover, .nemo-window statusbar iconview:hover, .nemo-window statusbar .iconview:hover, .nemo-window statusbar row:hover, .nemo-window .nemo-statusbar .view:hover, .nemo-window .nemo-statusbar iconview:hover, .nemo-window .nemo-statusbar .iconview:hover, .nemo-window .nemo-statusbar row:hover { color: #ff6a00; background-color: rgba(191, 195, 205, 0.05); } - .nemo-window .sidebar .view:selected, .nemo-window .sidebar iconview:selected, .nemo-window .sidebar .view:active, .nemo-window .sidebar iconview:active, .nemo-window .sidebar .view:checked, .nemo-window .sidebar iconview:checked, .nemo-window .sidebar .iconview:selected, .nemo-window .sidebar .iconview:active, .nemo-window .sidebar .iconview:checked, .nemo-window .sidebar row:selected, .nemo-window .sidebar row:active, .nemo-window .sidebar row:checked, .nemo-window statusbar .view:selected, .nemo-window statusbar iconview:selected, .nemo-window statusbar .view:active, .nemo-window statusbar iconview:active, .nemo-window statusbar .view:checked, .nemo-window statusbar iconview:checked, .nemo-window statusbar .iconview:selected, .nemo-window statusbar .iconview:active, .nemo-window statusbar .iconview:checked, .nemo-window statusbar row:selected, .nemo-window statusbar row:active, .nemo-window statusbar row:checked { + .nemo-window .sidebar .view:selected, .nemo-window .sidebar iconview:selected, .nemo-window .sidebar .view:active, .nemo-window .sidebar iconview:active, .nemo-window .sidebar .view:checked, .nemo-window .sidebar iconview:checked, .nemo-window .sidebar .iconview:selected, .nemo-window .sidebar .iconview:active, .nemo-window .sidebar .iconview:checked, .nemo-window .sidebar row:selected, .nemo-window .sidebar row:active, .nemo-window .sidebar row:checked, .nemo-window statusbar .view:selected, .nemo-window statusbar iconview:selected, .nemo-window statusbar .view:active, .nemo-window statusbar iconview:active, .nemo-window statusbar .view:checked, .nemo-window statusbar iconview:checked, .nemo-window statusbar .iconview:selected, .nemo-window statusbar .iconview:active, .nemo-window statusbar .iconview:checked, .nemo-window statusbar row:selected, .nemo-window statusbar row:active, .nemo-window statusbar row:checked, .nemo-window .nemo-statusbar .view:selected, .nemo-window .nemo-statusbar iconview:selected, .nemo-window .nemo-statusbar .view:active, .nemo-window .nemo-statusbar iconview:active, .nemo-window .nemo-statusbar .view:checked, .nemo-window .nemo-statusbar iconview:checked, .nemo-window .nemo-statusbar .iconview:selected, .nemo-window .nemo-statusbar .iconview:active, .nemo-window .nemo-statusbar .iconview:checked, .nemo-window .nemo-statusbar row:selected, .nemo-window .nemo-statusbar row:active, .nemo-window .nemo-statusbar row:checked { color: #fefefe; background: #ff6a00; } - .nemo-window .sidebar .view:backdrop, .nemo-window .sidebar iconview:backdrop, .nemo-window .sidebar .iconview:backdrop, .nemo-window .sidebar row:backdrop, .nemo-window statusbar .view:backdrop, .nemo-window statusbar iconview:backdrop, .nemo-window statusbar .iconview:backdrop, .nemo-window statusbar row:backdrop { + .nemo-window .sidebar .view:backdrop, .nemo-window .sidebar iconview:backdrop, .nemo-window .sidebar .iconview:backdrop, .nemo-window .sidebar row:backdrop, .nemo-window statusbar .view:backdrop, .nemo-window statusbar iconview:backdrop, .nemo-window statusbar .iconview:backdrop, .nemo-window statusbar row:backdrop, .nemo-window .nemo-statusbar .view:backdrop, .nemo-window .nemo-statusbar iconview:backdrop, .nemo-window .nemo-statusbar .iconview:backdrop, .nemo-window .nemo-statusbar row:backdrop { color: #676a75; background-color: inherit; } - .nemo-window .sidebar .view:backdrop:selected, .nemo-window .sidebar iconview:backdrop:selected, .nemo-window .sidebar .iconview:backdrop:selected, .nemo-window .sidebar row:backdrop:selected, .nemo-window statusbar .view:backdrop:selected, .nemo-window statusbar iconview:backdrop:selected, .nemo-window statusbar .iconview:backdrop:selected, .nemo-window statusbar row:backdrop:selected { + .nemo-window .sidebar .view:backdrop:selected, .nemo-window .sidebar iconview:backdrop:selected, .nemo-window .sidebar .iconview:backdrop:selected, .nemo-window .sidebar row:backdrop:selected, .nemo-window statusbar .view:backdrop:selected, .nemo-window statusbar iconview:backdrop:selected, .nemo-window statusbar .iconview:backdrop:selected, .nemo-window statusbar row:backdrop:selected, .nemo-window .nemo-statusbar .view:backdrop:selected, .nemo-window .nemo-statusbar iconview:backdrop:selected, .nemo-window .nemo-statusbar .iconview:backdrop:selected, .nemo-window .nemo-statusbar row:backdrop:selected { color: rgba(254, 254, 254, 0.5); background-color: rgba(255, 106, 0, 0.6); } diff --git a/gtk-3.0/widgets/_sidebar.scss b/gtk-3.0/widgets/_sidebar.scss index 3e4379c..36c475d 100755 --- a/gtk-3.0/widgets/_sidebar.scss +++ b/gtk-3.0/widgets/_sidebar.scss @@ -58,7 +58,7 @@ //elementary os file manager &.source-list{ - background: $_sidebar_color; + background: $headerbar_color; padding: 4px 0px; &.view{ transition: all .12s ease-in; @@ -120,7 +120,7 @@ stacksidebar { placessidebar{ &.sidebar{ - background-color: transparent; + background-color: $headerbar_color; /* background-image:linear-gradient(to right, #171e27 40px, $_sidebar_color 35px,$_sidebar_color 36px, $_sidebar_color 36px,$_sidebar_color 99%, @@ -140,8 +140,7 @@ placessidebar{ &:hover{ transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: rgba(0,0,0,0.76); - background-color: transparent; /*rgba(65,67,75,0.4); */ - background-image:linear-gradient(to right, rgba(65,67,75,0) 40px, rgba(0,0,0,0.12) 40px,rgba(0,0,0,0.12) 97%); + background-color: if(variant == light, transparentize($fg_color, 0.9), transparentize($fg_color, 0.95)); } &:active{ @@ -158,7 +157,7 @@ placessidebar{ rgba(65,67,75,0) 36px, rgba(65,67,75,0)97%); &:hover{ color: #ffffff; - background-color: rgba(0,0,0,0.24); + background-color: if(variant == light, transparentize($fg_color, 0.9), transparentize($fg_color, 0.95)); .sidebar-icon { color: #ffffff; } diff --git a/gtk-4.0/gtk-dark.css b/gtk-4.0/gtk-dark.css index 2a925c2..c2ef0ca 100755 --- a/gtk-4.0/gtk-dark.css +++ b/gtk-4.0/gtk-dark.css @@ -4114,7 +4114,7 @@ treeview ~ scrollbar.vertical { .sidebar row:selected label { color: #fefefe; } .sidebar.source-list { - background: #0E111D; + background: #06070c; padding: 4px 0px; } .sidebar.source-list.view, iconview.sidebar.source-list { transition: all .12s ease-in; } @@ -4160,9 +4160,7 @@ placessidebar.sidebar { placessidebar.sidebar row.sidebar-row:hover { transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: rgba(0, 0, 0, 0.76); - background-color: transparent; - /*rgba(65,67,75,0.4); */ - background-image: linear-gradient(to right, rgba(65, 67, 75, 0) 40px, rgba(0, 0, 0, 0.12) 40px, rgba(0, 0, 0, 0.12) 97%); } + background-color: rgba(191, 195, 205, 0.05); } placessidebar.sidebar row.sidebar-row:active:hover { color: rgba(0, 0, 0, 0.76); background-color: rgba(0, 0, 0, 0.23); } @@ -4172,7 +4170,7 @@ placessidebar.sidebar { background-image: linear-gradient(to right, #ff6a00 40px, rgba(65, 67, 75, 0) 36px, rgba(65, 67, 75, 0) 97%); } placessidebar.sidebar row.sidebar-row:selected:hover { color: #ffffff; - background-color: rgba(0, 0, 0, 0.24); } + background-color: rgba(191, 195, 205, 0.05); } placessidebar.sidebar row.sidebar-row:selected:hover .sidebar-icon { color: #ffffff; } placessidebar.sidebar row.sidebar-row:selected:backdrop { diff --git a/gtk-4.0/gtk.css b/gtk-4.0/gtk.css index 2a925c2..c2ef0ca 100755 --- a/gtk-4.0/gtk.css +++ b/gtk-4.0/gtk.css @@ -4114,7 +4114,7 @@ treeview ~ scrollbar.vertical { .sidebar row:selected label { color: #fefefe; } .sidebar.source-list { - background: #0E111D; + background: #06070c; padding: 4px 0px; } .sidebar.source-list.view, iconview.sidebar.source-list { transition: all .12s ease-in; } @@ -4160,9 +4160,7 @@ placessidebar.sidebar { placessidebar.sidebar row.sidebar-row:hover { transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: rgba(0, 0, 0, 0.76); - background-color: transparent; - /*rgba(65,67,75,0.4); */ - background-image: linear-gradient(to right, rgba(65, 67, 75, 0) 40px, rgba(0, 0, 0, 0.12) 40px, rgba(0, 0, 0, 0.12) 97%); } + background-color: rgba(191, 195, 205, 0.05); } placessidebar.sidebar row.sidebar-row:active:hover { color: rgba(0, 0, 0, 0.76); background-color: rgba(0, 0, 0, 0.23); } @@ -4172,7 +4170,7 @@ placessidebar.sidebar { background-image: linear-gradient(to right, #ff6a00 40px, rgba(65, 67, 75, 0) 36px, rgba(65, 67, 75, 0) 97%); } placessidebar.sidebar row.sidebar-row:selected:hover { color: #ffffff; - background-color: rgba(0, 0, 0, 0.24); } + background-color: rgba(191, 195, 205, 0.05); } placessidebar.sidebar row.sidebar-row:selected:hover .sidebar-icon { color: #ffffff; } placessidebar.sidebar row.sidebar-row:selected:backdrop { diff --git a/gtk-4.0/widgets/_sidebar.scss b/gtk-4.0/widgets/_sidebar.scss index 3e4379c..5ad8c8c 100755 --- a/gtk-4.0/widgets/_sidebar.scss +++ b/gtk-4.0/widgets/_sidebar.scss @@ -58,7 +58,7 @@ //elementary os file manager &.source-list{ - background: $_sidebar_color; + background: $headerbar_color; padding: 4px 0px; &.view{ transition: all .12s ease-in; @@ -140,8 +140,7 @@ placessidebar{ &:hover{ transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: rgba(0,0,0,0.76); - background-color: transparent; /*rgba(65,67,75,0.4); */ - background-image:linear-gradient(to right, rgba(65,67,75,0) 40px, rgba(0,0,0,0.12) 40px,rgba(0,0,0,0.12) 97%); + background-color: if(variant == light, transparentize($fg_color, 0.9), transparentize($fg_color, 0.95)); } &:active{ @@ -158,7 +157,7 @@ placessidebar{ rgba(65,67,75,0) 36px, rgba(65,67,75,0)97%); &:hover{ color: #ffffff; - background-color: rgba(0,0,0,0.24); + background-color: if(variant == light, transparentize($fg_color, 0.9), transparentize($fg_color, 0.95)); .sidebar-icon { color: #ffffff; }