From: Robert Kaiser <kairo@kairo.at>
Date: Tue, 30 Dec 2014 01:09:08 +0000 (+0100)
Subject: style new search UI
X-Git-Tag: LCARStrek-2.31~1
X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=commitdiff_plain;h=58036cb8df01894560483ebc2abd3115258e8a90

style new search UI
---

diff --git a/EarlyBlue/global/in-content/common.css b/EarlyBlue/global/in-content/common.css
index b50fb302..07afc667 100644
--- a/EarlyBlue/global/in-content/common.css
+++ b/EarlyBlue/global/in-content/common.css
@@ -176,6 +176,10 @@ xul|menulist > xul|*.menulist-label-box {
   padding-left: 10px !important;
 }
 
+xul|menulist > xul|*.menulist-label-box > xul|*.menulist-icon {
+  -moz-margin-end: 5px;
+}
+
 xul|button[type="menu"] > xul|*.button-box > xul|*.button-menu-dropmarker {
   -moz-appearance: none;
   margin: 1px 0;
@@ -447,6 +451,10 @@ xul|*.checkbox-label-box {
   }
 }
 
+xul|richlistitem > xul|*.checkbox-check {
+  margin: 3px 6px;
+}
+
 xul|*.radio-check {
   -moz-appearance: none;
   width: 23px;
diff --git a/LCARStrek/browser/badge-add-engine.png b/LCARStrek/browser/badge-add-engine.png
new file mode 100644
index 00000000..052bd44b
Binary files /dev/null and b/LCARStrek/browser/badge-add-engine.png differ
diff --git a/LCARStrek/browser/browser.css b/LCARStrek/browser/browser.css
index ed83e18b..c43e7363 100644
--- a/LCARStrek/browser/browser.css
+++ b/LCARStrek/browser/browser.css
@@ -5493,6 +5493,54 @@ toolbarpaletteitem[place="toolbar"] {
   color: #000000;
 }
 
+.SearchHighlight {
+  -moz-margin-end: 6px;
+  font-size: 110%;
+  width: 225px;
+}
+
+.SearchHighlight label,
+.SearchHighlight description {
+  color: #008484;
+  margin: 0 0 8px 0;
+  padding: 0;
+}
+
+.SearchHighlightTitle {
+  font-weight: bold;
+}
+
+.SearchHighlight .dot {
+  width: 7px;
+  height: 7px;
+  background-image: -moz-image-rect(url("chrome://browser/skin/dots.png"), 0, 100%, 100%, 9);
+  background-size: 7px;
+  background-position: center center;
+  background-repeat: no-repeat;
+  -moz-margin-end: 2px;
+}
+
+.SearchHighlight .dot.filled {
+  background-image: -moz-image-rect(url("chrome://browser/skin/dots.png"), 0, 7, 100%, 0);
+}
+
+.SearchHighlight button {
+  margin: 0;
+  /* On some platforms clicking the button will steal focus from the search box
+     causing the popup to close. */
+  -moz-user-focus: ignore;
+}
+
+@media not all and (max-resolution: 1dppx) {
+  .SearchHighlight .dot {
+    background-image: -moz-image-rect(url("chrome://browser/skin/dots@2x.png"), 0, 100%, 100%, 18);
+  }
+
+  .SearchHighlight .dot.filled {
+    background-image: -moz-image-rect(url("chrome://browser/skin/dots@2x.png"), 0, 14, 100%, 0);
+  }
+}
+
 /* === END UITour.inc.css === */
 
 #UITourTooltipButtons {
diff --git a/LCARStrek/browser/dots.png b/LCARStrek/browser/dots.png
new file mode 100644
index 00000000..d47b6382
Binary files /dev/null and b/LCARStrek/browser/dots.png differ
diff --git a/LCARStrek/browser/dots@2x.png b/LCARStrek/browser/dots@2x.png
new file mode 100644
index 00000000..b7c1aff8
Binary files /dev/null and b/LCARStrek/browser/dots@2x.png differ
diff --git a/LCARStrek/browser/magnifier.png b/LCARStrek/browser/magnifier.png
new file mode 100644
index 00000000..bcce4ad2
Binary files /dev/null and b/LCARStrek/browser/magnifier.png differ
diff --git a/LCARStrek/browser/magnifier@2x.png b/LCARStrek/browser/magnifier@2x.png
new file mode 100644
index 00000000..6aef26a1
Binary files /dev/null and b/LCARStrek/browser/magnifier@2x.png differ
diff --git a/LCARStrek/browser/newtab/newTab.css b/LCARStrek/browser/newtab/newTab.css
index 1e86ac88..fad81c15 100644
--- a/LCARStrek/browser/newtab/newTab.css
+++ b/LCARStrek/browser/newtab/newTab.css
@@ -145,7 +145,7 @@
 }
 
 /* TITLES */
