зеркало из https://github.com/mozilla/gecko-dev.git
Bug 626382 - Allow themes to set the iconsize on specific toolbars. r=dao a=b
This commit is contained in:
Родитель
65c76b4927
Коммит
d6b840cbe5
|
@ -1327,6 +1327,8 @@ function BrowserStartup() {
|
|||
|
||||
gPrivateBrowsingUI.init();
|
||||
|
||||
retrieveToolbarIconsizesFromTheme();
|
||||
|
||||
setTimeout(delayedStartup, 0, isLoadingBlank, mustLoadSidebar);
|
||||
}
|
||||
|
||||
|
@ -3616,10 +3618,43 @@ function BrowserToolboxCustomizeDone(aToolboxChanged) {
|
|||
window.content.focus();
|
||||
}
|
||||
|
||||
function BrowserToolboxCustomizeChange() {
|
||||
gHomeButton.updatePersonalToolbarStyle();
|
||||
BookmarksMenuButton.customizeChange();
|
||||
allTabs.readPref();
|
||||
function BrowserToolboxCustomizeChange(aType) {
|
||||
switch (aType) {
|
||||
case "iconsize":
|
||||
case "mode":
|
||||
retrieveToolbarIconsizesFromTheme();
|
||||
break;
|
||||
default:
|
||||
gHomeButton.updatePersonalToolbarStyle();
|
||||
BookmarksMenuButton.customizeChange();
|
||||
allTabs.readPref();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Allows themes to override the "iconsize" attribute on toolbars.
|
||||
*/
|
||||
function retrieveToolbarIconsizesFromTheme() {
|
||||
function retrieveToolbarIconsize(aToolbar) {
|
||||
if (aToolbar.localName != "toolbar")
|
||||
return;
|
||||
|
||||
// The theme indicates that it wants to override the "iconsize" attribute
|
||||
// by specifying a special value for the "counter-reset" property on the
|
||||
// toolbar. A custom property cannot be used because getComputedStyle can
|
||||
// only return the values of standard CSS properties.
|
||||
let counterReset = getComputedStyle(aToolbar).counterReset;
|
||||
if (counterReset == "smallicons 0") {
|
||||
aToolbar.setAttribute("iconsize", "small");
|
||||
document.persist(aToolbar.id, "iconsize");
|
||||
} else if (counterReset == "largeicons 0") {
|
||||
aToolbar.setAttribute("iconsize", "large");
|
||||
document.persist(aToolbar.id, "iconsize");
|
||||
}
|
||||
}
|
||||
|
||||
Array.forEach(gNavToolbox.childNodes, retrieveToolbarIconsize);
|
||||
gNavToolbox.externalToolbars.forEach(retrieveToolbarIconsize);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -467,6 +467,8 @@
|
|||
defaultmode="icons" mode="icons"
|
||||
#ifdef WINCE
|
||||
defaulticonsize="small" iconsize="small"
|
||||
#else
|
||||
iconsize="large"
|
||||
#endif
|
||||
tabsontop="true"
|
||||
persist="tabsontop">
|
||||
|
|
|
@ -449,6 +449,11 @@ toolbar[mode="icons"] .toolbarbutton-1 > menupopup {
|
|||
margin-top: 1px;
|
||||
}
|
||||
|
||||
#navigator-toolbox > toolbar {
|
||||
/* force iconsize="small" on these toolbars */
|
||||
counter-reset: smallicons;
|
||||
}
|
||||
|
||||
/* unified back/forward button */
|
||||
|
||||
#unified-back-forward-button {
|
||||
|
@ -465,7 +470,7 @@ toolbar:not([mode="icons"]) #back-button:-moz-locale-dir(rtl) {
|
|||
-moz-image-region: rect(0, 60px, 20px, 40px);
|
||||
}
|
||||
|
||||
toolbar:not([iconsize="small"])[mode="icons"] #back-button {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #back-button {
|
||||
-moz-margin-end: -5px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
|
@ -485,27 +490,17 @@ toolbar[mode="icons"] #forward-button {
|
|||
-moz-margin-start: 0;
|
||||
}
|
||||
|
||||
toolbar[mode="icons"]:not([iconsize="small"]) #forward-button {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #forward-button {
|
||||
/* 1px to the right */
|
||||
padding-left: 4px;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
toolbar[mode="icons"]:not([iconsize="small"]) #forward-button:-moz-lwtheme {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #forward-button:-moz-lwtheme {
|
||||
mask: url(chrome://browser/content/browser.xul#pinstripe-keyhole-forward-mask);
|
||||
}
|
||||
|
||||
toolbar[iconsize="small"][mode="icons"] #back-button {
|
||||
-moz-margin-end: 0;
|
||||
}
|
||||
|
||||
toolbar[iconsize="small"][mode="icons"] #back-button {
|
||||
width: 26px;
|
||||
border-right-width: 0;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
toolbar[iconsize="small"][mode="icons"] #forward-button {
|
||||
#navigator-toolbox[iconsize="small"][mode="icons"] > #nav-bar #forward-button {
|
||||
width: 27px;
|
||||
padding-left: 2px;
|
||||
}
|
||||
|
@ -515,7 +510,11 @@ toolbar[mode="icons"] #forward-button {
|
|||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
toolbar[iconsize="small"][mode="icons"] #back-button {
|
||||
#navigator-toolbox[iconsize="small"][mode="icons"] > #nav-bar #back-button {
|
||||
-moz-margin-end: 0;
|
||||
width: 26px;
|
||||
padding-right: 2px;
|
||||
border-right-width: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
|
|
@ -108,8 +108,8 @@
|
|||
}
|
||||
%endif
|
||||
|
||||
#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar)[iconsize="small"],
|
||||
#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar)[defaulticonsize="small"]:not([iconsize]) {
|
||||
#navigator-toolbox[iconsize="small"] > #nav-bar,
|
||||
#navigator-toolbox > toolbar:not(#nav-bar):not(#toolbar-menubar):not(#TabsToolbar)[iconsize="small"] {
|
||||
padding-top: 1px;
|
||||
padding-bottom: 1px;
|
||||
}
|
||||
|
@ -572,6 +572,11 @@ menuitem.bookmark-item {
|
|||
opacity: .4;
|
||||
}
|
||||
|
||||
#nav-bar {
|
||||
/* force iconsize="small" on this toolbar */
|
||||
counter-reset: smallicons;
|
||||
}
|
||||
|
||||
#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
|
||||
#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker,
|
||||
#nav-bar .toolbarbutton-1 {
|
||||
|
@ -592,8 +597,8 @@ menuitem.bookmark-item {
|
|||
}
|
||||
|
||||
#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker,
|
||||
#nav-bar[iconsize="small"][mode="icons"] .toolbarbutton-1 > .toolbarbutton-menubutton-button,
|
||||
#nav-bar[iconsize="small"][mode="icons"] .toolbarbutton-1 {
|
||||
#navigator-toolbox[iconsize="small"][mode="icons"] > #nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
|
||||
#navigator-toolbox[iconsize="small"][mode="icons"] > #nav-bar .toolbarbutton-1 {
|
||||
padding-left: 3px;
|
||||
padding-right: 3px;
|
||||
}
|
||||
|
@ -610,7 +615,7 @@ menuitem.bookmark-item {
|
|||
margin: 1px 3px;
|
||||
}
|
||||
|
||||
#nav-bar[iconsize="small"][mode="icons"] .toolbarbutton-1 {
|
||||
#navigator-toolbox[iconsize="small"][mode="icons"] > #nav-bar .toolbarbutton-1 {
|
||||
margin-left: 2px;
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
@ -732,7 +737,7 @@ toolbar[mode="full"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
|
|||
-moz-image-region: rect(0, 36px, 18px, 18px);
|
||||
}
|
||||
|
||||
toolbar:not([iconsize="small"])[mode="icons"] #back-button {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #back-button {
|
||||
-moz-image-region: rect(18px, 20px, 38px, 0);
|
||||
}
|
||||
|
||||
|
@ -743,12 +748,12 @@ toolbar:not([iconsize="small"])[mode="icons"] #back-button {
|
|||
}
|
||||
|
||||
#nav-bar #back-button {
|
||||
-moz-margin-end: 0;
|
||||
-moz-margin-end: 0 !important;
|
||||
}
|
||||
|
||||
#nav-bar #forward-button {
|
||||
border-left: none;
|
||||
-moz-margin-start: 0;
|
||||
border-left-style: none;
|
||||
-moz-margin-start: 0 !important;
|
||||
}
|
||||
|
||||
#nav-bar #back-button:-moz-locale-dir(ltr) {
|
||||
|
@ -762,7 +767,7 @@ toolbar:not([iconsize="small"])[mode="icons"] #back-button {
|
|||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
#nav-bar:not([iconsize="small"])[mode="icons"] #back-button {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #back-button {
|
||||
border-radius: 10000px;
|
||||
padding: 0;
|
||||
width: 30px;
|
||||
|
@ -782,7 +787,7 @@ toolbar:not([iconsize="small"])[mode="icons"] #back-button {
|
|||
1px 2px 1px rgba(0,0,0,.2);
|
||||
}
|
||||
|
||||
#nav-bar:not([iconsize="small"])[mode="icons"] #back-button:not([disabled="true"]):not([open="true"]):not(:active):hover {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #back-button:not([disabled="true"]):not([open="true"]):not(:active):hover {
|
||||
box-shadow: 0 0 0 1px rgba(255,255,255,.3) inset,
|
||||
0 0 0 2px rgba(255,255,255,.1) inset,
|
||||
0 0 0 1px hsla(190,50%,40%,.3),
|
||||
|
@ -792,34 +797,34 @@ toolbar:not([iconsize="small"])[mode="icons"] #back-button {
|
|||
0 0 5px 1px hsl(190,90%,80%);
|
||||
}
|
||||
|
||||
#nav-bar:not([iconsize="small"])[mode="icons"] #back-button:not([disabled="true"]):hover:active,
|
||||
#nav-bar:not([iconsize="small"])[mode="icons"] #back-button[open="true"] {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #back-button:not([disabled="true"]):hover:active,
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #back-button[open="true"] {
|
||||
box-shadow: 0 0 6.5px rgba(0,0,0,.4) inset,
|
||||
0 0 2px rgba(0,0,0,.4) inset,
|
||||
0 0 0 1px rgba(0,0,0,.65),
|
||||
0 2px 0 rgba(255,255,255,.4);
|
||||
}
|
||||
|
||||
#nav-bar:not([iconsize="small"])[mode="icons"][currentset*="unified-back-forward-button"],
|
||||
#nav-bar:not([iconsize="small"])[mode="icons"]:not([currentset]) {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar[currentset*="unified-back-forward-button"],
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar:not([currentset]) {
|
||||
padding-top: 3px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
#navigator-toolbox[tabsontop="true"] > #nav-bar:not([iconsize="small"])[mode="icons"][currentset*="unified-back-forward-button"],
|
||||
#navigator-toolbox[tabsontop="true"] > #nav-bar:not([iconsize="small"])[mode="icons"]:not([currentset]) {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar[currentset*="unified-back-forward-button"],
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar:not([currentset]) {
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
#nav-bar:not([iconsize="small"])[mode="icons"] #forward-button {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #forward-button {
|
||||
/*mask: url(keyhole-forward-mask.svg#mask); XXX: this regresses twinopen */
|
||||
mask: url(chrome://browser/content/browser.xul#winstripe-keyhole-forward-mask);
|
||||
-moz-margin-start: -6px;
|
||||
-moz-margin-start: -6px !important;
|
||||
padding-left: 7px;
|
||||
padding-right: 3px;
|
||||
}
|
||||
|
||||
#nav-bar:not([iconsize="small"])[mode="icons"] #forward-button:not([disabled="true"]):not(:active):hover {
|
||||
#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar #forward-button:not([disabled="true"]):not(:active):hover {
|
||||
/*mask: url(keyhole-forward-mask.svg#mask-hover);*/
|
||||
mask: url(chrome://browser/content/browser.xul#winstripe-keyhole-forward-mask-hover);
|
||||
/* Don't animate the box shadow, as the blur and spread radii affect the mask. */
|
||||
|
|
|
@ -167,11 +167,11 @@ function notifyParentComplete()
|
|||
dispatchCustomizationEvent("aftercustomization");
|
||||
}
|
||||
|
||||
function toolboxChanged(aEvent)
|
||||
function toolboxChanged(aType)
|
||||
{
|
||||
gToolboxChanged = true;
|
||||
if ("customizeChange" in gToolbox)
|
||||
gToolbox.customizeChange(aEvent);
|
||||
gToolbox.customizeChange(aType);
|
||||
dispatchCustomizationEvent("customizationchange");
|
||||
}
|
||||
|
||||
|
@ -696,6 +696,8 @@ function updateToolboxProperty(aProp, aValue, aToolkitDefault) {
|
|||
gToolboxDocument.persist(toolbar.id, aProp);
|
||||
});
|
||||
|
||||
toolboxChanged(aProp);
|
||||
|
||||
return aValue || toolboxDefault;
|
||||
}
|
||||
|
||||
|
|
Загрузка…
Ссылка в новой задаче