[gnome-builder/wip/chergert/layout] style: tweak styling for search bars

[Christian Hergert <chergert src gnome org>]

commit 63d1dbcf28e3222d756a8597dfbb9639ea3ed126
Author: Christian Hergert <chergert redhat com>
Date:   Tue Jul 11 16:47:45 2017 -0700

    style: tweak styling for search bars

 data/themes/shared.css                 |   49 +------------------------------
 data/themes/shared/shared-search.css   |   48 +++++++++++++++++++++++++++++++
 libide/editor/ide-editor-search-bar.ui |    3 ++
 libide/libide.gresource.xml            |    1 +
 plugins/devhelp/gbp-devhelp-search.ui  |    2 +-
 plugins/terminal/gb-terminal-search.ui |    4 +-
 6 files changed, 57 insertions(+), 50 deletions(-)
---
diff --git a/data/themes/shared.css b/data/themes/shared.css
index 780327f..e75e6af 100644
--- a/data/themes/shared.css
+++ b/data/themes/shared.css
@@ -1,5 +1,6 @@
 @import url("resource:///org/gnome/builder/themes/shared/shared-layout.css");
 @import url("resource:///org/gnome/builder/themes/shared/shared-editor.css");
+@import url("resource:///org/gnome/builder/themes/shared/shared-search.css");
 @import url("resource:///org/gnome/builder/themes/shared/shared-treeview.css");
 
 /* work around some gtk padding issue */
@@ -12,23 +13,8 @@ filechooser actionbar button.combo {
     color: @warning_color;
 }
 
-/* styling for editor search */
-ideeditorsearchbar {
-  background-image: linear-gradient(shade(@theme_bg_color,1.05), @theme_bg_color);
-  padding: 6px;
-  border-style: solid;
-  border-color: @borders;
-  border-left-width: 1px;
-  border-right-width: 1px;
-  border-bottom-width: 1px;
-  border-bottom-left-radius: 5px;
-  border-bottom-right-radius: 5px;
-}
-
-/* styling for the search and spellchecker list close button */
-frame.gb-search-frame > box > grid:first-child > button.close:disabled,
+/* styling for spellchecker */
 .gb-spellchecker list button.close:disabled,
-frame.gb-search-frame > box > grid:first-child > button.close,
 .gb-spellchecker list button.close {
   background: none;
   border: none;
@@ -36,31 +22,6 @@ frame.gb-search-frame > box > grid:first-child > button.close,
   padding-left: 4px;
   padding-right: 4px;
 }
-frame.gb-search-frame > box > grid:first-child > button.close image,
-.gb-spellchecker list button.close image {
-  color: @theme_fg_color;
-  opacity: 0.3;
-  margin: 2px;
-  border: 1px solid transparent;
-  border-radius: 3px;
-}
-frame.gb-search-frame > box > grid:first-child > button.close:hover image,
-.gb-spellchecker list button.close:hover image {
-  opacity: .75;
-  transition-duration: 250ms;
-  border: 1px solid @borders;
-}
-frame.gb-search-frame > box > grid:first-child > button.close:active image,
-.gb-spellchecker list button.close:active image {
-  opacity: .8;
-  background-image: linear-gradient(shade(@theme_bg_color, 0.9), @theme_bg_color);
-}
-frame.gb-search-frame > box > grid:first-child > button.close:backdrop image,
-.gb-spellchecker list button.close:backdrop image {
-  opacity: .1;
-}
-
-/* styling for spellchecker */
 .gb-spellchecker list row label {
   padding: 7px;
 }
@@ -77,12 +38,6 @@ frame.gb-search-frame > box > grid:first-child > button.close:backdrop image,
 }
 
 
