From ac3ab1c98c1af08320597ea115cabac2a741938d Mon Sep 17 00:00:00 2001 From: EliverLara Date: Sat, 27 Oct 2018 14:30:45 -0500 Subject: [PATCH] Renew gnome-shell theme --- assets/close_unfocused@2.png | Bin 719 -> 604 bytes gnome-shell/_colors.scss | 16 +- gnome-shell/_common.scss | 123 ++++----- gnome-shell/_drawing.scss | 29 ++- gnome-shell/assets/close-window.svg | 37 ++- gnome-shell/gnome-shell.css | 372 +++++++++++++++------------- 6 files changed, 315 insertions(+), 262 deletions(-) diff --git a/assets/close_unfocused@2.png b/assets/close_unfocused@2.png index f24a80dc65fa07e5cab8a914758a998575e8072c..915522b2d3788868f9041fa9d3f2e1d779adc6bf 100644 GIT binary patch delta 506 zcmX@ldWU5~PCdib0G|+71~6!7Xz!agR(+kUL zYU|rOCQY6;eb$0SOP8-$wR-)g-A7KHK6l~j&3jLuzx(j{>({S8e*OOauWJYYCI$wE z<(@8%Arg{v4`xO)CNi{LydB1&D(StgE8x_+O-qh^{$D@I@S&9Pd-dl9`#!|}Tp74E zX^z*G{ZAuG*A<@BE#0EWZm}Zg$u+)D`o;SF>@q9kEAMW)Jn6gv!;$|_rn7xATEW%jV6S zw{6?DdGqFt8#iv-wrwjIY}>XCBDHz*<}F*cY~8wb^XAQ984zO&7;N3T6-mf{-ei#p`0nSBcKXbPn|k-`t<2DXU?2Gd-nYK z^A|2$xOnm6rAwDCU%q_h$`#8;6;2Ec46Y?Xe!&ckOw25-9NavDBBF9CTDm6IE&+j| zQE>?=Ik^R;wRH_G?VS^*&R@8A$?_Fz)@|6jZO5+thmM{+edgSSYu6t?efH}2pMU>W zi3t@lFfiQoba4!kkepk8@VQe{f<(hbcj>g#-|ijGxp^)&UO-M;LkFUwqccxprT9DYHM*x5p#3g7s6L&}jrtjMc(0}|VLeG0f{u<#MdX<+RzTEBkPe(Lc zXv3DNEdSlUbx(~tye@ppAC175GkfRWdG StIcon, - .popup-menu-arrow { - icon-shadow: 0px 0px 8px rgba(0, 0, 0, 1); - } + transition-duration: 200ms; } &:active, &:overview, &:focus, &:checked { // Trick due to St limitations. It needs a background to draw // a box-shadow - background: lighten($topbar_bg_color, 10%); - box-shadow: inset 0 -2px 0px lighten($selected_bg_color,5%); - color: lighten($topbar_color,10%); - - & > .system-status-icon { icon-shadow: black 0 2px 2px; } + box-shadow: none; + @include gradient(); + color: $selected_fg_color; + text-shadow: 0px 0px 2px rgba(92, 92, 92, 0.9); + transition-duration: 200ms; + .system-status-icon, + .app-menu-icon > StIcon, + .popup-menu-arrow { + icon-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9); + } + & > .system-status-icon { icon-shadow: red 0 2px 2px; } } .system-status-icon { icon-size: 1.09em; padding: 0 5px; } @@ -838,7 +841,7 @@ StScrollBar { .screencast-indicator { color: $warning_color; } &.solid { - background-color: darken($dracula,1%); + background-color: $dracula; /* transition from transparent to solid */ transition-duration: 300ms; @@ -874,9 +877,11 @@ StScrollBar { .datemenu-displays-box { spacing: 1em; } .datemenu-calendar-column { - border: 0 solid $borders_color; + border: 0 solid transparent; &:ltr { border-left-width: 1px; } &:rtl { border-right-width: 1px; } + background: darken($bg_color, 0.7%); + //@include gradient(); } .datemenu-today-button, @@ -919,7 +924,7 @@ StScrollBar { .weather-header, .events-section-title, .message-list-section-title { - color: lighten($fg_color,2%); + color: darken($fg_color, 10%); font-weight: bold; } @@ -965,12 +970,12 @@ StScrollBar { border-radius: 1.4em; &:hover,&:focus { background-color: lighten($bg_color,5%); } &:active,&:selected { - color: lighten($selected_fg_color,5%); + color: $selected_fg_color; background-color: $selected_bg_color; border-color: transparent; //avoid jumparound due to today } &.calendar-day-heading { //day of week heading - color: darken($fg_color,4%); + color: darken($fg_color, 10%); margin-top: 1em; font-size: 70%; } @@ -1017,18 +1022,15 @@ StScrollBar { width: 31.5em; .message-title{ color: darken($fg_color,5%); - } .message-content{ - + } } .message-list-clear-button.button { - background-color: transparent; - border: 1px solid $borders_color; - box-shadow: none; - &:hover,&:focus { background-color: lighten($bg_color,5%); } + @include button(normal); + &:hover,&:focus { @include button(hover); } margin: 1.5em 1.5em 0; } @@ -1058,7 +1060,8 @@ StScrollBar { .message { &:hover,&:focus { - background-color: lighten($bg_color,2%); + background-color: darken($bg_color, 1%); + //@include gradient(); box-shadow: 3px 0px 0px 0px $selected_bg_color inset; } border-radius: 1px; @@ -1156,16 +1159,20 @@ StScrollBar { color: $fg_color; border-radius: 32px; /* wish we could do 50% */ - border: 1px solid transparent; - background: transparent; + border: 1px solid $borders_color; + background: darken($bg_color, 3%); padding: 13px; &:hover, &:focus { - //border: 1px solid $selected_bg_color; + border: 1px solid $selected_bg_color; color: $selected_bg_color; background: transparent; } - &:active { background-color: darken($selected_bg_color, 10%); color: $selected_fg_color;} + &:active { + background-color: darken($selected_bg_color, 10%); + color: $selected_fg_color; + border: 1px solid darken($selected_bg_color, 10%); + } & > StIcon { icon-size: 16px; } } @@ -1269,7 +1276,7 @@ StScrollBar { } .window-caption { spacing: 20px; - color: $fg_color; + color: $topbar_color; background-color: transparentize($osd_bg_color,.3); border-radius: 2px; padding: 4px 8px; @@ -1278,8 +1285,8 @@ StScrollBar { //search entry .search-entry { width: 320px; - padding: 7px 9px; - border-radius: 2px; + padding: 9px; + border-radius: 100px; border: none; color: $fg_color; background-color: transparentize($bg_color, 0.4); @@ -1335,7 +1342,7 @@ StScrollBar { color: $topbar_color; background-color: $topbar_bg_color; padding: 6px 0; - border: 1px solid rgba(128, 128, 128, 0.2); + border: 1px solid $borders_color; border-left: 0px; border-radius: 0px 5px 5px 0px; @@ -1364,7 +1371,7 @@ StScrollBar { border-radius: 7px; padding: 4px 12px; color: $topbar_color; - background-color: transparentize($topbar_bg_color,0.01); + background-color: $topbar_bg_color; text-align: center; -x-offset: 8px; } @@ -1439,10 +1446,10 @@ StScrollBar { } .app-well-app-running-dot { //running apps indicator - width: 5px; height: 5px; - background-color: lighten( $selected_bg_color, 25%); + width: 4px; height: 4px; + background-color: $selected_bg_color; border-radius: 10px !important; - box-shadow: 0px 0px 5px 4px transparentize( $selected_bg_color,0.2); + box-shadow: 0px 0px 5px 4px transparentize($selected_bg_color,0.2); margin-bottom: 0px; } @@ -1691,15 +1698,13 @@ StScrollBar { .keyboard-row { spacing: 15px; } .keyboard-key { - @include button(normal); - background: $base_color; + @include button(normal); + background-color: $base_color; min-height: 2em; min-width: 2em; font-size: 14pt; font-weight: bold; border-radius: 5px; - border: 1px solid $borders-color; - color: white; &:focus { @include button(focus); } &:hover,&:checked { @include button(hover); } &:active { @include button(active);} @@ -2038,4 +2043,4 @@ StScrollBar { border: 2px solid grey; border-radius: 4px; padding: 6px; - } + } \ No newline at end of file diff --git a/gnome-shell/_drawing.scss b/gnome-shell/_drawing.scss index 81f6f03..70a90f0 100644 --- a/gnome-shell/_drawing.scss +++ b/gnome-shell/_drawing.scss @@ -56,7 +56,7 @@ // @if $t==normal { - background-color: transparentize($gray, 0.5); + background-color: $gray; border-color: $borders_color; @include _shadows($depth); @@ -149,11 +149,12 @@ // color: $fg_color; - background-color: darken($bg_color,5%); - box-shadow: $depth4; - border: none; + background-color: $main_dark; + box-shadow: none; + border: 1px solid $borders_color; text-shadow: 0 1px black; icon-shadow: 0 1px black; + border: 1px solid $borders_color; } @if $t==focus { // @@ -162,11 +163,11 @@ $_bg: if($c!=$osd_bg_color, transparentize($c, 0.5), $osd_bg_color); - color: $osd_fg_color; + color: $selected_bg_color; text-shadow: 0 1px black; icon-shadow: 0 1px black; - box-shadow: $depth5; - border: 1px solid transparentize($selected_bg_color, 0.7); + box-shadow: none; + border: 1px solid $borders_color; } @else if $t==hover { @@ -174,12 +175,11 @@ // active osd button // $_bg: if($c!=$osd_bg_color, transparentize($c, 0.3), - lighten($osd_bg_color,10%)); + lighten($main_dark, 2%)); color: $selected_bg_color; background-color: $_bg; - box-shadow: $depth5; - border: none; + border: 1px solid $borders_color; text-shadow: 0 1px black; icon-shadow: 0 1px black; @@ -195,8 +195,7 @@ // This should be none, but it's creating some issues with borders, so to // workaround it for now, use inset wich goes through a different code path. // see https://bugzilla.gnome.org/show_bug.cgi?id=752934 - box-shadow: $depth5; - border: none; + border: 1px solid $borders_color; text-shadow: none; icon-shadow: none; } @@ -228,3 +227,9 @@ icon-shadow: none; } } + +@mixin gradient($c1: $g1, $c2: $g2, $dir: horizontal) { + background-gradient-start: $c1; + background-gradient-end: $c2; + background-gradient-direction: $dir; +} \ No newline at end of file diff --git a/gnome-shell/assets/close-window.svg b/gnome-shell/assets/close-window.svg index 6e7883b..99d6db3 100644 --- a/gnome-shell/assets/close-window.svg +++ b/gnome-shell/assets/close-window.svg @@ -7,6 +7,7 @@ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.0" @@ -19,13 +20,21 @@ enable-background="new 0 0 16 16" xml:space="preserve" sodipodi:version="0.32" - inkscape:version="0.91 r13725" + inkscape:version="0.92.3 (2405546, 2018-03-11)" sodipodi:docname="close-window.svg" inkscape:output_extension="org.inkscape.output.svg.inkscape">image/svg+xml StIcon, - #panel .panel-button:hover .popup-menu-arrow { - icon-shadow: 0px 0px 8px black; } + background: rgba(41, 47, 69, 0.65); + color: white; + transition-duration: 200ms; } #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { - background: rgba(22, 25, 37, 0.65); - box-shadow: inset 0 -2px 0px #db10ea; - color: #b5c3c8; } + box-shadow: none; + background-gradient-start: #c50ed2; + background-gradient-end: #8500f7; + background-gradient-direction: horizontal; + color: #f7f7f7; + text-shadow: 0px 0px 2px rgba(92, 92, 92, 0.9); + transition-duration: 200ms; } + #panel .panel-button:active .system-status-icon, + #panel .panel-button:active .app-menu-icon > StIcon, + #panel .panel-button:active .popup-menu-arrow, #panel .panel-button:overview .system-status-icon, + #panel .panel-button:overview .app-menu-icon > StIcon, + #panel .panel-button:overview .popup-menu-arrow, #panel .panel-button:focus .system-status-icon, + #panel .panel-button:focus .app-menu-icon > StIcon, + #panel .panel-button:focus .popup-menu-arrow, #panel .panel-button:checked .system-status-icon, + #panel .panel-button:checked .app-menu-icon > StIcon, + #panel .panel-button:checked .popup-menu-arrow { + icon-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9); } #panel .panel-button:active > .system-status-icon, #panel .panel-button:overview > .system-status-icon, #panel .panel-button:focus > .system-status-icon, #panel .panel-button:checked > .system-status-icon { - icon-shadow: black 0 2px 2px; } + icon-shadow: red 0 2px 2px; } #panel .panel-button .system-status-icon { icon-size: 1.09em; padding: 0 5px; } @@ -752,9 +764,9 @@ StScrollBar { #panel .power-status.panel-status-indicators-box { spacing: 0; } #panel .screencast-indicator { - color: #ff9f39; } + color: #f47d49; } #panel.solid { - background-color: #141722; + background-color: #161925; /* transition from transparent to solid */ transition-duration: 300ms; } #panel.solid .panel-corner { @@ -786,7 +798,8 @@ StScrollBar { spacing: 1em; } .datemenu-calendar-column { - border: 0 solid rgba(51, 57, 85, 0.3); } + border: 0 solid transparent; + background: #171926; } .datemenu-calendar-column:ltr { border-left-width: 1px; } .datemenu-calendar-column:rtl { @@ -815,7 +828,7 @@ StScrollBar { .events-section-title:focus, .message-list-section-title:hover, .message-list-section-title:focus { - background-color: rgba(32, 36, 53, 0.93); } + background-color: #222638; } .datemenu-today-button:active, .world-clocks-button:active, @@ -832,7 +845,7 @@ StScrollBar { .weather-header, .events-section-title, .message-list-section-title { - color: #9eb0b6; + color: #7b939c; font-weight: bold; } .world-clocks-grid { @@ -854,7 +867,7 @@ StScrollBar { .pager-button:hover, .pager-button:focus { background-color: rgba(152, 171, 178, 0.05); } .pager-button:active { - background-color: rgba(22, 25, 37, 0); } + background-color: rgba(24, 27, 40, 0.05); } .calendar-change-month-back { background-image: url("assets/calendar-arrow-left.svg"); } @@ -875,13 +888,13 @@ StScrollBar { margin: 2px; border-radius: 1.4em; } .calendar-day-base:hover, .calendar-day-base:focus { - background-color: rgba(32, 36, 53, 0.93); } + background-color: #222638; } .calendar-day-base:active, .calendar-day-base:selected { - color: white; + color: #f7f7f7; background-color: #c50ed2; border-color: transparent; } .calendar-day-base.calendar-day-heading { - color: #8ca1a9; + color: #7b939c; margin-top: 1em; font-size: 70%; } @@ -895,11 +908,11 @@ StScrollBar { border-left-width: 1px; } .calendar-nonwork-day { - color: rgba(92, 103, 112, 0.965); } + color: #58636d; } .calendar-today { font-weight: bold; - border: 1px solid rgba(51, 57, 85, 0); } + border: 1px solid rgba(18, 21, 30, 0.5); } .calendar-day-with-events { color: #b5c3c8; @@ -907,7 +920,7 @@ StScrollBar { background-image: url("assets/calendar-today.svg"); } .calendar-other-month-day { - color: rgba(92, 103, 112, 0.965); + color: #58636d; opacity: 0.5; } .calendar-week-number { @@ -919,7 +932,7 @@ StScrollBar { padding: 0.5em 0 0; margin: 6px; background-color: rgba(152, 171, 178, 0.3); - color: rgba(22, 25, 37, 0.93); } + color: #181b28; } /* Message list */ .message-list { @@ -928,12 +941,20 @@ StScrollBar { color: #899fa7; } .message-list-clear-button.button { - background-color: transparent; - border: 1px solid rgba(51, 57, 85, 0.3); + color: #98abb2; + background-color: #0e1018; box-shadow: none; + border: 1px solid #12151e; + text-shadow: 0 1px black; + icon-shadow: 0 1px black; + border: 1px solid #12151e; margin: 1.5em 1.5em 0; } .message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(32, 36, 53, 0.93); } + color: #c50ed2; + background-color: #12151e; + border: 1px solid #12151e; + text-shadow: 0 1px black; + icon-shadow: 0 1px black; } .message-list-sections { spacing: 1em; } @@ -958,7 +979,7 @@ StScrollBar { border-radius: 1px; background: transparent; } .message:hover, .message:focus { - background-color: rgba(26, 29, 43, 0.93); + background-color: #161925; box-shadow: 3px 0px 0px 0px #c50ed2 inset; } .message-icon-bin { @@ -1004,9 +1025,9 @@ StScrollBar { .media-message-cover-icon { icon-size: 48px !important; } .media-message-cover-icon.fallback { - color: rgba(41, 47, 69, 0.93); - background-color: rgba(22, 25, 37, 0.93); - border: 2px solid rgba(22, 25, 37, 0.93); + color: #2b3148; + background-color: #181b28; + border: 2px solid #181b28; border-radius: 2px; icon-size: 16px; padding: 8px; } @@ -1034,15 +1055,17 @@ StScrollBar { color: #98abb2; border-radius: 32px; /* wish we could do 50% */ - border: 1px solid transparent; - background: transparent; + border: 1px solid #12151e; + background: #12151e; padding: 13px; } .system-menu-action:hover, .system-menu-action:focus { + border: 1px solid #c50ed2; color: #c50ed2; background: transparent; } .system-menu-action:active { background-color: #980ba2; - color: #f7f7f7; } + color: #f7f7f7; + border: 1px solid #980ba2; } .system-menu-action > StIcon { icon-size: 16px; } @@ -1100,14 +1123,14 @@ StScrollBar { icon-size: 32px; } .nm-dialog-scroll-view { - border: 2px solid rgba(51, 57, 85, 0.3); } + border: 2px solid #12151e; } .nm-dialog-header { font-weight: bold; } .nm-dialog-item { font-size: 110%; - border-bottom: 1px solid rgba(51, 57, 85, 0.3); + border-bottom: 1px solid #12151e; padding: 12px; spacing: 20px; } @@ -1148,30 +1171,30 @@ StScrollBar { .window-caption { spacing: 20px; - color: #98abb2; - background-color: rgba(22, 25, 37, 0.58); + color: white; + background-color: rgba(24, 27, 40, 0.65); border-radius: 2px; padding: 4px 8px; } .search-entry { width: 320px; - padding: 7px 9px; - border-radius: 2px; + padding: 9px; + border-radius: 100px; border: none; color: #98abb2; - background-color: rgba(22, 25, 37, 0.53); + background-color: rgba(24, 27, 40, 0.6); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.22); } .search-entry:focus { border-width: 0; color: #98abb2; - background-color: rgba(22, 25, 37, 0.73); + background-color: rgba(24, 27, 40, 0.8); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15), 0 2px 3px rgba(0, 0, 0, 0.3); } .search-entry .search-entry-icon { icon-size: 1em; padding: 0 4px; color: rgba(152, 171, 178, 0.7); } .search-entry:hover, .search-entry:focus { - background-color: rgba(22, 25, 37, 0.73); } + background-color: rgba(24, 27, 40, 0.8); } .search-entry:hover .search-entry-icon, .search-entry:focus .search-entry-icon { color: #98abb2; } @@ -1200,15 +1223,15 @@ StScrollBar { spacing: 30px; } .list-search-result-title { - color: #a7b7bd; + color: white; spacing: 12px; } .list-search-result-description { - color: rgba(196, 207, 211, 0.5); } + color: rgba(255, 255, 255, 0.5); } .list-search-provider-details { width: 150px; - color: #a7b7bd; + color: white; margin-top: 0.24em; } .list-search-provider-content { @@ -1220,10 +1243,10 @@ StScrollBar { /* DASHBOARD */ #dash { font-size: 9pt; - color: #98abb2; - background-color: rgba(3, 3, 5, 0.65); + color: white; + background-color: rgba(22, 25, 37, 0.65); padding: 6px 0; - border: 1px solid rgba(128, 128, 128, 0.2); + border: 1px solid #12151e; border-left: 0px; border-radius: 0px 5px 5px 0px; } #dash:rtl { @@ -1242,8 +1265,8 @@ StScrollBar { .dash-label { border-radius: 7px; padding: 4px 12px; - color: #98abb2; - background-color: rgba(3, 3, 5, 0.64); + color: white; + background-color: rgba(22, 25, 37, 0.65); text-align: center; -x-offset: 8px; } @@ -1268,9 +1291,8 @@ StScrollBar { padding: 4px 32px; } .app-view-control:checked { color: #c50ed2; - background-color: rgba(22, 25, 37, 0.88); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3); - border: none; + background-color: rgba(24, 27, 40, 0.95); + border: 1px solid #12151e; text-shadow: none; icon-shadow: none; } .app-view-control:first-child { @@ -1282,13 +1304,13 @@ StScrollBar { .search-provider-icon:active, .search-provider-icon:checked, .list-search-result:active, .list-search-result:checked { - background-color: rgba(3, 3, 5, 0.78); } + background-color: rgba(5, 5, 8, 0.85); } .search-provider-icon:focus, .search-provider-icon:selected, .search-provider-icon:hover, .list-search-result:focus, .list-search-result:selected, .list-search-result:hover { - background-color: rgba(22, 25, 37, 0.23); + background-color: rgba(24, 27, 40, 0.3); transition-duration: 200ms; } .app-well-app, @@ -1304,7 +1326,7 @@ StScrollBar { .show-apps:checked .overview-icon, .grid-search-result:active .overview-icon, .grid-search-result:checked .overview-icon { - background-color: rgba(9, 10, 15, 0.78); + background-color: rgba(11, 12, 18, 0.85); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), 0 2px 3px rgba(0, 0, 0, 0.3); color: #98abb2; } .app-well-app:hover .overview-icon, @@ -1319,15 +1341,15 @@ StScrollBar { .grid-search-result:hover .overview-icon, .grid-search-result:focus .overview-icon, .grid-search-result:selected .overview-icon { - background-color: rgba(22, 25, 37, 0.43); + background-color: rgba(24, 27, 40, 0.5); transition-duration: 0ms; border-image: none; background-image: none; } .app-well-app-running-dot { - width: 5px; - height: 5px; - background-color: #ec6af5; + width: 4px; + height: 4px; + background-color: #c50ed2; border-radius: 10px !important; box-shadow: 0px 0px 5px 4px rgba(197, 14, 210, 0.8); margin-bottom: 0px; } @@ -1346,10 +1368,10 @@ StScrollBar { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.22); } .app-well-app.app-folder > .overview-icon { - background-color: rgba(22, 25, 37, 0.28); } + background-color: rgba(24, 27, 40, 0.35); } .show-apps .show-apps-icon { - color: #98abb2; } + color: white; } .show-apps:checked .show-apps-icon, .show-apps:focus .show-apps-icon { @@ -1358,13 +1380,13 @@ StScrollBar { .app-folder-popup { -arrow-border-radius: 8px; - -arrow-background-color: rgba(22, 25, 37, 0.43); + -arrow-background-color: rgba(24, 27, 40, 0.5); -arrow-base: 24px; -arrow-rise: 11px; } .app-folder-popup-bin { padding: 5px; - background: rgba(22, 25, 37, 0.43); } + background: rgba(24, 27, 40, 0.5); } .app-folder-icon { padding: 5px; @@ -1432,14 +1454,14 @@ StScrollBar { width: 34em; margin: 5px; border-radius: 3px; - color: #98abb2; - background-color: rgba(22, 25, 37, 0.93); - border: 1px solid rgba(51, 57, 85, 0.3); + color: white; + background-color: #181b28; + border: 1px solid #12151e; box-shadow: 0 1px 4px black; } .notification-banner:hover { - background-color: rgba(22, 25, 37, 0.89); } + background-color: rgba(24, 27, 40, 0.96); } .notification-banner:focus { - background-color: rgba(22, 25, 37, 0.89); } + background-color: rgba(24, 27, 40, 0.96); } .notification-banner .notification-icon { padding: 5px; } .notification-banner .notification-content { @@ -1448,18 +1470,18 @@ StScrollBar { .notification-banner .secondary-icon { icon-size: 1.09em; } .notification-banner .notification-actions { - background-color: rgba(18, 21, 31, 0.93); + background-color: #141722; padding-top: 2px; spacing: 1px; } .notification-banner .notification-button { padding: 4px 4px 5px; - background-color: rgba(22, 25, 37, 0.83); } + background-color: rgba(24, 27, 40, 0.9); } .notification-banner .notification-button:first-child { border-radius: 0 0 0 3px; } .notification-banner .notification-button:last-child { border-radius: 0 0 3px 0; } .notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(18, 21, 31, 0.93); + background-color: #141722; color: #c50ed2; } .summary-source-counter { @@ -1532,7 +1554,7 @@ StScrollBar { spacing: 8px; border-radius: 4px; } .hotplug-resident-mount:hover { - background-color: rgba(22, 25, 37, 0.23); } + background-color: rgba(24, 27, 40, 0.3); } .hotplug-resident-mount-label { color: inherit; @@ -1558,7 +1580,7 @@ StScrollBar { /* On-screen Keyboard */ #keyboard { - background-color: rgba(22, 25, 37, 0.58); } + background-color: rgba(24, 27, 40, 0.65); } .keyboard-layout { spacing: 10px; @@ -1569,41 +1591,38 @@ StScrollBar { .keyboard-key { color: #98abb2; - background-color: rgba(12, 14, 21, 0.93); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 2px 3px rgba(0, 0, 0, 0.22); - border: none; + background-color: #0e1018; + box-shadow: none; + border: 1px solid #12151e; text-shadow: 0 1px black; icon-shadow: 0 1px black; - background: #181b28; + border: 1px solid #12151e; + background-color: #181b28; min-height: 2em; min-width: 2em; font-size: 14pt; font-weight: bold; - border-radius: 5px; - border: 1px solid rgba(51, 57, 85, 0.3); - color: white; } + border-radius: 5px; } .keyboard-key:focus { - color: #98abb2; + color: #c50ed2; text-shadow: 0 1px black; icon-shadow: 0 1px black; - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3); - border: 1px solid rgba(197, 14, 210, 0.3); } + box-shadow: none; + border: 1px solid #12151e; } .keyboard-key:hover, .keyboard-key:checked { color: #c50ed2; - background-color: rgba(41, 47, 69, 0.88); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3); - border: none; + background-color: #12151e; + border: 1px solid #12151e; text-shadow: 0 1px black; icon-shadow: 0 1px black; } .keyboard-key:active { color: #c50ed2; - background-color: rgba(22, 25, 37, 0.88); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3); - border: none; + background-color: rgba(24, 27, 40, 0.95); + border: 1px solid #12151e; text-shadow: none; icon-shadow: none; } .keyboard-key:grayed { - background-color: rgba(22, 25, 37, 0.88); + background-color: rgba(24, 27, 40, 0.95); color: #98abb2; border-color: rgba(0, 0, 0, 0.7); } @@ -1611,7 +1630,7 @@ StScrollBar { color: white; padding: 5px; -arrow-border-radius: 10px; - -arrow-background-color: rgba(22, 25, 37, 0.58); + -arrow-background-color: rgba(24, 27, 40, 0.65); -arrow-border-width: 2px; -arrow-border-color: #98abb2; -arrow-base: 20px; @@ -1676,28 +1695,27 @@ StScrollBar { padding: 3px 18px; } .login-dialog .modal-dialog-button:default { color: #98abb2; - background-color: rgba(12, 14, 21, 0.93); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 2px 3px rgba(0, 0, 0, 0.22); - border: none; + background-color: #0e1018; + box-shadow: none; + border: 1px solid #12151e; text-shadow: 0 1px black; - icon-shadow: 0 1px black; } + icon-shadow: 0 1px black; + border: 1px solid #12151e; } .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: #c50ed2; background-color: rgba(197, 14, 210, 0.7); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3); - border: none; + border: 1px solid #12151e; text-shadow: 0 1px black; icon-shadow: 0 1px black; } .login-dialog .modal-dialog-button:default:active { color: #c50ed2; background-color: #c50ed2; - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3); - border: none; + border: 1px solid #12151e; text-shadow: none; icon-shadow: none; } .login-dialog .modal-dialog-button:default:insensitive { - color: rgba(92, 103, 112, 0.965); - background-color: rgba(38, 43, 54, 0.597); + color: #58636d; + background-color: rgba(38, 43, 55, 0.66); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 2px 3px rgba(0, 0, 0, 0.22); border: none; text-shadow: none; @@ -1713,7 +1731,7 @@ StScrollBar { spacing: 5px; } .login-dialog-message-warning { - color: #ff9f39; } + color: #f47d49; } .login-dialog-message-hint { padding-top: 0; @@ -1833,7 +1851,7 @@ StScrollBar { .screen-shield-notifications-container .screen-shield-notification-source { padding: 12px 6px; border: 1px solid #98abb2; - background-color: rgba(22, 25, 37, 0.38); + background-color: rgba(24, 27, 40, 0.45); color: #98abb2; border-radius: 4px; } .screen-shield-notifications-container .notification { @@ -1847,7 +1865,7 @@ StScrollBar { padding: 0px 0px 0px 12px; } #panel.lock-screen { - background-color: rgba(22, 25, 37, 0.38); } + background-color: rgba(24, 27, 40, 0.45); } .screen-shield-background { background: black; @@ -1858,9 +1876,9 @@ StScrollBar { background-repeat: repeat; } #screenShieldNotifications StButton#vhandle, #screenShieldNotifications StButton#hhandle { - background-color: rgba(22, 25, 37, 0.23); } + background-color: rgba(24, 27, 40, 0.3); } #screenShieldNotifications StButton#vhandle:hover, #screenShieldNotifications StButton#vhandle:focus, #screenShieldNotifications StButton#hhandle:hover, #screenShieldNotifications StButton#hhandle:focus { - background-color: rgba(22, 25, 37, 0.43); } + background-color: rgba(24, 27, 40, 0.5); } #screenShieldNotifications StButton#vhandle:active, #screenShieldNotifications StButton#hhandle:active { background-color: rgba(197, 14, 210, 0.5); }