Bug 1036288 - Fix search box to 2 columns width instead of stretching all the way [r=adw]
authorEd Lee <edilee@mozilla.com>
Fri, 18 Jul 2014 23:14:32 -0700
changeset 216989 5ff842db2ba7857a11e2bb06b42106378fe533dd
parent 216988 d407b2eb63213272418b49bfee87631d60f213df
child 216990 0d2f538bddde4e7fd0a8663aebba3c2b925de796
push id515
push userraliiev@mozilla.com
push dateMon, 06 Oct 2014 12:51:51 +0000
treeherdermozilla-release@267c7a481bef [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersadw
bugs1036288
milestone33.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 1036288 - Fix search box to 2 columns width instead of stretching all the way [r=adw] Make the search as big as possible but contained within 2 columns.
browser/base/content/newtab/grid.js
browser/base/content/newtab/newTab.css
browser/base/content/newtab/search.js
browser/base/content/test/newtab/browser.ini
browser/base/content/test/newtab/browser_newtab_bug1001854.js
--- a/browser/base/content/newtab/grid.js
+++ b/browser/base/content/newtab/grid.js
@@ -204,20 +204,15 @@ let gGrid = {
     let availSpace = document.documentElement.clientHeight - this._cellMargin -
                      document.querySelector("#newtab-margin-undo-container").offsetHeight -
                      document.querySelector("#newtab-search-container").offsetHeight;
     let visibleRows = Math.floor(availSpace / this._cellHeight);
     this._node.style.height = this._computeHeight() + "px";
     this._node.style.maxHeight = this._computeHeight(visibleRows) + "px";
     this._node.style.maxWidth = gGridPrefs.gridColumns * this._cellWidth +
                                 GRID_WIDTH_EXTRA + "px";
-
-    // Resize the search bar.
-    let width = parseFloat(window.getComputedStyle(this._node).width);
-    let visibleCols = Math.floor(width / this._cellWidth);
-    gSearch.setWidth(visibleCols * this._cellWidth - this._cellMargin);
   },
 
   _shouldRenderGrid : function Grid_shouldRenderGrid() {
     let cellsLength = this._node.querySelectorAll(".newtab-cell").length;
     return cellsLength != (gGridPrefs.gridRows * gGridPrefs.gridColumns);
   }
 };
--- a/browser/base/content/newtab/newTab.css
+++ b/browser/base/content/newtab/newTab.css
@@ -250,20 +250,22 @@ input[type=button] {
 
 #newtab-search-container[page-disabled] {
   opacity: 0;
   pointer-events: none;
 }
 
 #newtab-search-form {
   display: -moz-box;
+  -moz-box-flex: 1;
   -moz-box-orient: horizontal;
   -moz-box-align: center;
   height: 44px; /* 32 + 6 logo top "padding" + 6 logo bottom "padding" */
-  margin-bottom: 10px; /* 32 - 16 tiles top margin - 6 logo bottom "padding" */
+  margin: 0 20px 10px; /* bottom: 32 - 16 tiles top margin - 6 logo bottom "padding" */
+  max-width: 600px; /* 2 * (290 cell width + 10 cell margin) */
 }
 
 #newtab-search-logo {
   display: -moz-box;
   width: 77px; /* 65 image width + 6 left "padding" + 6 right "padding" */
   height: 38px; /* 26 image height + 6 top "padding" + 6 bottom "padding" */
   border: 1px solid transparent;
   -moz-margin-end: 8px;
--- a/browser/base/content/newtab/search.js
+++ b/browser/base/content/newtab/search.js
@@ -41,21 +41,16 @@ let gSearch = {
     }
   },
 
   manageEngines: function () {
     this._nodes.panel.hidePopup();
     this._send("ManageEngines");
   },
 
-  setWidth: function (width) {
-    this._nodes.form.style.width = width + "px";
-    this._nodes.form.style.maxWidth = width + "px";
-  },
-
   handleEvent: function (event) {
     this["on" + event.detail.type](event.detail.data);
   },
 
   onState: function (data) {
     this._newEngines = data.engines;
     this._setCurrentEngine(data.currentEngine);
     this._initWhenInitalStateReceived();
--- a/browser/base/content/test/newtab/browser.ini
+++ b/browser/base/content/test/newtab/browser.ini
@@ -14,17 +14,16 @@ support-files =
 [browser_newtab_bug735987.js]
 skip-if = os == "mac" # Intermittent failures, bug 898317
 [browser_newtab_bug752841.js]
 [browser_newtab_bug765628.js]
 [browser_newtab_bug876313.js]
 [browser_newtab_bug991111.js]
 [browser_newtab_bug991210.js]
 [browser_newtab_bug998387.js]
-[browser_newtab_bug1001854.js]
 [browser_newtab_disable.js]
 [browser_newtab_drag_drop.js]
 [browser_newtab_drag_drop_ext.js]
 [browser_newtab_drop_preview.js]
 [browser_newtab_focus.js]
 [browser_newtab_perwindow_private_browsing.js]
 [browser_newtab_reportLinkAction.js]
 [browser_newtab_reset.js]
deleted file mode 100644
--- a/browser/base/content/test/newtab/browser_newtab_bug1001854.js
+++ /dev/null
@@ -1,20 +0,0 @@
-/* Any copyright is dedicated to the Public Domain.
-   http://creativecommons.org/publicdomain/zero/1.0/ */
-
-const PRELOAD_PREF = "browser.newtab.preload";
-
-function runTests() {
-  // turn off preload to ensure that a newtab page loads as disabled
-  Services.prefs.setBoolPref(PRELOAD_PREF, false);
-  Services.prefs.setBoolPref(PREF_NEWTAB_ENABLED, false);
-  yield addNewTabPageTab();
-
-  let search = getContentDocument().getElementById("newtab-search-form");
-  is(search.style.width, "", "search form has no width yet");
-
-  NewTabUtils.allPages.enabled = true;
-  isnot(search.style.width, "", "search form has width set");
-
-  // restore original state
-  Services.prefs.clearUserPref(PRELOAD_PREF);
-}