-#newtab-intro-what,
+/*#newtab-intro-what,*/
 .newtab-sponsored,
 .newtab-title {
   padding: 0 8px;
diff --git a/LCARStrek/browser/preferences/in-content/icons.png b/LCARStrek/browser/preferences/in-content/icons.png
index 51c4ac85..44f2b8dc 100644
Binary files a/LCARStrek/browser/preferences/in-content/icons.png and b/LCARStrek/browser/preferences/in-content/icons.png differ
diff --git a/LCARStrek/browser/preferences/in-content/icons@2x.png b/LCARStrek/browser/preferences/in-content/icons@2x.png
index 1b10091c..9df30050 100644
Binary files a/LCARStrek/browser/preferences/in-content/icons@2x.png and b/LCARStrek/browser/preferences/in-content/icons@2x.png differ
diff --git a/LCARStrek/browser/preferences/in-content/preferences.css b/LCARStrek/browser/preferences/in-content/preferences.css
index 397f8a54..816a34bd 100644
--- a/LCARStrek/browser/preferences/in-content/preferences.css
+++ b/LCARStrek/browser/preferences/in-content/preferences.css
@@ -98,6 +98,15 @@ prefpane {
   -moz-image-region: rect(24px, 24px, 48px, 0);
 }
 
+#category-search > .category-icon {
+  -moz-image-region: rect(0, 194px, 24px, 168px);
+}
+
+#category-search:hover > .category-icon,
+#category-search[selected] > .category-icon {
+  -moz-image-region: rect(24px, 194px, 48px, 168px);
+}
+
 #category-content > .category-icon {
   -moz-image-region: rect(0, 48px,  24px, 24px)
 }
@@ -419,14 +428,25 @@ caption {
     -moz-image-region: rect(0, 48px, 48px, 0);
   }
 
+  #category-general:hover > .category-icon,
   #category-general[selected] > .category-icon {
     -moz-image-region: rect(48px, 48px, 96px, 0);
   }
 
+  #category-search > .category-icon {
+    -moz-image-region: rect(0, 384px, 48px, 336px);
+  }
+
+  #category-search:hover > .category-icon,
+  #category-search[selected] > .category-icon {
+    -moz-image-region: rect(48, 384px, 96px, 336px);
+  }
+
   #category-content > .category-icon {
     -moz-image-region: rect(0, 96px, 48px, 48px);
   }
 
+  #category-content:hover > .category-icon,
   #category-content[selected] > .category-icon {
     -moz-image-region: rect(48px, 96px, 96px, 48px);
   }
@@ -435,6 +455,7 @@ caption {
     -moz-image-region: rect(0, 144px, 48px, 96px);
   }
 
+  #category-application:hover > .category-icon,
   #category-application[selected] > .category-icon {
     -moz-image-region: rect(48px, 144px, 96px, 96px);
   }
@@ -443,6 +464,7 @@ caption {
     -moz-image-region: rect(0, 192px, 48px, 144px);
   }
 
+  #category-privacy:hover > .category-icon,
   #category-privacy[selected] > .category-icon {
     -moz-image-region: rect(48px, 192px, 96px, 144px);
   }
@@ -451,6 +473,7 @@ caption {
     -moz-image-region: rect(0, 240px, 48px, 192px);
   }
 
+  #category-security:hover > .category-icon,
   #category-security[selected] > .category-icon {
     -moz-image-region: rect(48px, 240px, 96px, 192px);
   }
@@ -459,6 +482,7 @@ caption {
     -moz-image-region: rect(0, 288px, 48px, 240px);
   }
 
+  #category-sync:hover > .category-icon,
   #category-sync[selected] > .category-icon {
     -moz-image-region: rect(48px, 288px, 96px, 240px);
   }
