From 5c5ed37b8b36adb1740d2bc761e26e0e37f0467d Mon Sep 17 00:00:00 2001
From: Jakub Steiner <jimmac@gmail.com>
Date: Mon, 9 Feb 2015 15:45:33 +0100
Subject: [PATCH] theme: consistent osd colors for overview

- needed for reusal of the same theme for light/dark variant
  (gnome3 vs classic)
---
 data/theme/_common.scss                  | 62 ++++++++++----------
 data/theme/gnome-shell-high-contrast.css | 74 +++++++++++-------------
 data/theme/gnome-shell.css               | 50 ++++++++--------
 3 files changed, 95 insertions(+), 91 deletions(-)

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;