Bug 1377009 - Search field should always float on the top r=jaws
authorRicky Chien <ricky060709@gmail.com>
Wed, 12 Jul 2017 16:25:03 +0800
changeset 420485 691b88d4102b920415847447b679e2505fb2307a
parent 420484 7a3c198ec2295afad76f5cd0e978a763b9def404
child 420486 e4f2a707af8041958ed7fff1f4ce0740bb4917f8
push id7566
push usermtabara@mozilla.com
push dateWed, 02 Aug 2017 08:25:16 +0000
treeherdermozilla-beta@86913f512c3c [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjaws
bugs1377009
milestone56.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1377009 - Search field should always float on the top r=jaws MozReview-Commit-ID: 620fK75clzc
browser/components/preferences/in-content-new/preferences.xul
browser/themes/shared/incontentprefs/preferences.inc.css
--- a/browser/components/preferences/in-content-new/preferences.xul
+++ b/browser/components/preferences/in-content-new/preferences.xul
@@ -175,27 +175,29 @@
            Remove this keyset once bug 1094240 ("disablefastfind" attribute
            broken in e10s mode) is fixed. -->
       <key key="&focusSearch1.key;" modifiers="accel" id="focusSearch1" oncommand=";"/>
     </keyset>
 
     <html:a class="help-button" target="_blank" aria-label="&helpButton2.label;">&helpButton2.label;</html:a>
 
     <vbox class="main-content" flex="1">
-      <hbox pack="end">
-        <textbox type="search" id="searchInput" hidden="true" clickSelectsAll="true"/>
-      </hbox>
-      <prefpane id="mainPrefPane">
+      <vbox class="pane-container">
+        <hbox class="search-container" pack="end">
+          <textbox type="search" id="searchInput" hidden="true" clickSelectsAll="true"/>
+        </hbox>
+        <prefpane id="mainPrefPane">
 #include searchResults.xul
 #include main.xul
 #include search.xul
 #include privacy.xul
 #include containers.xul
 #include sync.xul
-      </prefpane>
+        </prefpane>
+      </vbox>
     </vbox>
   </hbox>
 
   <stack id="dialogStack" hidden="true"/>
   <vbox id="dialogTemplate" class="dialogOverlay" align="center" pack="center" topmost="true" hidden="true">
     <groupbox class="dialogBox"
               orient="vertical"
               pack="end"
--- a/browser/themes/shared/incontentprefs/preferences.inc.css
+++ b/browser/themes/shared/incontentprefs/preferences.inc.css
@@ -1,17 +1,26 @@
 %if 0
 /* - This Source Code Form is subject to the terms of the Mozilla Public
    - License, v. 2.0. If a copy of the MPL was not distributed with this file,
    - You can obtain one at http://mozilla.org/MPL/2.0/. */
 %endif
 @namespace html "http://www.w3.org/1999/xhtml";
 
+.main-content {
+  padding-top: 0;
+}
+
+.pane-container {
+  display: block;
+  max-width: 800px;
+}
+
 #mainPrefPane {
-  max-width: 800px;
+  width: 100%;
   padding: 0;
   font: message-box;
   font-size: 1.25rem;
 }
 
 description.indent,
 .indent > description {
   font-size: 1.18rem;
@@ -635,16 +644,28 @@ groupbox {
 }
 
 .help-button:link,
 .help-button:visited {
   color: var(--in-content-category-text);
   text-decoration: none;
 }
 
+.search-container {
+  position: sticky;
+  background-color: var(--in-content-page-background);
+  width: 100%;
+  top: 0;
+  z-index: 1;
+}
+
+#searchInput {
+  margin: 20px 0;
+}
+
 .search-tooltip {
   font-size: 1.25rem;
   position: absolute;
   padding: 0 10px;
   background-color: #ffe900;
   border: 1px solid #d7b600;
   -moz-user-select: none;
 }