Bug 960517: Windows 8 style menu-panel buttons. r=dao

This commit is contained in:
Mike de Boer (mdeboer@mozilla.com) 2014-02-20 13:48:12 +01:00
parent 535ff51f0b
commit 8382f33270
4 changed files with 53 additions and 7 deletions

View File

@ -722,10 +722,8 @@ toolbarpaletteitem[place="palette"] > #search-container {
padding: .5em;
margin: 0;
-moz-box-flex: 1;
/* reduce the width with 2px for each button to compensate for two separators
of 3px. */
min-width: calc(@menuPanelButtonWidth@ - 2px);
max-width: calc(@menuPanelButtonWidth@ - 2px);
min-width: calc(@menuPanelButtonWidth@);
max-width: calc(@menuPanelButtonWidth@);
/* We'd prefer to use height: auto here but it leads to layout bugs in the panel. Cope:
1.2em for line height + 2 * .5em padding + margin on the label (2 * 2px) */
height: calc(2.2em + 4px);
@ -733,6 +731,14 @@ toolbarpaletteitem[place="palette"] > #search-container {
-moz-box-orient: horizontal;
}
#edit-controls@inAnyPanel@ > #copy-button,
#zoom-controls@inAnyPanel@ > #zoom-reset-button {
/* reduce the width with 2px for this button to compensate for two separators
of 1px. */
min-width: calc(@menuPanelButtonWidth@ - 2px);
max-width: calc(@menuPanelButtonWidth@ - 2px);
}
#edit-controls@inAnyPanel@ > toolbarbutton[disabled] > .toolbarbutton-icon,
#zoom-controls@inAnyPanel@ > toolbarbutton[disabled] > .toolbarbutton-icon {
opacity: .25;
@ -762,8 +768,7 @@ toolbarpaletteitem[place="palette"] > #search-container {
border-bottom-left-radius: 0;
}
#edit-controls > separator,
#zoom-controls > separator {
.toolbaritem-combined-buttons > separator {
-moz-appearance: none;
width: 3px;
-moz-box-align: stretch;
@ -775,6 +780,19 @@ toolbarpaletteitem[place="palette"] > #search-container {
background-repeat: no-repeat;
}
.toolbaritem-combined-buttons@inAnyPanel@ > separator {
margin: .5em 0;
width: 1px;
background: hsla(210,4%,10%,.15);
transition-property: margin;
transition-duration: 10ms;
transition-timing-function: ease;
}
.toolbaritem-combined-buttons@inAnyPanel@:hover > separator {
margin: 0;
}
#widget-overflow > .panel-arrowcontainer > .panel-arrowcontent {
padding: 0;
}

View File

@ -0,0 +1,7 @@
/* 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/. */
%define WINDOWS_AERO
%include panelUIOverlay.css
%undef WINDOWS_AERO

View File

@ -34,3 +34,24 @@
.widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
padding: 0 6px;
}
%ifdef WINDOWS_AERO
/* Win8 and beyond. */
@media not all and (-moz-os-version: windows-vista) {
@media not all and (-moz-os-version: windows-win7) {
panelview .toolbarbutton-1,
.subviewbutton,
.widget-overflow-list .toolbarbutton-1,
.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button,
#edit-controls@inAnyPanel@ > toolbarbutton,
#zoom-controls@inAnyPanel@ > toolbarbutton {
border-radius: 0;
}
#edit-controls@inAnyPanel@,
#zoom-controls@inAnyPanel@ {
border-radius: 0;
}
}
}
%endif

View File

@ -411,7 +411,7 @@ browser.jar:
skin/classic/aero/browser/customizableui/customizeMode-separatorHorizontal.png (customizableui/customizeMode-separatorHorizontal.png)
skin/classic/aero/browser/customizableui/customizeMode-separatorVertical.png (customizableui/customizeMode-separatorVertical.png)
skin/classic/aero/browser/customizableui/menuPanel-customizeFinish.png (../shared/customizableui/menuPanel-customizeFinish.png)
* skin/classic/aero/browser/customizableui/panelUIOverlay.css (customizableui/panelUIOverlay.css)
* skin/classic/aero/browser/customizableui/panelUIOverlay.css (customizableui/panelUIOverlay-aero.css)
skin/classic/aero/browser/customizableui/subView-arrow-back-inverted.png (../shared/customizableui/subView-arrow-back-inverted.png)
* skin/classic/aero/browser/downloads/allDownloadsViewOverlay.css (downloads/allDownloadsViewOverlay-aero.css)
skin/classic/aero/browser/downloads/buttons.png (downloads/buttons-aero.png)