@@ -467,6 +491,7 @@ caption {
     -moz-image-region: rect(0, 336px, 48px, 288px);
   }
 
+  #category-advanced:hover > .category-icon,
   #category-advanced[selected] > .category-icon {
     -moz-image-region: rect(48px, 336px, 96px, 288px);
   }
diff --git a/LCARStrek/browser/preferences/preferences.css b/LCARStrek/browser/preferences/preferences.css
index b3200726..8e333868 100644
--- a/LCARStrek/browser/preferences/preferences.css
+++ b/LCARStrek/browser/preferences/preferences.css
@@ -27,6 +27,14 @@ radio[pane=paneTabs]:not([selected="true"]):hover {
   -moz-image-region: rect(32px, 64px, 64px, 32px);
 }
 
+#BrowserPreferences radio[pane=paneSearch] {
+  list-style-image: url("chrome://browser/skin/search-pref.png");
+}
+
+#BrowserPreferences radio[pane=paneSearch]:not([selected="true"]):hover {
+  list-style-image: url("chrome://browser/skin/search-pref-hover.png");
+}
+
 radio[pane=paneContent] {
   -moz-image-region: rect(0, 96px,  32px, 64px);
 }
diff --git a/LCARStrek/browser/search-engine-placeholder.png b/LCARStrek/browser/search-engine-placeholder.png
new file mode 100644
index 00000000..5397a5a0
Binary files /dev/null and b/LCARStrek/browser/search-engine-placeholder.png differ
diff --git a/LCARStrek/browser/search-indicator-add-engine.png b/LCARStrek/browser/search-indicator-add-engine.png
new file mode 100644
index 00000000..da98000e
Binary files /dev/null and b/LCARStrek/browser/search-indicator-add-engine.png differ
diff --git a/LCARStrek/browser/search-indicator.png b/LCARStrek/browser/search-indicator.png
new file mode 100644
index 00000000..9d07fe2a
Binary files /dev/null and b/LCARStrek/browser/search-indicator.png differ
diff --git a/LCARStrek/browser/search-oneoff-bg-border.png b/LCARStrek/browser/search-oneoff-bg-border.png
new file mode 100644
index 00000000..415bf150
Binary files /dev/null and b/LCARStrek/browser/search-oneoff-bg-border.png differ
diff --git a/LCARStrek/browser/search-pref-hover.png b/LCARStrek/browser/search-pref-hover.png
new file mode 100644
index 00000000..0bf5ff87
Binary files /dev/null and b/LCARStrek/browser/search-pref-hover.png differ
diff --git a/LCARStrek/browser/search-pref.png b/LCARStrek/browser/search-pref.png
new file mode 100644
index 00000000..4576fa2e
Binary files /dev/null and b/LCARStrek/browser/search-pref.png differ
diff --git a/LCARStrek/browser/searchbar.css b/LCARStrek/browser/searchbar.css
index a7c3127b..ee833eb1 100644
--- a/LCARStrek/browser/searchbar.css
+++ b/LCARStrek/browser/searchbar.css
@@ -82,3 +82,172 @@
 .searchbar-engine-menuitem[selected="true"] > .menu-iconic-text {
   font-weight: bold;
 }
