Bug 967752 - Use media queries instead of the more expensive vw unit to adjust the identity label for small windows. r=jaws a=sledru
authorDão Gottwald <dao@mozilla.com>
Wed, 26 Feb 2014 09:08:45 +0100
changeset 177237 4d90aa42194ef1215441112ee725f50d796b0158
parent 177236 92ea8e6bdb6e21002f3fdaba23a6d2f84ab1729b
child 177238 7d9d7b90548bebe112402dea904942381f78716d
push id5310
push userdgottwald@mozilla.com
push dateThu, 27 Feb 2014 10:28:08 +0000
treeherdermozilla-aurora@7d9d7b90548b [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjaws, sledru
bugs967752
milestone29.0a2
Bug 967752 - Use media queries instead of the more expensive vw unit to adjust the identity label for small windows. r=jaws a=sledru
browser/base/content/browser.css
browser/base/content/test/general/browser_windowopen_reflows.js
--- a/browser/base/content/browser.css
+++ b/browser/base/content/browser.css
@@ -384,17 +384,32 @@ panel[noactions] > richlistbox > richlis
   visibility: collapse;
 }
 
 #urlbar[pageproxystate="invalid"] > #identity-box {
   pointer-events: none;
 }
 
 #identity-icon-labels {
-  max-width: 12vw;
+  max-width: 18em;
+}
+@media (max-width: 700px) {
+  #identity-icon-labels {
+    max-width: 70px;
+  }
+}
+@media (max-width: 600px) {
+  #identity-icon-labels {
+    max-width: 60px;
+  }
+}
+@media (max-width: 500px) {
+  #identity-icon-labels {
+    max-width: 50px;
+  }
 }
 
 #identity-icon-country-label {
   direction: ltr;
 }
 
 #identity-box.verifiedIdentity > #identity-icon-labels > #identity-icon-label {
   -moz-margin-end: 0.25em !important;
--- a/browser/base/content/test/general/browser_windowopen_reflows.js
+++ b/browser/base/content/test/general/browser_windowopen_reflows.js
@@ -20,25 +20,27 @@ const EXPECTED_REFLOWS = [
   // Focusing the content area causes a reflow.
   "gBrowserInit._delayedStartup@chrome://browser/content/browser.js|",
 
   // Sometimes sessionstore collects data during this test, which causes a sync reflow
   // (https://bugzilla.mozilla.org/show_bug.cgi?id=892154 will fix this)
   "ssi_getWindowDimension@resource:///modules/sessionstore/SessionStore.jsm",
 ];
 
-if (Services.appinfo.OS == "Darwin") {
-  // TabsInTitlebar._update causes a reflow on OS X trying to do calculations
+if (Services.appinfo.OS == "WINNT" || Services.appinfo.OS == "Darwin") {
+  // TabsInTitlebar._update causes a reflow on OS X and Windows trying to do calculations
   // since layout info is already dirty. This doesn't seem to happen before
-  // MozAfterPaint on other platforms.
+  // MozAfterPaint on Linux.
   EXPECTED_REFLOWS.push("rect@chrome://browser/content/browser.js|" +
                           "TabsInTitlebar._update@chrome://browser/content/browser.js|" +
                           "updateAppearance@chrome://browser/content/browser.js|" +
                           "handleEvent@chrome://browser/content/tabbrowser.xml|");
+}
 
+if (Services.appinfo.OS == "Darwin") {
   // _onOverflow causes a reflow getting widths.
   EXPECTED_REFLOWS.push("OverflowableToolbar.prototype._onOverflow@resource:///modules/CustomizableUI.jsm|" +
                         "OverflowableToolbar.prototype.init@resource:///modules/CustomizableUI.jsm|" +
                         "OverflowableToolbar.prototype.observe@resource:///modules/CustomizableUI.jsm|" +
                         "gBrowserInit._delayedStartup@chrome://browser/content/browser.js|");
   // Same as above since in packaged builds there are no function names and the resource URI includes "app"
   EXPECTED_REFLOWS.push("@resource://app/modules/CustomizableUI.jsm|" +
                           "@resource://app/modules/CustomizableUI.jsm|" +