diff --git a/data/theme/_common.scss b/data/theme/_common.scss index 72234b6ce..3cadc6348 100644 --- a/data/theme/_common.scss +++ b/data/theme/_common.scss @@ -29,9 +29,9 @@ $panel-corner-radius: 6px; /* GLOBALS */ $font-size: 11; $font-family: Cantarell, Sans-Serif; -$_bubble_bg_color: transparentize($osd_borders_color,.2); +$_bubble_bg_color: opacify($osd_bg_color,0.25); $_bubble_fg_color: $osd_fg_color; -$_bubble_border_color: opacify($osd_outer_borders_color, 0.1); +$_bubble_borders_color: transparentize($osd_fg_color,0.5); stage { font-family: $font-family; @@ -149,8 +149,9 @@ StScrollBar { .modal-dialog { border-radius: 5px; - background-color: transparentize(darken($bg_color,10%),0.05); - border: 3px solid transparentize($fg_color, 0.8); + color: $osd_fg_color; + background-color: transparentize(darken($osd_bg_color,10%),0.05); + border: 3px solid transparentize($osd_fg_color,0.5); padding: 24px; .run-dialog-entry { width: 20em; margin-bottom: 6px; } @@ -162,7 +163,7 @@ StScrollBar { .run-dialog-label { font-size: fontsize($font-size + 1.1); font-weight: bold; - color: darken($fg_color,10%); + color: darken($osd_fg_color,10%); padding-bottom: .4em; } @@ -181,7 +182,7 @@ StScrollBar { /* End Session Dialog */ .end-session-dialog { spacing: 42px; - border: 3px solid $_bubble_border_color; + border: 3px solid $_bubble_borders_color; } .end-session-dialog-list { @@ -326,7 +327,7 @@ StScrollBar { .prompt-dialog { //this is the width of the entire modal popup width: 500px; - border: 3px solid $_bubble_border_color; + border: 3px solid $_bubble_borders_color; } .prompt-dialog-main-layout { @@ -586,7 +587,7 @@ StScrollBar { %osd-panel { color: $_bubble_fg_color; background-color: $_bubble_bg_color; - border: 1px solid $_bubble_border_color; + border: 1px solid $_bubble_borders_color; border-radius: 12px; padding: 12px; } @@ -710,7 +711,7 @@ StScrollBar { .calendar-vertical-separator { width: .3em; -stipple-width: 1px; - -stipple-color: $_bubble_border_color; + -stipple-color: $_bubble_borders_color; } .calendar-month-label { @@ -982,14 +983,14 @@ StScrollBar { } .window-caption { spacing: 25px; - background-color: transparentize($bg_color,0.3); + background-color: transparentize($osd_bg_color,0.3); border-radius: 8px; padding: 4px 12px; -shell-caption-spacing: 12px; &:hover { background-color: $selected_bg_color; color: $selected_fg_color; } } - .messages-indicator { color: transparentize($fg_color,.2); height: 32px; } + .messages-indicator { color: transparentize($osd_fg_color,.2); height: 32px; } .messages-indicator-contents { spacing: 12px; padding-bottom: 12px; } //search entry @@ -1002,7 +1003,7 @@ StScrollBar { border-width: 2px; } - .search-entry-icon { icon-size: 1em; padding: 0 4px; color: transparentize($fg_color,.3); } + .search-entry-icon { icon-size: 1em; padding: 0 4px; color: transparentize($osd_fg_color,.3); } &:hover, &:focus { .search-entry-icon { color: $fg_color; } @@ -1037,8 +1038,8 @@ StScrollBar { } .list-search-result-content { spacing: 12px; padding: 12px; } - .list-search-result-title { font-size: 1.5em; color: darken($fg_color,5%); } - .list-search-result-description { color: darken($fg_color,15%); } + .list-search-result-title { font-size: 1.5em; color: darken($osd_fg_color,5%); } + .list-search-result-description { color: darken($osd_fg_color,15%); } .search-provider-icon { padding: 15px; } .search-provider-icon-more { width: 16px; @@ -1081,7 +1082,8 @@ StScrollBar { .dash-label { //osd tooltip border-radius: 7px; padding: 4px 12px; - background-color: transparentize($osd_borders_color,0.3); + color: $osd_fg_color; + background-color: transparentize($osd_bg_color,0.3); text-align: center; -x-offset: 8px; } @@ -1115,9 +1117,9 @@ StScrollBar { .search-provider-icon, .list-search-result { @extend %icon_tile; - &:active, &:checked { background-color: transparentize(darken($bg_color,10%),.1); } - &:focus, &:selected, &:hover { - background-color: transparentize($fg_color,.9); + &:active, &:checked { background-color: transparentize(darken($osd_bg_color,10%),.1); } + &:focus, &:selected, &:hover { + background-color: transparentize($osd_fg_color,.9); transition-duration: 200ms; } } @@ -1130,13 +1132,13 @@ StScrollBar { } &:active .overview-icon, &:checked .overview-icon { - background-color: transparentize(darken($bg_color,10%),.1); //FIXME not working? - box-shadow: inset 0 1px 2px $borders_color; + background-color: transparentize(darken($osd_bg_color,10%),.1); //FIXME not working? + box-shadow: inset 0 1px 2px $osd_borders_color; } &:hover .overview-icon, &:focus .overview-icon, &:selected .overview-icon { - background-color: transparentize($fg_color,.9); + background-color: transparentize($osd_fg_color,.9); transition-duration: 0ms; border-image: none; background-image: none; @@ -1151,6 +1153,7 @@ StScrollBar { } %icon_tile { + color: $osd_fg_color; border-radius: 4px; padding: 6px; border: 1px solid transparent; @@ -1159,7 +1162,7 @@ StScrollBar { } .app-well-app.app-folder > .overview-icon { - background-color: transparentize($bg_color,.6); + background-color: transparentize($osd_bg_color,.6); } .show-apps:checked .show-apps-icon, @@ -1172,7 +1175,7 @@ StScrollBar { // Collections .app-folder-popup { //expanded collection -arrow-border-radius: 8px; - -arrow-background-color: transparentize($bg_color,0.7); + -arrow-background-color: transparentize($osd_bg_color,0.7); -arrow-base: 24px; -arrow-rise: 11px; } @@ -1233,7 +1236,7 @@ StScrollBar { %overview-panel { color: $_bubble_fg_color; background-color: $_bubble_bg_color; - border: 1px solid $_bubble_border_color; + border: 1px solid $_bubble_borders_color; } %status_text { @@ -1245,7 +1248,7 @@ StScrollBar { /* NOTIFICATIONS & MESSAGE TRAY */ #message-tray { - background: darken($bg_color,10%) url("noise-texture.png"); + background: darken($osd_bg_color,10%) url("noise-texture.png"); background-repeat: repeat; height: 72px; box-shadow: inset 0 2px 4px rgba(0,0,0,0.5); @@ -1271,6 +1274,7 @@ StScrollBar { font-size: 11pt; width: 34em; border-radius: 6px 6px 0 0; + color: $_bubble_fg_color; background-color: $_bubble_bg_color; border: 1px solid $borders_color; border-bottom-width: 0; @@ -1487,7 +1491,7 @@ StScrollBar { -arrow-border-radius: 10px; -arrow-background-color: transparentize($osd_bg_color, 0.3); -arrow-border-width: 2px; - -arrow-border-color: $_bubble_border_color; + -arrow-border-color: $_bubble_borders_color; -arrow-base: 20px; -arrow-rise: 10px; -boxpointer-gap: 5px; @@ -1677,12 +1681,12 @@ StScrollBar { .summary-notification-stack-scrollview { padding-top: 0; padding-bottom: 0; - } + } .screen-shield-notification-source { padding: 12px 6px; - border: 1px solid $_bubble_border_color; - background-color: $_bubble_bg_color; + border: 1px solid $_bubble_borders_color; + background-color: transparentize($osd_bg_color,0.5); color: $_bubble_fg_color; border-radius: 4px; } diff --git a/data/theme/gnome-shell-high-contrast.css b/data/theme/gnome-shell-high-contrast.css index 0a1e48780..1a6670acf 100644 --- a/data/theme/gnome-shell-high-contrast.css +++ b/data/theme/gnome-shell-high-contrast.css @@ -156,8 +156,9 @@ StScrollBar { .modal-dialog { border-radius: 5px; - background-color: rgba(0, 0, 0, 0.95); - border: 3px solid rgba(255, 255, 255, 0.2); + color: #eeeeec; + background-color: rgba(23, 25, 26, 0.95); + border: 3px solid rgba(238, 238, 236, 0.5); padding: 24px; } .modal-dialog .run-dialog-entry { width: 20em; @@ -170,7 +171,7 @@ StScrollBar { .modal-dialog .run-dialog-label { font-size: fontsize(12.1); font-weight: bold; - color: #e6e6e6; + color: #d6d6d1; padding-bottom: .4em; } .button-dialog-button-box { @@ -185,7 +186,7 @@ StScrollBar { /* End Session Dialog */ .end-session-dialog { spacing: 42px; - border: 3px solid rgba(255, 255, 255, 0.2); } + border: 3px solid rgba(238, 238, 236, 0.5); } .end-session-dialog-list { padding-top: 20px; } @@ -307,7 +308,7 @@ StScrollBar { /* Password or Authentication Dialog */ .prompt-dialog { width: 500px; - border: 3px solid rgba(255, 255, 255, 0.2); } + border: 3px solid rgba(238, 238, 236, 0.5); } .prompt-dialog-main-layout { spacing: 24px; @@ -514,8 +515,8 @@ StScrollBar { .osd-window, .switcher-list, .workspace-switcher-container { color: #eeeeec; - background-color: rgba(0, 0, 0, 0.5); - border: 1px solid rgba(255, 255, 255, 0.2); + background-color: #2e3436; + border: 1px solid rgba(238, 238, 236, 0.5); border-radius: 12px; padding: 12px; } @@ -601,7 +602,7 @@ StScrollBar { .calendar-vertical-separator { width: .3em; -stipple-width: 1px; - -stipple-color: rgba(255, 255, 255, 0.2); } + -stipple-color: rgba(238, 238, 236, 0.5); } .calendar-month-label { color: #f2f2f2; @@ -844,7 +845,7 @@ StScrollBar { .window-caption { spacing: 25px; - background-color: rgba(0, 0, 0, 0.7); + background-color: rgba(46, 52, 54, 0.7); border-radius: 8px; padding: 4px 12px; -shell-caption-spacing: 12px; } @@ -853,7 +854,7 @@ StScrollBar { color: #ffffff; } .messages-indicator { - color: rgba(255, 255, 255, 0.8); + color: rgba(238, 238, 236, 0.8); height: 32px; } .messages-indicator-contents { @@ -870,7 +871,7 @@ StScrollBar { .search-entry .search-entry-icon { icon-size: 1em; padding: 0 4px; - color: rgba(255, 255, 255, 0.7); } + color: rgba(238, 238, 236, 0.7); } .search-entry:hover .search-entry-icon, .search-entry:focus .search-entry-icon { color: #fff; } @@ -904,10 +905,10 @@ StScrollBar { .list-search-result-title { font-size: 1.5em; - color: #f2f2f2; } + color: #e2e2df; } .list-search-result-description { - color: #d9d9d9; } + color: #cacac4; } .search-provider-icon { padding: 15px; } @@ -940,7 +941,8 @@ StScrollBar { .dash-label { border-radius: 7px; padding: 4px 12px; - background-color: rgba(0, 0, 0, 0.4); + color: #eeeeec; + background-color: rgba(46, 52, 54, 0.7); text-align: center; -x-offset: 8px; } @@ -973,19 +975,14 @@ StScrollBar { .search-provider-icon:active, .search-provider-icon:checked, .list-search-result:active, .list-search-result:checked { - background-color: rgba(0, 0, 0, 0.9); } + background-color: rgba(23, 25, 26, 0.9); } .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(255, 255, 255, 0.1); + background-color: rgba(238, 238, 236, 0.1); transition-duration: 200ms; } -.app-well-app.running .overview-icon, -.app-well-app.app-folder.running .overview-icon, -.show-apps.running .overview-icon, -.grid-search-result.running .overview-icon { - text-shadow: black 0px 2px 2px; } .app-well-app:active .overview-icon, .app-well-app:checked .overview-icon, .app-well-app.app-folder:active .overview-icon, .app-well-app.app-folder:checked .overview-icon, @@ -993,22 +990,19 @@ StScrollBar { .show-apps:checked .overview-icon, .grid-search-result:active .overview-icon, .grid-search-result:checked .overview-icon { - background-color: rgba(0, 0, 0, 0.9); - box-shadow: inset 0 1px 2px black; } -.app-well-app:hover .overview-icon, .app-well-app.running:hover .overview-icon, .app-well-app:focus .overview-icon, .app-well-app:selected .overview-icon, + background-color: rgba(23, 25, 26, 0.9); + box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.7); } +.app-well-app:hover .overview-icon, .app-well-app:focus .overview-icon, .app-well-app:selected .overview-icon, .app-well-app.app-folder:hover .overview-icon, -.app-well-app.app-folder.running:hover .overview-icon, .app-well-app.app-folder:focus .overview-icon, .app-well-app.app-folder:selected .overview-icon, .show-apps:hover .overview-icon, -.show-apps.running:hover .overview-icon, .show-apps:focus .overview-icon, .show-apps:selected .overview-icon, .grid-search-result:hover .overview-icon, -.grid-search-result.running:hover .overview-icon, .grid-search-result:focus .overview-icon, .grid-search-result:selected .overview-icon { - background-color: rgba(255, 255, 255, 0.1); + background-color: rgba(238, 238, 236, 0.1); transition-duration: 0ms; border-image: none; background-image: none; } @@ -1024,6 +1018,7 @@ StScrollBar { .app-well-app.app-folder .overview-icon, .show-apps .overview-icon, .grid-search-result .overview-icon { + color: #eeeeec; border-radius: 4px; padding: 6px; border: 1px solid transparent; @@ -1031,7 +1026,7 @@ StScrollBar { text-align: center; } .app-well-app.app-folder > .overview-icon { - background-color: rgba(0, 0, 0, 0.4); } + background-color: rgba(46, 52, 54, 0.4); } .show-apps:checked .show-apps-icon, .show-apps:focus .show-apps-icon { @@ -1040,7 +1035,7 @@ StScrollBar { .app-folder-popup { -arrow-border-radius: 8px; - -arrow-background-color: rgba(0, 0, 0, 0.3); + -arrow-background-color: rgba(46, 52, 54, 0.3); -arrow-base: 24px; -arrow-rise: 11px; } @@ -1089,8 +1084,8 @@ StScrollBar { #dash, .workspace-thumbnails { color: #eeeeec; - background-color: rgba(0, 0, 0, 0.5); - border: 1px solid rgba(255, 255, 255, 0.2); } + background-color: #2e3436; + border: 1px solid rgba(238, 238, 236, 0.5); } .search-statustext, .no-frequent-applications-label { font-size: 2em; @@ -1099,7 +1094,7 @@ StScrollBar { /* NOTIFICATIONS & MESSAGE TRAY */ #message-tray { - background: black url("noise-texture.png"); + background: #17191a url("noise-texture.png"); background-repeat: repeat; height: 72px; box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.5); @@ -1125,7 +1120,8 @@ StScrollBar { font-size: 11pt; width: 34em; border-radius: 6px 6px 0 0; - background-color: rgba(0, 0, 0, 0.5); + color: #eeeeec; + background-color: #2e3436; border: 1px solid black; border-bottom-width: 0; spacing-rows: 4px; @@ -1172,7 +1168,7 @@ StScrollBar { .summary-boxpointer { -arrow-border-radius: 15px; - -arrow-background-color: rgba(0, 0, 0, 0.5); + -arrow-background-color: #2e3436; -arrow-base: 36px; -arrow-rise: 18px; color: #fff; @@ -1356,7 +1352,7 @@ StScrollBar { -arrow-border-radius: 10px; -arrow-background-color: rgba(46, 52, 54, 0.7); -arrow-border-width: 2px; - -arrow-border-color: rgba(255, 255, 255, 0.2); + -arrow-border-color: rgba(238, 238, 236, 0.5); -arrow-base: 20px; -arrow-rise: 10px; -boxpointer-gap: 5px; } @@ -1567,8 +1563,8 @@ StScrollBar { padding-bottom: 0; } .screen-shield-notifications-container .screen-shield-notification-source { padding: 12px 6px; - border: 1px solid rgba(255, 255, 255, 0.2); - background-color: rgba(0, 0, 0, 0.5); + border: 1px solid rgba(238, 238, 236, 0.5); + background-color: rgba(46, 52, 54, 0.5); color: #eeeeec; border-radius: 4px; } @@ -1580,7 +1576,7 @@ StScrollBar { padding: 0px 0px 0px 12px; } #panel.lock-screen { - background-color: transparent; } + background-color: rgba(46, 52, 54, 0.5); } .screen-shield-background { background: black; diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css index c14e09b69..bc0f5c746 100644 --- a/data/theme/gnome-shell.css +++ b/data/theme/gnome-shell.css @@ -156,8 +156,9 @@ StScrollBar { .modal-dialog { border-radius: 5px; - background-color: rgba(33, 36, 36, 0.95); - border: 3px solid rgba(238, 238, 236, 0.2); + color: #eeeeec; + background-color: rgba(23, 25, 26, 0.95); + border: 3px solid rgba(238, 238, 236, 0.5); padding: 24px; } .modal-dialog .run-dialog-entry { width: 20em; @@ -185,7 +186,7 @@ StScrollBar { /* End Session Dialog */ .end-session-dialog { spacing: 42px; - border: 3px solid rgba(255, 255, 255, 0.2); } + border: 3px solid rgba(238, 238, 236, 0.5); } .end-session-dialog-list { padding-top: 20px; } @@ -307,7 +308,7 @@ StScrollBar { /* Password or Authentication Dialog */ .prompt-dialog { width: 500px; - border: 3px solid rgba(255, 255, 255, 0.2); } + border: 3px solid rgba(238, 238, 236, 0.5); } .prompt-dialog-main-layout { spacing: 24px; @@ -514,8 +515,8 @@ StScrollBar { .osd-window, .switcher-list, .workspace-switcher-container { color: #eeeeec; - background-color: rgba(0, 0, 0, 0.5); - border: 1px solid rgba(255, 255, 255, 0.2); + background-color: #2e3436; + border: 1px solid rgba(238, 238, 236, 0.5); border-radius: 12px; padding: 12px; } @@ -601,7 +602,7 @@ StScrollBar { .calendar-vertical-separator { width: .3em; -stipple-width: 1px; - -stipple-color: rgba(255, 255, 255, 0.2); } + -stipple-color: rgba(238, 238, 236, 0.5); } .calendar-month-label { color: #e2e2df; @@ -844,7 +845,7 @@ StScrollBar { .window-caption { spacing: 25px; - background-color: rgba(57, 63, 63, 0.7); + background-color: rgba(46, 52, 54, 0.7); border-radius: 8px; padding: 4px 12px; -shell-caption-spacing: 12px; } @@ -940,7 +941,8 @@ StScrollBar { .dash-label { border-radius: 7px; padding: 4px 12px; - background-color: rgba(0, 0, 0, 0.4); + color: #eeeeec; + background-color: rgba(46, 52, 54, 0.7); text-align: center; -x-offset: 8px; } @@ -973,7 +975,7 @@ StScrollBar { .search-provider-icon:active, .search-provider-icon:checked, .list-search-result:active, .list-search-result:checked { - background-color: rgba(33, 36, 36, 0.9); } + background-color: rgba(23, 25, 26, 0.9); } .search-provider-icon:focus, .search-provider-icon:selected, .search-provider-icon:hover, .list-search-result:focus, .list-search-result:selected, @@ -988,8 +990,8 @@ StScrollBar { .show-apps:checked .overview-icon, .grid-search-result:active .overview-icon, .grid-search-result:checked .overview-icon { - background-color: rgba(33, 36, 36, 0.9); - box-shadow: inset 0 1px 2px #1c1f1f; } + background-color: rgba(23, 25, 26, 0.9); + box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.7); } .app-well-app:hover .overview-icon, .app-well-app:focus .overview-icon, .app-well-app:selected .overview-icon, .app-well-app.app-folder:hover .overview-icon, .app-well-app.app-folder:focus .overview-icon, @@ -1016,6 +1018,7 @@ StScrollBar { .app-well-app.app-folder .overview-icon, .show-apps .overview-icon, .grid-search-result .overview-icon { + color: #eeeeec; border-radius: 4px; padding: 6px; border: 1px solid transparent; @@ -1023,7 +1026,7 @@ StScrollBar { text-align: center; } .app-well-app.app-folder > .overview-icon { - background-color: rgba(57, 63, 63, 0.4); } + background-color: rgba(46, 52, 54, 0.4); } .show-apps:checked .show-apps-icon, .show-apps:focus .show-apps-icon { @@ -1032,7 +1035,7 @@ StScrollBar { .app-folder-popup { -arrow-border-radius: 8px; - -arrow-background-color: rgba(57, 63, 63, 0.3); + -arrow-background-color: rgba(46, 52, 54, 0.3); -arrow-base: 24px; -arrow-rise: 11px; } @@ -1081,8 +1084,8 @@ StScrollBar { #dash, .workspace-thumbnails { color: #eeeeec; - background-color: rgba(0, 0, 0, 0.5); - border: 1px solid rgba(255, 255, 255, 0.2); } + background-color: #2e3436; + border: 1px solid rgba(238, 238, 236, 0.5); } .search-statustext, .no-frequent-applications-label { font-size: 2em; @@ -1091,7 +1094,7 @@ StScrollBar { /* NOTIFICATIONS & MESSAGE TRAY */ #message-tray { - background: #212424 url("noise-texture.png"); + background: #17191a url("noise-texture.png"); background-repeat: repeat; height: 72px; box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.5); @@ -1117,7 +1120,8 @@ StScrollBar { font-size: 11pt; width: 34em; border-radius: 6px 6px 0 0; - background-color: rgba(0, 0, 0, 0.5); + color: #eeeeec; + background-color: #2e3436; border: 1px solid #1c1f1f; border-bottom-width: 0; spacing-rows: 4px; @@ -1164,7 +1168,7 @@ StScrollBar { .summary-boxpointer { -arrow-border-radius: 15px; - -arrow-background-color: rgba(0, 0, 0, 0.5); + -arrow-background-color: #2e3436; -arrow-base: 36px; -arrow-rise: 18px; color: #eeeeec; @@ -1348,7 +1352,7 @@ StScrollBar { -arrow-border-radius: 10px; -arrow-background-color: rgba(46, 52, 54, 0.7); -arrow-border-width: 2px; - -arrow-border-color: rgba(255, 255, 255, 0.2); + -arrow-border-color: rgba(238, 238, 236, 0.5); -arrow-base: 20px; -arrow-rise: 10px; -boxpointer-gap: 5px; } @@ -1559,8 +1563,8 @@ StScrollBar { padding-bottom: 0; } .screen-shield-notifications-container .screen-shield-notification-source { padding: 12px 6px; - border: 1px solid rgba(255, 255, 255, 0.2); - background-color: rgba(0, 0, 0, 0.5); + border: 1px solid rgba(238, 238, 236, 0.5); + background-color: rgba(46, 52, 54, 0.5); color: #eeeeec; border-radius: 4px; } @@ -1572,7 +1576,7 @@ StScrollBar { padding: 0px 0px 0px 12px; } #panel.lock-screen { - background-color: transparent; } + background-color: rgba(46, 52, 54, 0.5); } .screen-shield-background { background: black;