
I guess the idea that switching to PNGs obviated the need for this was wishful thinking (though it doesn't seem to be necessary for the single buttons anymore on Linux, and it's no longer necessary on OS X, which has generally saner styling in Firefox).
179 lines
6.2 KiB
CSS
179 lines
6.2 KiB
CSS
/*
|
|
As of Fx36, the built-in styles don't properly handle a menu-button within combined buttons.
|
|
|
|
On Windows and Linux, the padding and hover effect (border and shading) are applied directly to
|
|
the .toolbarbutton-icon (image) instead of the toolbarbutton, so proper sizing of the SVG depends
|
|
on the total width including border and padding.
|
|
*/
|
|
|
|
/*
|
|
* Nav bar
|
|
*/
|
|
toolbar[id="nav-bar"] #zotero-toolbar-main-button .toolbarbutton-icon {
|
|
width: 28px;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-save-button .toolbarbutton-icon {
|
|
width: 30px;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons #zotero-toolbar-main-button {
|
|
margin-right: -1px;
|
|
padding: 0; /* avoid shift on :active */
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-main-button .toolbarbutton-icon {
|
|
margin-left: 2px;
|
|
padding-left: 5px !important;
|
|
padding-right: 5px !important;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-save-button > .toolbarbutton-menubutton-button {
|
|
padding-left: 0;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-save-button > .toolbarbutton-menubutton-button .toolbarbutton-icon {
|
|
padding-left: 6px !important;
|
|
padding-right: 6px !important;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-save-button > .toolbarbutton-menubutton-dropmarker {
|
|
width: 18px !important;
|
|
margin-top: 6px;
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons #zotero-toolbar-save-button > .toolbarbutton-menubutton-dropmarker .dropmarker-icon {
|
|
padding-left: 14px !important;
|
|
padding-right: 3px !important;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-save-button-single > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
|
|
margin-top: 3px;
|
|
margin-bottom: 3px;
|
|
padding-left: 8px !important;
|
|
padding-right: 8px !important;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-save-button:hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
|
|
toolbar[id="nav-bar"] #zotero-toolbar-save-button[open] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-save-button-single > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
|
|
margin-top: 3px;
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons > separator {
|
|
/* Copied from .toolbarbutton-menubutton-dropmarker::before */
|
|
display: -moz-box;
|
|
width: 1px;
|
|
height: 18px;
|
|
-moz-margin-end: -1px;
|
|
background-clip: padding-box;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
background-size: 1px 18px;
|
|
box-shadow: var(--toolbarbutton-combined-boxshadow);
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-main-button .toolbarbutton-icon,
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-save-button .toolbarbutton-icon,
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-save-button .dropmarker-icon {
|
|
border-color: var(--toolbarbutton-hover-bordercolor) !important;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons > #zotero-toolbar-save-button:hover:not(:active) > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons > #zotero-toolbar-save-button:hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
|
|
background: inherit;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons > #zotero-toolbar-save-button > .toolbarbutton-menubutton-button:hover:not(:active) > .toolbarbutton-icon,
|
|
/* This selector doesn't work, so the dropmarker doesn't get a hover effect. :hover doesn't seem
|
|
to have an effect on either part of the dropmarker */
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons > #zotero-toolbar-save-button > .toolbarbutton-menubutton-dropmarker:hover > .dropmarker-icon {
|
|
background: var(--toolbarbutton-hover-background) !important;
|
|
}
|
|
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons > #zotero-toolbar-save-button:hover:active:not([open]):not([disabled]) .toolbarbutton-menubutton-button .toolbarbutton-icon,
|
|
toolbar[id="nav-bar"] #zotero-toolbar-buttons > #zotero-toolbar-save-button:hover[open]:not([disabled]) .toolbarbutton-menubutton-dropmarker .dropmarker-icon {
|
|
background: var(--toolbarbutton-active-background);
|
|
border-color: var(--toolbarbutton-active-bordercolor);
|
|
box-shadow: var(--toolbarbutton-active-boxshadow);
|
|
transition-duration: 10ms;
|
|
}
|
|
|
|
|
|
/*
|
|
* Alterations for non-nav-bar toolbars
|
|
*/
|
|
toolbar:not([id="nav-bar"]) #zotero-toolbar-main-button > .toolbarbutton-icon,
|
|
toolbar:not([id="nav-bar"]) #zotero-toolbar-main-button-single > .toolbarbutton-icon,
|
|
toolbar:not([id="nav-bar"]) #zotero-toolbar-save-button > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
|
|
toolbar:not([id="nav-bar"]) #zotero-toolbar-save-button-single > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
|
|
height: 16px;
|
|
width: 16px;
|
|
padding: 0;
|
|
}
|
|
|
|
toolbar:not([id="nav-bar"]) #zotero-toolbar-save-button > .toolbarbutton-menubutton-dropmarker,
|
|
toolbar:not([id="nav-bar"]) #zotero-toolbar-save-button-single > .toolbarbutton-menubutton-dropmarker {
|
|
margin-left: -1px;
|
|
}
|
|
|
|
toolbar:not([id="nav-bar"]) #zotero-toolbar-buttons separator {
|
|
display: none;
|
|
}
|
|
|
|
|
|
/* Alterations for overflow panel */
|
|
#zotero-toolbar-main-button-single[overflowedItem=true] .toolbarbutton-icon,
|
|
#zotero-toolbar-buttons[overflowedItem=true] #zotero-toolbar-main-button .toolbarbutton-icon,
|
|
#zotero-toolbar-save-button-single[overflowedItem=true] .toolbarbutton-icon,
|
|
#zotero-toolbar-buttons[overflowedItem=true] #zotero-toolbar-save-button .toolbarbutton-icon {
|
|
width: 16px;
|
|
}
|
|
|
|
#zotero-toolbar-buttons[overflowedItem=true] {
|
|
margin-left: 0 !important;
|
|
margin-bottom: 0 !important;
|
|
margin-right: 0 !important;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
#zotero-toolbar-buttons[overflowedItem=true] #zotero-toolbar-main-button {
|
|
max-width: 28px !important;
|
|
margin: 0 4px 0 0 !important;
|
|
}
|
|
|
|
#zotero-toolbar-buttons[overflowedItem=true] #zotero-toolbar-save-button .toolbarbutton-menubutton-button {
|
|
margin-left: 8px;
|
|
}
|
|
/* End toolbar buttons */
|
|
|
|
|
|
@media (min-resolution: 1.5dppx) {
|
|
#zotero-tb-sync > .toolbarbutton-icon {
|
|
width: 20px;
|
|
}
|
|
}
|
|
|
|
.zotero-tb-button:not([type=menu]) {
|
|
margin-right: 4px;
|
|
}
|
|
|
|
#zotero-tb-search-menu-button {
|
|
-moz-appearance: toolbarbutton-dropdown !important;
|
|
width: 12px;
|
|
height: 12px;
|
|
}
|
|
|
|
#zotero-tb-search-menu-button .button-menu-dropmarker {
|
|
display: none;
|
|
}
|
|
|
|
#zotero-tb-search .textbox-search-icon {
|
|
visibility: hidden;
|
|
} |