[gnome-builder] command-bar: queue the wrath of the designers

[Christian Hergert <chergert src gnome org>]

commit 34c372f063b019598ca8df687576b3ddc6718f3a
Author: Christian Hergert <chergert redhat com>
Date:   Fri Jul 7 22:24:56 2017 -0700

    command-bar: queue the wrath of the designers
    
    Sometimes they must think I do this type of stuff on purpose
    just to give them heart attacks.
    
    Blueprint style for the command-bar entry and background.

 plugins/command-bar/themes/shared.css |   22 ++++++++++++++--------
 1 files changed, 14 insertions(+), 8 deletions(-)
---
diff --git a/plugins/command-bar/themes/shared.css b/plugins/command-bar/themes/shared.css
index 2708956..22f302a 100644
--- a/plugins/command-bar/themes/shared.css
+++ b/plugins/command-bar/themes/shared.css
@@ -1,26 +1,32 @@
 commandbar > box.vertical > box.horizontal {
   border: none;
-  background-image: linear-gradient(to bottom, #2e3436, #555753 10%);
-  box-shadow: inset 0px 3px 6px #2e3436;
-  color: #eeeeec;
+  box-shadow: 0px 10px 5px -10px shade(@theme_selected_bg_color, 0.3) inset;
+  color: @theme_selected_fg_color;
+  background-color: @theme_selected_bg_color;
+  background-size: 8px 8px;
+  background-image: repeating-linear-gradient(0deg, alpha(@theme_selected_fg_color,0.05), 
alpha(@theme_selected_fg_color,0.05) 1px, transparent 1px, transparent 8px),
+                    repeating-linear-gradient(-90deg, alpha(@theme_selected_fg_color,0.05), 
alpha(@theme_selected_fg_color,0.05) 1px, transparent 1px, transparent 8px);
 }
 commandbar entry {
   font-family: Monospace;
   background-image: none;
   background-color: transparent;
   min-height: 0px;
-  color: #eeeeec;
+  color: @theme_selected_fg_color;
   border: none;
   padding: 6px;
-  caret-color: #eeeeec;
+  caret-color: @theme_selected_fg_color;
   box-shadow: none;
 }
 commandbar flowbox {
-  background-color: @theme_bg_color;
   opacity: 0.9;
   padding: 12px;
-  color: @theme_fg_color;
+  color: @theme_selected_fg_color;
+  background: transparent;
 }
 commandbar viewport {
-  background-color: @theme_bg_color;
+  background-color: @theme_selected_bg_color;
+  background-size: 8px 8px;
+  background-image: repeating-linear-gradient(0deg, alpha(@theme_selected_fg_color,0.05), 
alpha(@theme_selected_fg_color,0.05) 1px, transparent 1px, transparent 8px),
+                    repeating-linear-gradient(-90deg, alpha(@theme_selected_fg_color,0.05), 
alpha(@theme_selected_fg_color,0.05) 1px, transparent 1px, transparent 8px);
 }