+
+
+.searchbar-search-button-container {
+  -moz-box-align: center;
+  padding: 3px 4px;
+  -moz-padding-end: 2px;
+}
+
+.searchbar-search-button {
+  list-style-image: url("chrome://browser/skin/search-indicator.png");
+  -moz-image-region: rect(0, 20px, 20px, 0);
+  margin: -2px -2px;
+}
+
+.searchbar-search-button:hover,
+.searchbar-search-button:hover:active {
+  -moz-image-region: rect(0, 40px, 20px, 20px);
+}
+
+searchbar[oneoffui] .search-go-button {
+  list-style-image: url("chrome://browser/skin/reload-stop-go.png");
+  -moz-image-region: rect(0, 42px, 14px, 28px);
+}
+
+searchbar[oneoffui] .search-go-button:hover {
+  -moz-image-region: rect(14px, 42px, 28px, 28px);
+}
+
+searchbar[oneoffui] .search-go-button:hover:active {
+  -moz-image-region: rect(28px, 42px, 42px, 28px);
+}
+
+searchbar[oneoffui] .search-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
+  transform: scaleX(-1);
+}
+
+
+.search-panel-current-engine {
+  border-top: none !important;
+  border-bottom: 1px solid #9C9CFF;
+  -moz-box-align: center;
+}
+
+.search-panel-header {
+  font-weight: normal;
+  background-color: #A09090;
+  border-top: 1px solid #9C9CFF;
+  margin: 0;
+  padding: 3px 6px;
+  color: #000000;
+}
+
+.search-panel-current-input > label {
+  margin: 0 0 !important;
+}
+
+.search-panel-input-value {
+  color: black;
+}
+
+.search-panel-one-offs {
+  margin: 0 0 !important;
+  border-top: 1px solid #9C9CFF;
+}
+
+.searchbar-engine-one-off-item {
+  -moz-appearance: none;
+  display: inline-block;
+  border: none;
+  min-width: 48px;
+  height: 32px;
+  margin: 0 0;
+  padding: 0 0;
+  background: none;
+  background-image: url('chrome://browser/skin/search-oneoff-bg-border.png');
+  background-repeat: no-repeat;
+  background-position: right center;
+}
+
+.searchbar-engine-one-off-item:not(.last-row) {
+  box-sizing: padding-box;
+  border-bottom: 1px solid #9C9CFF;
+}
+
+.searchbar-engine-one-off-item.last-of-row {
+  background-image: none;
+}
+
+.searchbar-engine-one-off-item:hover:not(.dummy),
+.searchbar-engine-one-off-item[selected] {
+  background-color: #008484;
+  background-image: none;
+}
+
+.searchbar-engine-one-off-item > .button-box {
+  border: none;
+  padding: 0 0;
+}
+
+.searchbar-engine-one-off-item > .button-box > .button-text {
+  display: none;
+}
+
+.searchbar-engine-one-off-item > .button-box > .button-icon {
+  width: 16px;
+  height: 16px;
+}
+ 
+.addengine-item {
+  -moz-appearance: none;
+  border: none;
+  height: 32px;
+  margin: 0 0;
+  padding: 0 10px;
+}
+
+.addengine-item > .button-box {
+  -moz-box-pack: start;
+}
+
+.addengine-item:first-of-type {
+  border-top: 1px solid #9C9CFF;
+}
+
+.addengine-item:hover {
+  background-color: #FFCF00;
+  color: #000000;
+}
+
+.addengine-item > .button-box > .button-icon {
+  width: 16px;
+}
+
+.addengine-item > .button-box > .button-text {
+  -moz-box-flex: 1;
+  text-align: start;
+  -moz-padding-start: 10px;
+}
+
+.addengine-item:not([image]) {
+  list-style-image: url("chrome://browser/skin/search-engine-placeholder.png");
+}
+
+searchbar[oneoffui] .searchbar-engine-button {
+  display: none;
+}
+
+.search-panel-tree > .autocomplete-treebody::-moz-tree-cell {
+  -moz-padding-start: 15px;
+  border-top: none !important;
+}
+
+searchbar[oneoffui] .searchbar-engine-image {
+  -moz-margin-start: -1px;
+}
+
+.search-setting-button {
+  -moz-appearance: none;
+  border-bottom: none;
+  border-left: none;
+  border-right: none;
+  -moz-border-top-colors: none;
+  min-height: 32px;
+}
+
+.search-setting-button:hover {
+  background-color: #FFCF00;
+  border-top-color: #9C9CFF;
+}
diff --git a/LCARStrek/global/in-content/common.css b/LCARStrek/global/in-content/common.css
index 3cd62d97..9e7dc971 100644
--- a/LCARStrek/global/in-content/common.css
+++ b/LCARStrek/global/in-content/common.css
@@ -179,6 +179,10 @@ xul|menulist > xul|*.menulist-label-box {
   padding-left: 10px !important;
 }
 
+xul|menulist > xul|*.menulist-label-box > xul|*.menulist-icon {
+  -moz-margin-end: 5px;
+}
+
 xul|button[type="menu"] > xul|*.button-box > xul|*.button-menu-dropmarker {
   -moz-appearance: none;
   margin: 1px 0;
@@ -450,6 +454,10 @@ xul|*.checkbox-label-box {
   }
 }
 
+xul|richlistitem > xul|*.checkbox-check {
+  margin: 3px 6px;
+}
+
 xul|*.radio-check {
   -moz-appearance: none;
   width: 23px;