mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-16 14:55:47 +00:00
Bug 1375335 - Fix window control height calculation on Windows 10. r=dao
This commit: - Makes the window controls have exactly the same height as tabs when the menubar is hidden, and have the same height as the menubar when it is shown. This requires us to remove the menubar height before flushing layout in case it is shown, since we need its original height for the calculation. - Removes the top margin between the menu bar and the window border that was present on Windows 10 and makes it apply on Windows 7 only. The border was causing miscalculations of the window control height, which could have been handled in browser-tabsintitlebar.js, but since it's not part of the Photon spec we decide to remove it entirely. - Makes window control height calculations ignore vertical tabs toolbar margins. The only margin it has right now is -1px and the calculation code doesn't work right with negative margins. MozReview-Commit-ID: HJXxUUJFX8x --HG-- extra : rebase_source : d3dc3a1c7d21b8ca8304b25fb67b50a58a5e4ce3
This commit is contained in:
parent
92117a8c9e
commit
5249a7320c
@ -148,13 +148,19 @@ var TabsInTitlebar = {
|
||||
document.documentElement.setAttribute("tabsintitlebar", "true");
|
||||
updateTitlebarDisplay();
|
||||
|
||||
// Reset the custom titlebar height if the menubar is shown,
|
||||
// because we will want to calculate its original height.
|
||||
if (AppConstants.isPlatformAndVersionAtLeast("win", "10.0") &&
|
||||
(menubar.getAttribute("inactive") != "true" ||
|
||||
menubar.getAttribute("autohide") != "true")) {
|
||||
$("titlebar-buttonbox").style.removeProperty("height");
|
||||
}
|
||||
|
||||
// Try to avoid reflows in this code by calculating dimensions first and
|
||||
// then later set the properties affecting layout together in a batch.
|
||||
|
||||
// Get the full height of the tabs toolbar:
|
||||
let tabsToolbar = $("TabsToolbar");
|
||||
let tabsStyles = window.getComputedStyle(tabsToolbar);
|
||||
let fullTabsHeight = rect(tabsToolbar).height + verticalMargins(tabsStyles);
|
||||
// Get the height of the tabs toolbar:
|
||||
let tabsHeight = rect($("TabsToolbar")).height;
|
||||
// Buttons first:
|
||||
let captionButtonsBoxWidth = rect($("titlebar-buttonbox-container")).width;
|
||||
|
||||
@ -176,12 +182,12 @@ var TabsInTitlebar = {
|
||||
|
||||
// Begin setting CSS properties which will cause a reflow
|
||||
|
||||
// On Windows 10, adjust the window controls to span the entire
|
||||
// tab strip height if we're not showing a menu bar.
|
||||
if (AppConstants.isPlatformAndVersionAtLeast("win", "10.0")) {
|
||||
if (!menuHeight && window.windowState == window.STATE_MAXIMIZED) {
|
||||
titlebarContentHeight = Math.max(titlebarContentHeight, fullTabsHeight);
|
||||
if (!menuHeight) {
|
||||
titlebarContentHeight = tabsHeight;
|
||||
$("titlebar-buttonbox").style.height = titlebarContentHeight + "px";
|
||||
} else {
|
||||
$("titlebar-buttonbox").style.removeProperty("height");
|
||||
}
|
||||
}
|
||||
|
||||
@ -214,7 +220,7 @@ var TabsInTitlebar = {
|
||||
|
||||
// Next, we calculate how much we need to stretch the titlebar down to
|
||||
// go all the way to the bottom of the tab strip, if necessary.
|
||||
let tabAndMenuHeight = fullTabsHeight + fullMenuHeight;
|
||||
let tabAndMenuHeight = tabsHeight + fullMenuHeight;
|
||||
|
||||
if (tabAndMenuHeight > titlebarContentHeight) {
|
||||
// We need to increase the titlebar content's outer height (ie including margins)
|
||||
|
@ -7,9 +7,11 @@
|
||||
%define glassActiveBorderColor rgb(37, 44, 51)
|
||||
%define glassInactiveBorderColor rgb(102, 102, 102)
|
||||
|
||||
@media not all and (-moz-windows-classic) {
|
||||
#main-window[sizemode="normal"] > #tab-view-deck > #browser-panel > #navigator-toolbox > #toolbar-menubar {
|
||||
margin-top: 1px;
|
||||
@media (-moz-os-version: windows-win7) {
|
||||
@media not all and (-moz-windows-classic) {
|
||||
#main-window[sizemode="normal"] > #tab-view-deck > #browser-panel > #navigator-toolbox > #toolbar-menubar {
|
||||
margin-top: 1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -81,16 +83,11 @@
|
||||
.titlebar-button {
|
||||
border: none;
|
||||
margin: 0 !important;
|
||||
padding: 10px 17px;
|
||||
padding: 8px 17px;
|
||||
-moz-context-properties: stroke;
|
||||
stroke: var(--titlebar-text-color);
|
||||
}
|
||||
|
||||
:root[sizemode=maximized] .titlebar-button {
|
||||
padding-top: 8px;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
|
||||
.titlebar-button > .toolbarbutton-icon {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
|
Loading…
Reference in New Issue
Block a user