From 876277c97fefdc6dc16d1ea439eef213bbd1874b Mon Sep 17 00:00:00 2001 From: Komer Date: Thu, 3 Nov 2022 01:07:48 +0100 Subject: [PATCH] improvement: gnopme-shell - search entry color --- gnome-shell/_common.scss | 22 ++++++++++----- gnome-shell/_drawing.scss | 26 +++++++++++------- gnome-shell/gnome-shell.css | 48 ++++++++++++++++++++------------- gnome-shell/v40/gnome-shell.css | 22 +++++++++------ 4 files changed, 74 insertions(+), 44 deletions(-) diff --git a/gnome-shell/_common.scss b/gnome-shell/_common.scss index a60898d..6904992 100755 --- a/gnome-shell/_common.scss +++ b/gnome-shell/_common.scss @@ -821,6 +821,7 @@ StScrollBar { color: $topbar_color; text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9); transition-duration: 100ms; + border-radius: 0.5em; .app-menu-icon { -st-icon-style: symbolic; @@ -836,7 +837,8 @@ StScrollBar { } &:hover { - background: lighten($topbar_bg_color, 10%); + background-color: lighten(mix($selected_bg_color, $base_color, 15%), 6%); + // background: lighten($topbar_bg_color, 10%); color: lighten($topbar_color, 10%); transition-duration: 200ms; } @@ -1426,20 +1428,26 @@ StScrollBar { width: 320px; padding: 9px; border-radius: 100px; - border: none; + border: 1px solid transparentize($osd_borders_color, 0.2); color: $fg_color; background-color: transparentize($bg_color, 0.4); box-shadow: $depth; + + .search-entry-icon { + icon-size: 1em; + padding: 0 4px; + color: transparentize($fg_color,.3); + } + &:focus { - border-width: 0; + border-width: 1px; + border-color: transparentize($theme_color, 0.5); color: $fg_color; background-color: transparentize($bg_color, 0.2); + .search-entry-icon { color: $theme_color; } box-shadow: $depth2; } - - .search-entry-icon { icon-size: 1em; padding: 0 4px; color: transparentize($fg_color,.3); } - - &:hover, &:focus { + &:hover { background-color: transparentize($bg_color, 0.2); .search-entry-icon { color: $fg_color; } } diff --git a/gnome-shell/_drawing.scss b/gnome-shell/_drawing.scss index 94c1735..320acd9 100755 --- a/gnome-shell/_drawing.scss +++ b/gnome-shell/_drawing.scss @@ -13,6 +13,14 @@ // generic drawing of more complex things +// gradient + +@mixin gradient($c1: $g1, $c2: $g2, $dir: horizontal) { + background-gradient-start: $c1 !important; + background-gradient-end: $c2 !important; + background-gradient-direction: $dir; +} + @function _widget_edge($c:$borders_edge) { // outer highlight "used" on most widgets @return 0 1px $c; @@ -34,7 +42,9 @@ @else { box-shadow: $shadow1; } } -// entries +/* * * * * * + * entries * + * * * * * */ @mixin entry($t, $fc:$selected_bg_color, $edge: $borders_edge) { // @@ -64,7 +74,9 @@ } } -// buttons +/* * * * * * + * buttons * + * * * * * */ @function _border_color ($c) { @return darken($c,25%); } // colored buttons want // the border form the @@ -155,7 +167,7 @@ // $_bg: if($c!=$osd_bg_color, transparentize($c, 0.5), $osd_bg_color); - background-color: lighten(mix($bg_color, $base_color, 15%), 8%); + background-color: lighten(mix($selected_bg_color, $base_color, 15%), 8%); color: $selected_fg_color; text-shadow: 0 1px black; icon-shadow: 0 1px black; @@ -170,7 +182,7 @@ $_bg: if($c!=$osd_bg_color, transparentize($c, 0.3), lighten($main_dark, 2%)); - background-color: lighten(mix($bg_color, $base_color, 15%), 7%); + background-color: lighten(mix($selected_bg_color, $base_color, 15%), 6%); color: $selected_fg_color; border: 1px solid $borders_color; text-shadow: 0 1px black; @@ -219,10 +231,4 @@ text-shadow: none; icon-shadow: none; } -} - -@mixin gradient($c1: $g1, $c2: $g2, $dir: horizontal) { - background-gradient-start: $c1 !important; - background-gradient-end: $c2 !important; - background-gradient-direction: $dir; } \ No newline at end of file diff --git a/gnome-shell/gnome-shell.css b/gnome-shell/gnome-shell.css index 85ddbc3..9db8583 100644 --- a/gnome-shell/gnome-shell.css +++ b/gnome-shell/gnome-shell.css @@ -1,6 +1,12 @@ /***************** * Drawing mixins * *****************/ +/* * * * * * + * entries * + * * * * * */ +/* * * * * * + * buttons * + * * * * * */ /* GLOBALS */ stage { font-size: 1em; @@ -19,7 +25,7 @@ stage { border-width: 1px; padding: 0.4em 2em; } .button:focus { - background-color: #1f2642; + background-color: #4f3330; color: #ffffff; text-shadow: 0 1px black; icon-shadow: 0 1px black; @@ -39,7 +45,7 @@ stage { text-shadow: none; icon-shadow: none; } .button:hover { - background-color: #1d243e; + background-color: #492f2d; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.05); text-shadow: 0 1px black; @@ -68,14 +74,14 @@ stage { text-shadow: none; icon-shadow: none; } .modal-dialog-linked-button:focus { - background-color: #1f2642; + background-color: #4f3330; color: #ffffff; text-shadow: 0 1px black; icon-shadow: 0 1px black; box-shadow: none; border: 1px solid rgba(255, 255, 255, 0.05); } .modal-dialog-linked-button:focus:hover { - background-color: #1f2642; + background-color: #4f3330; color: #ffffff; text-shadow: 0 1px black; icon-shadow: 0 1px black; @@ -83,7 +89,7 @@ stage { border: 1px solid rgba(255, 255, 255, 0.05); color: white; } .modal-dialog-linked-button:hover { - background-color: #1d243e; + background-color: #492f2d; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.05); text-shadow: 0 1px black; @@ -745,7 +751,8 @@ StScrollBar { font-weight: bold; color: white; text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9); - transition-duration: 100ms; } + transition-duration: 100ms; + border-radius: 0.5em; } #panel .panel-button .app-menu-icon { -st-icon-style: symbolic; margin-left: 4px; @@ -755,7 +762,7 @@ StScrollBar { #panel .panel-button .popup-menu-arrow { icon-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9); } #panel .panel-button:hover { - background: rgba(41, 47, 69, 0.95); + background-color: #492f2d; color: white; transition-duration: 200ms; } #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { @@ -1012,7 +1019,7 @@ StScrollBar { border: 1px solid rgba(255, 255, 255, 0.05); margin: 1.5em 1.5em 0; } .message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: #1d243e; + background-color: #492f2d; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.05); text-shadow: 0 1px black; @@ -1284,22 +1291,25 @@ StScrollBar { width: 320px; padding: 9px; border-radius: 100px; - border: none; + border: 1px solid rgba(255, 255, 255, 0); color: #bfc3cd; background-color: rgba(14, 17, 29, 0.6); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); } - .search-entry:focus { - border-width: 0; - color: #bfc3cd; - background-color: rgba(14, 17, 29, 0.8); - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); } .search-entry .search-entry-icon { icon-size: 1em; padding: 0 4px; color: rgba(191, 195, 205, 0.7); } - .search-entry:hover, .search-entry:focus { + .search-entry:focus { + border-width: 1px; + border-color: rgba(255, 106, 0, 0.5); + color: #bfc3cd; + background-color: rgba(14, 17, 29, 0.8); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); } + .search-entry:focus .search-entry-icon { + color: #ff6a00; } + .search-entry:hover { background-color: rgba(14, 17, 29, 0.8); } - .search-entry:hover .search-entry-icon, .search-entry:focus .search-entry-icon { + .search-entry:hover .search-entry-icon { color: #bfc3cd; } .search-provider-icon:focus, @@ -1713,14 +1723,14 @@ StScrollBar { font-weight: bold; border-radius: 5px; } .keyboard-key:focus { - background-color: #1f2642; + background-color: #4f3330; color: #ffffff; text-shadow: 0 1px black; icon-shadow: 0 1px black; box-shadow: none; border: 1px solid rgba(255, 255, 255, 0.05); } .keyboard-key:hover, .keyboard-key:checked { - background-color: #1d243e; + background-color: #492f2d; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.05); text-shadow: 0 1px black; @@ -1811,7 +1821,7 @@ StScrollBar { icon-shadow: 0 1px black; border: 1px solid rgba(255, 255, 255, 0.05); } .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { - background-color: #1d243e; + background-color: #492f2d; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.05); text-shadow: 0 1px black; diff --git a/gnome-shell/v40/gnome-shell.css b/gnome-shell/v40/gnome-shell.css index 791f533..94049f4 100644 --- a/gnome-shell/v40/gnome-shell.css +++ b/gnome-shell/v40/gnome-shell.css @@ -1,6 +1,12 @@ /***************** * Drawing mixins * *****************/ +/* * * * * * + * entries * + * * * * * */ +/* * * * * * + * buttons * + * * * * * */ /* GLOBALS */ stage { font-size: 12pt; @@ -18,7 +24,7 @@ stage { border-radius: 6px; padding: 4px 32px; } .button:focus, .app-folder-dialog .edit-folder-button:focus { - background-color: #1f2642; + background-color: #4f3330; color: #ffffff; text-shadow: 0 1px black; icon-shadow: 0 1px black; @@ -38,7 +44,7 @@ stage { text-shadow: none; icon-shadow: none; } .button:hover, .app-folder-dialog .edit-folder-button:hover { - background-color: #1d243e; + background-color: #492f2d; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.05); text-shadow: 0 1px black; @@ -66,21 +72,21 @@ stage { text-shadow: none; icon-shadow: none; } .modal-dialog-linked-button:focus { - background-color: #1f2642; + background-color: #4f3330; color: #ffffff; text-shadow: 0 1px black; icon-shadow: 0 1px black; box-shadow: none; border: 1px solid rgba(255, 255, 255, 0.05); } .modal-dialog-linked-button:focus:hover { - background-color: #1f2642; + background-color: #4f3330; color: #ffffff; text-shadow: 0 1px black; icon-shadow: 0 1px black; box-shadow: none; border: 1px solid rgba(255, 255, 255, 0.05); } .modal-dialog-linked-button:hover { - background-color: #1d243e; + background-color: #492f2d; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.05); text-shadow: 0 1px black; @@ -1685,14 +1691,14 @@ StScrollBar { font-weight: bold; border-radius: 5px; } .keyboard-key:focus { - background-color: #1f2642; + background-color: #4f3330; color: #ffffff; text-shadow: 0 1px black; icon-shadow: 0 1px black; box-shadow: none; border: 1px solid rgba(255, 255, 255, 0.05); } .keyboard-key:hover, .keyboard-key:checked { - background-color: #1d243e; + background-color: #492f2d; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.05); text-shadow: 0 1px black; @@ -1783,7 +1789,7 @@ StScrollBar { icon-shadow: 0 1px black; border: 1px solid rgba(255, 255, 255, 0.05); } .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { - background-color: #1d243e; + background-color: #492f2d; color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.05); text-shadow: 0 1px black;