-.gb-search-entry-occurrences-tag {
-    color: shade (@theme_unfocused_fg_color, 0.8);
-    border: 0px;
-    margin: 2px;
-    padding: 2px;
-}
 
 /*
  * For our pattern of popover with lists (and close buttons).
diff --git a/data/themes/shared/shared-search.css b/data/themes/shared/shared-search.css
new file mode 100644
index 0000000..335ab50
--- /dev/null
+++ b/data/themes/shared/shared-search.css
@@ -0,0 +1,48 @@
+/* This file contains styling for various search widgets */
+.search-frame {
+  background-image: linear-gradient(shade(@theme_bg_color,1.05), @theme_bg_color);
+  padding: 6px;
+  border-style: solid;
+  border-color: @borders;
+  border-left-width: 1px;
+  border-right-width: 1px;
+  border-bottom-width: 1px;
+  border-bottom-left-radius: 5px;
+  border-bottom-right-radius: 5px;
+}
+frame.search-frame border {
+  border: none;
+}
+.search-frame > box > grid:first-child > button.close:disabled,
+.search-frame > box > grid:first-child > button.close {
+  background: none;
+  border: none;
+  box-shadow: none;
+  padding-left: 4px;
+  padding-right: 4px;
+}
+.search-frame > box > grid:first-child > button.close image {
+  color: @theme_fg_color;
+  opacity: 0.3;
+  margin: 2px;
+  border: 1px solid transparent;
+  border-radius: 3px;
+}
+.search-frame > box > grid:first-child > button.close:hover image {
+  opacity: 0.75;
+  transition-duration: 250ms;
+  border: 1px solid @borders;
+}
+.search-frame > box > grid:first-child > button.close:active image {
+  opacity: 0.8;
+  background-image: linear-gradient(shade(@theme_bg_color, 0.9), @theme_bg_color);
+}
+.search-frame > box > grid:first-child > button.close:backdrop image {
+  opacity: 0.1;
+}
+.search-occurrences-tag {
+    color: shade (@theme_unfocused_fg_color, 0.8);
+    border: 0px;
+    margin: 2px;
+    padding: 2px;
+}
diff --git a/libide/editor/ide-editor-search-bar.ui b/libide/editor/ide-editor-search-bar.ui
index 7d6e39b..91ed36b 100644
--- a/libide/editor/ide-editor-search-bar.ui
+++ b/libide/editor/ide-editor-search-bar.ui
@@ -1,6 +1,9 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
   <template class="IdeEditorSearchBar" parent="DzlBin">
+    <style>
+      <class name="search-frame"/>
+    </style>
     <child>
       <object class="GtkBox">
         <property name="visible">true</property>
diff --git a/libide/libide.gresource.xml b/libide/libide.gresource.xml
index c89659b..994c250 100644
--- a/libide/libide.gresource.xml
+++ b/libide/libide.gresource.xml
@@ -34,6 +34,7 @@
     <file compressed="true" alias="shared.css">../data/themes/shared.css</file>
     <file compressed="true" alias="shared/shared-editor.css">../data/themes/shared/shared-editor.css</file>
     <file compressed="true" alias="shared/shared-layout.css">../data/themes/shared/shared-layout.css</file>
+    <file compressed="true" alias="shared/shared-search.css">../data/themes/shared/shared-search.css</file>
     <file compressed="true" 
alias="shared/shared-treeview.css">../data/themes/shared/shared-treeview.css</file>
   </gresource>
 
diff --git a/plugins/devhelp/gbp-devhelp-search.ui b/plugins/devhelp/gbp-devhelp-search.ui
index 96793ae..b51ace0 100644
--- a/plugins/devhelp/gbp-devhelp-search.ui
+++ b/plugins/devhelp/gbp-devhelp-search.ui
@@ -9,7 +9,7 @@
         <property name="visible">true</property>
         <property name="margin-end">12</property>
         <style>
-          <class name="gb-search-frame"/>
+          <class name="search-frame"/>
         </style>
         <child>
           <object class="GtkGrid">
diff --git a/plugins/terminal/gb-terminal-search.ui b/plugins/terminal/gb-terminal-search.ui
index 1b1f0e6..c7bab92 100644
--- a/plugins/terminal/gb-terminal-search.ui
+++ b/plugins/terminal/gb-terminal-search.ui
@@ -11,7 +11,7 @@
             <property name="visible">true</property>
             <property name="margin-end">12</property>
             <style>
-              <class name="gb-search-frame"/>
+              <class name="search-frame"/>
             </style>
             <child>
               <object class="GtkBox">
@@ -217,4 +217,4 @@
       </object>
     <!-- </child>
   </template> -->
-</interface>
\ No newline at end of file
+</interface>