mirrors/zotero
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix toolbar buttons on Windows

Browse source 
Known issues:

- Hover doesn't work on the dropmarker alone, so instead of showing the
  hover effect for each segment individually, the menu-button parts are
  highlighted together, which at least looks like a choice
- When the menu-button is disabled, it still has some hover/active
  effects.
- Tested only on Windows 7
This commit is contained in:
Dan Stillman 2015-02-22 06:40:25 -05:00
parent a85a9a632e
commit 1abee72233
1 changed files with 76 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

76
chrome/content/zotero-platform/win/overlay.css
View file

@ -1,3 +1,79 @@
/*
As of Fx36, the built-in styles don't properly handle a menu-button within combined buttons.
*/
#zotero-toolbar-main-button[cui-areatype="toolbar"] {
margin-right:-1px !important;
}
#zotero-toolbar-buttons[cui-areatype="toolbar"] > separator,
#zotero-toolbar-buttons[cui-areatype="toolbar"] > #zotero-toolbar-save-button > .toolbarbutton-menubutton-dropmarker::before {
width: 1px;
-moz-margin-end: -1px;
background-image: var(--toolbarbutton-combined-backgroundimage);
}
#zotero-toolbar-buttons[cui-areatype="toolbar"] > separator {
margin-top: 11px;
margin-bottom: 11px;
}
#zotero-toolbar-buttons[cui-areatype="toolbar"]:hover > separator,
#zotero-toolbar-buttons[cui-areatype="toolbar"]:hover > #zotero-toolbar-save-button:not([disabled]) > .toolbarbutton-menubutton-dropmarker::before {
display: none;
}
#zotero-toolbar-buttons[cui-areatype="toolbar"]:hover > #zotero-toolbar-main-button .toolbarbutton-icon,
#zotero-toolbar-buttons[cui-areatype="toolbar"]:hover > #zotero-toolbar-save-button:not([disabled]) .toolbarbutton-icon,
#zotero-toolbar-buttons[cui-areatype="toolbar"]:hover > #zotero-toolbar-save-button:not([disabled]) .dropmarker-icon {
border-color: var(--toolbarbutton-hover-bordercolor) !important;
}
#zotero-toolbar-buttons[cui-areatype="toolbar"]:hover > #zotero-toolbar-main-button:not(:active) .toolbarbutton-icon,
#zotero-toolbar-buttons[cui-areatype="toolbar"]:hover:not([disabled]) > #zotero-toolbar-save-button:not(:active) .toolbarbutton-icon,
#zotero-toolbar-buttons[cui-areatype="toolbar"]:hover:not([disabled]) > #zotero-toolbar-save-button:not(:active) .dropmarker-icon {
background: var(--toolbarbutton-hover-background);
}
#zotero-toolbar-buttons[cui-areatype="toolbar"]:hover > #zotero-toolbar-save-button .toolbarbutton-icon,
#zotero-toolbar-buttons[cui-areatype="toolbar"]:hover > #zotero-toolbar-save-button .dropmarker-icon {
box-shadow: none;
}
/*
There are two hover effects: when the toolbaritem is hovered over, and when the button is hovered over.
This applies the latter (and may not be right on different versions of Windows).
*/
#zotero-toolbar-buttons[cui-areatype="toolbar"] > #zotero-toolbar-main-button:hover:not(:active):not([disabled]) > .toolbarbutton-icon,
/*
The dropmarker doesn't honor :hover, so instead of showing the hover effect for each segment individually, do the
menu-button parts together, which at least looks like a choice.
*/
#zotero-toolbar-buttons[cui-areatype="toolbar"] > #zotero-toolbar-save-button:hover:not(:active) .toolbarbutton-menubutton-button .toolbarbutton-icon,
#zotero-toolbar-buttons[cui-areatype="toolbar"] > #zotero-toolbar-save-button:hover:not(:active):not([disabled]) .toolbarbutton-menubutton-dropmarker .dropmarker-icon {
background-color: hsla(210,48%,96%,.75) !important;
}
#zotero-toolbar-buttons[cui-areatype="toolbar"] > #zotero-toolbar-main-button:hover > .toolbarbutton-icon,
#zotero-toolbar-buttons[cui-areatype="toolbar"] > #zotero-toolbar-save-button:hover:not([disabled]) .toolbarbutton-menubutton-button .toolbarbutton-icon,
#zotero-toolbar-buttons[cui-areatype="toolbar"] > #zotero-toolbar-save-button:hover:not([disabled]) .toolbarbutton-menubutton-dropmarker .dropmarker-icon {
border-color: hsla(210,54%,20%,.3) hsla(210,54%,20%,.35) hsla(210,54%,20%,.4) !important;
box-shadow: 0 0 1px hsla(210,54%,20%,.03),
0 0 2px hsla(210,54%,20%,.1) !important;
}
#zotero-toolbar-buttons[cui-areatype="toolbar"] > #zotero-toolbar-save-button:hover:active:not([open]):not([disabled]) .toolbarbutton-menubutton-button .toolbarbutton-icon,
#zotero-toolbar-buttons[cui-areatype="toolbar"] > #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;
}
#zotero-toolbar-save-button[cui-areatype="toolbar"] > menupopup {
margin-top: -5px;
}
/* End toolbar buttons */
#zotero-tb-search-menu-button {
margin: 0 -1px 0 -4px;
border: 0;