Bug 1383051 - fixing windows 10 window control alignment and indicator alignment in windows 7. r=jaws
authorYura Zenevich <yura.zenevich@gmail.com>
Wed, 20 Sep 2017 15:17:36 -0400
changeset 668161 0f94bac50b3701aa729b5fbc395119ce577edb87
parent 668160 1d059590a69b58c613c018ff4e06c6eeeec1955b
child 668162 276e210419d6a607666f82f5a948c98b5abd5af8
push id80945
push usernnethercote@mozilla.com
push dateThu, 21 Sep 2017 07:22:53 +0000
reviewersjaws
bugs1383051
milestone57.0a1
Bug 1383051 - fixing windows 10 window control alignment and indicator alignment in windows 7. r=jaws MozReview-Commit-ID: 2aaYqbmjOjI
browser/themes/osx/browser.css
browser/themes/shared/browser.inc.css
browser/themes/windows/browser.css
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -63,18 +63,20 @@
   display: none;
 }
 
 /* Making the toolbox position:relative (browser.inc.css) occludes titlebar indicators
  * if the toolbox has a background. Fix this by positioning the relevant elements, too: */
 #titlebar-secondary-buttonbox {
   position: relative;
   z-index: 1;
-  align-items: center;
-  display: flex;
+}
+
+#titlebar-buttonbox-container {
+  -moz-box-align: center;
 }
 
 /* These would be margin-inline-start/end if it wasn't for the fact that OS X
  * doesn't reverse the order of the items in the titlebar in RTL mode. */
 .titlebar-placeholder[type="caption-buttons"],
 #titlebar-buttonbox {
   margin-left: 7px;
 }
--- a/browser/themes/shared/browser.inc.css
+++ b/browser/themes/shared/browser.inc.css
@@ -85,16 +85,17 @@
 .private-browsing-indicator {
   background-repeat: no-repeat;
   background-size: 100% auto;
   background-position: center;
   width: 24px;
   height: 24px;
   margin-left: 8px;
   margin-right: 8px;
+  position: relative;
   /* Need to ensure this gets positioned on top of the position:relative #navigator-toolbox
    * in case the dark/light themes give that item a background. */
   z-index: 1;
 }
 
 .accessibility-indicator {
   background-image: url("chrome://browser/skin/accessibility.svg");
   -moz-user-focus: normal;
--- a/browser/themes/windows/browser.css
+++ b/browser/themes/windows/browser.css
@@ -277,20 +277,25 @@
  * window state. Otherwise, elements in the navigator-toolbox, like the menubar,
  * can swallow those events. It will also place the buttons above the fog on
  * Windows 7 with Aero Glass.
  */
 #titlebar-buttonbox {
   z-index: 1;
 }
 
-#titlebar-buttonbox,
 #titlebar-buttonbox-container {
-  display: flex;
-  align-items: center;
+  -moz-box-align: center;
+}
+
+@media (-moz-os-version: windows-win7) {
+  /* Preserve window control buttons position at the top of the button box. */
+  #titlebar-buttonbox-container {
+    -moz-box-align: start;
+  }
 }
 
 .titlebar-placeholder[type="caption-buttons"] {
   margin-left: 22px; /* space needed for Aero Snap */
 }
 
 /* titlebar command buttons */
 
@@ -1118,16 +1123,29 @@ notification[value="translation"] {
 #main-window:-moz-any([customize-entering],[customize-exiting]) label {
   transform: perspective(0.01px);
 }
 
 /* End customization mode */
 
 /* Private browsing and accessibility indicators */
 
+@media (-moz-os-version: windows-win7) {
+  /* Making sure that indicators take up all available vertical space. */
+  :root[tabsintitlebar]:not([inFullscreen]) .private-browsing-indicator,
+  :root[tabsintitlebar]:not([inFullscreen]) .accessibility-indicator {
+    height: var(--tab-min-height);
+  }
+
+  :root[tabsintitlebar][sizemode="normal"]:not([inFullscreen]) .private-browsing-indicator,
+  :root[tabsintitlebar][sizemode="normal"]:not([inFullscreen]) .accessibility-indicator {
+    height: calc(var(--tab-min-height) + 4px);
+  }
+}
+
 :root:-moz-any([tabsintitlebar], [inFullscreen]):not([privatebrowsingmode=temporary]) .accessibility-indicator,
 :root:-moz-any([tabsintitlebar], [inFullscreen]) .private-browsing-indicator {
   margin-inline-end: 12px;
 }
 
 :root:not([accessibilitymode]) .private-browsing-indicator,
 .accessibility-indicator {
   margin-inline-start: 12px;