overlay.css (11087B)
1 :root { 2 --theme-border-color: #cecece; 3 } 4 5 /* Hide horrible blue effect for menu bar and toolbar */ 6 #navigator-toolbox { 7 -moz-appearance: none; 8 } 9 10 #zotero-pane #zotero-toolbar { 11 -moz-appearance: none !important; 12 margin-top: -3px; 13 border-bottom-color: var(--theme-border-color); 14 } 15 16 /* 17 As of Fx36, the built-in styles don't properly handle a menu-button within combined buttons. 18 19 On Windows and Linux, the padding and hover effect (border and shading) are applied directly to 20 the .toolbarbutton-icon (image) instead of the toolbarbutton, so proper sizing of the SVG depends 21 on the total width including border and padding. 22 */ 23 24 /* 25 * Nav bar 26 */ 27 toolbar[id="nav-bar"] #zotero-toolbar-main-button .toolbarbutton-icon { 28 width: 30px; /* 16 + 1 + 1 + 6 + 6 */ 29 padding-left: 6px !important; 30 padding-right: 6px !important; 31 } 32 33 toolbar[id="nav-bar"] #zotero-toolbar-save-button .toolbarbutton-icon { 34 width: 29px; /* 16 + 6 + 6 + 1 */ 35 padding-left: 6px !important; 36 padding-right: 6px !important; 37 } 38 39 toolbar[id="nav-bar"] #zotero-toolbar-main-button-single .toolbarbutton-icon { 40 width: 32px; 41 } 42 43 toolbar[id="nav-bar"] #zotero-toolbar-save-button-single .toolbarbutton-icon { 44 width: 31px; /* Compensate for border on only one side */ 45 } 46 47 toolbar[id="nav-bar"] #zotero-toolbar-buttons #zotero-toolbar-save-button > .toolbarbutton-menubutton-dropmarker .dropmarker-icon { 48 padding-left: 4px; 49 padding-right: 4px; 50 } 51 52 toolbar[id="nav-bar"] #zotero-toolbar-buttons > separator { 53 margin-top: 11px; 54 margin-bottom: 11px; 55 -moz-margin-start: -1px !important; 56 -moz-margin-end: -3px !important; 57 } 58 59 toolbar[id="nav-bar"] #zotero-toolbar-buttons > separator, 60 toolbar[id="nav-bar"] #zotero-toolbar-buttons > #zotero-toolbar-save-button > .toolbarbutton-menubutton-dropmarker::before { 61 width: 1px; 62 } 63 64 toolbar[id="nav-bar"] #zotero-toolbar-buttons > #zotero-toolbar-save-button > .toolbarbutton-menubutton-dropmarker::before { 65 -moz-margin-end: -1px; 66 } 67 68 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > separator, 69 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-save-button:not([disabled]) > .toolbarbutton-menubutton-dropmarker::before { 70 background-image: none; 71 } 72 73 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-main-button .toolbarbutton-icon, 74 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-save-button:not([disabled]) .toolbarbutton-icon, 75 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-save-button:not([disabled]) .dropmarker-icon { 76 border-color: var(--toolbarbutton-hover-bordercolor) !important; 77 } 78 79 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-main-button:not(:active) .toolbarbutton-icon, 80 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover:not([disabled]) > #zotero-toolbar-save-button:not(:active) .toolbarbutton-icon, 81 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover:not([disabled]) > #zotero-toolbar-save-button:not(:active) .dropmarker-icon { 82 background: var(--toolbarbutton-hover-background); 83 } 84 85 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-save-button .toolbarbutton-icon, 86 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-save-button .dropmarker-icon { 87 box-shadow: none; 88 } 89 90 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-main-button .toolbarbutton-icon { 91 border-top-right-radius: 0px !important; 92 border-bottom-right-radius: 0px !important; 93 } 94 95 toolbar[id="nav-bar"] #zotero-toolbar-buttons:hover > #zotero-toolbar-save-button .toolbarbutton-icon { 96 border-top-left-radius: 0px !important; 97 border-bottom-left-radius: 0px !important; 98 } 99 100 /* 101 There are two hover effects: when the toolbaritem is hovered over, and when the button is hovered over. 102 This applies the latter (and may not be right on different versions of Windows). 103 */ 104 toolbar[id="nav-bar"] #zotero-toolbar-main-button:hover:not(:active):not([disabled]) > .toolbarbutton-icon, 105 /* 106 The dropmarker doesn't honor :hover, so instead of showing the hover effect for each segment individually, do the 107 menu-button parts together, which at least looks like a choice. 108 */ 109 toolbar[id="nav-bar"] #zotero-toolbar-save-button:hover .toolbarbutton-menubutton-button .toolbarbutton-icon, 110 toolbar[id="nav-bar"] > #zotero-toolbar-save-button:hover:not(:active):not([disabled]) .toolbarbutton-menubutton-dropmarker .dropmarker-icon { 111 background-color: hsla(210,48%,96%,.75) !important; 112 } 113 toolbar[id="nav-bar"] #zotero-toolbar-main-button:hover > .toolbarbutton-icon, 114 toolbar[id="nav-bar"] #zotero-toolbar-save-button:hover:not([disabled]) .toolbarbutton-menubutton-button .toolbarbutton-icon, 115 toolbar[id="nav-bar"] #zotero-toolbar-save-button:hover:not([disabled]) .toolbarbutton-menubutton-dropmarker .dropmarker-icon { 116 border-color: hsla(210,54%,20%,.3) hsla(210,54%,20%,.35) hsla(210,54%,20%,.4) !important; 117 box-shadow: 0 0 1px hsla(210,54%,20%,.03), 118 0 0 2px hsla(210,54%,20%,.1) !important; 119 } 120 121 toolbar[id="nav-bar"] #zotero-toolbar-save-button:hover:active:not([open]):not([disabled]) .toolbarbutton-menubutton-button .toolbarbutton-icon, 122 toolbar[id="nav-bar"] #zotero-toolbar-save-button:hover[open]:not([disabled]) .toolbarbutton-menubutton-dropmarker .dropmarker-icon { 123 background: var(--toolbarbutton-active-background) !important; 124 border-color: var(--toolbarbutton-active-bordercolor) !important; 125 box-shadow: var(--toolbarbutton-active-boxshadow) !important; 126 transition-duration: 10ms; 127 } 128 129 #zotero-toolbar-save-button[cui-areatype="toolbar"] > menupopup, 130 #zotero-toolbar-save-button-single[cui-areatype="toolbar"] > menupopup { 131 margin-top: -7px; 132 } 133 134 135 /* 136 * Alterations for non-nav-bar toolbars 137 */ 138 toolbar:not([id="nav-bar"]) #zotero-toolbar-main-button > .toolbarbutton-icon, 139 toolbar:not([id="nav-bar"]) #zotero-toolbar-main-button-single > .toolbarbutton-icon, 140 toolbar:not([id="nav-bar"]) #zotero-toolbar-save-button > .toolbarbutton-menubutton-button > .toolbarbutton-icon, 141 toolbar:not([id="nav-bar"]) #zotero-toolbar-save-button-single > .toolbarbutton-menubutton-button > .toolbarbutton-icon { 142 height: 16px; 143 width: 16px; 144 padding: 0; 145 } 146 147 toolbar:not([id="nav-bar"]) #zotero-toolbar-main-button-single, 148 toolbar:not([id="nav-bar"]) #zotero-toolbar-save-button-single > .toolbarbutton-menubutton-button, 149 toolbar:not([id="nav-bar"]) #zotero-toolbar-save-button > .toolbarbutton-menubutton-button { 150 width: 24px; 151 } 152 153 toolbar:not([id="nav-bar"]) #zotero-toolbar-save-button > .toolbarbutton-menubutton-dropmarker, 154 toolbar:not([id="nav-bar"]) #zotero-toolbar-save-button-single > .toolbarbutton-menubutton-dropmarker { 155 padding-left: 2px; 156 padding-right: 3px; 157 } 158 159 toolbar:not([id="nav-bar"]) #zotero-toolbar-buttons separator { 160 display: none; 161 } 162 163 164 /* 165 * Alterations for overflow panel 166 */ 167 #zotero-toolbar-main-button-single[overflowedItem=true] .toolbarbutton-icon, 168 #zotero-toolbar-buttons[overflowedItem=true] #zotero-toolbar-main-button .toolbarbutton-icon, 169 #zotero-toolbar-save-button-single[overflowedItem=true] .toolbarbutton-icon, 170 #zotero-toolbar-buttons[overflowedItem=true] #zotero-toolbar-save-button .toolbarbutton-icon { 171 height: 16px; 172 } 173 174 #zotero-toolbar-buttons[overflowedItem=true] { 175 margin: 6px 0 0 0 !important; 176 } 177 178 #zotero-toolbar-buttons[overflowedItem=true] #zotero-toolbar-main-button { 179 max-width: 18px; 180 } 181 182 #zotero-toolbar-buttons[overflowedItem=true] #zotero-toolbar-save-button toolbarbutton { 183 margin-left: 0 !important; 184 } 185 186 #zotero-toolbar-buttons[overflowedItem=true] #zotero-toolbar-save-button .toolbarbutton-icon { 187 margin-left: 8px; 188 padding-right: 0 !important; 189 } 190 191 /* End toolbar buttons */ 192 193 194 @media (min-resolution: 1.25dppx) { 195 #zotero-toolbar .toolbarbutton-icon { 196 width: 16px; 197 } 198 199 #zotero-tb-sync > .toolbarbutton-icon { 200 width: 20px; 201 } 202 } 203 204 #zotero-tb-search-menu-button { 205 margin: 0 -1px 0 -4px; 206 padding: 5px 0 5px 5px; 207 border: 0; 208 background: transparent; 209 } 210 211 #zotero-tb-search-menu-button .button-menu-dropmarker { 212 display: none; 213 } 214 215 #zotero-tb-search .textbox-search-icon { 216 visibility: hidden; 217 } 218 219 #zotero-tb-sync-error { 220 margin-right: 4px; 221 padding-top: 4px; 222 } 223 224 #zotero-tb-sync { 225 margin-right: 1px; 226 padding-top: 4px; 227 } 228 229 #zotero-view-tabbox tab { 230 padding-left: .7em; 231 padding-right: .7em; 232 } 233 234 #zotero-toolbar { 235 -moz-appearance: toolbox !important; 236 padding-left: 2px; 237 } 238 239 #zotero-collections-splitter:not([state=collapsed]), 240 #zotero-items-splitter:not([state=collapsed]), 241 #zotero-tags-splitter:not([state=collapsed]) { 242 border: 0; 243 background-color: transparent; 244 position: relative; 245 /* Positive z-index positions the splitter on top of its siblings and makes 246 it clickable on both sides. */ 247 z-index: 1; 248 } 249 250 #zotero-collections-splitter:not([state=collapsed]), 251 #zotero-items-splitter:not([state=collapsed]):not([orient=vertical]), 252 #zotero-tags-splitter:not([state=collapsed]) { 253 border-inline-end: 1px solid var(--theme-border-color); 254 min-width: 0; 255 width: 3px; 256 margin-inline-start: -3px; 257 } 258 259 #zotero-tags-splitter:not([state=collapsed]), 260 #zotero-items-splitter:not([state=collapsed])[orient=vertical] { 261 border-block-end: 1px solid var(--theme-border-color); 262 min-height: 0; 263 height: 3px; 264 margin-block-start: -3px; 265 } 266 267 #zotero-collections-splitter > grippy, 268 #zotero-items-splitter > grippy, 269 #zotero-tags-splitter > grippy { 270 border: 0; 271 } 272 273 #zotero-collections-splitter:not([state=collapsed]) > grippy, 274 #zotero-items-splitter:not([state=collapsed]) > grippy, 275 #zotero-tags-splitter:not([state=collapsed]) > grippy { 276 display: none; 277 } 278 279 #zotero-collections-tree, #zotero-items-tree, #zotero-view-item { 280 -moz-appearance: none; 281 border-style: solid; 282 border-color: #818790; 283 margin: 0; 284 padding: 0; 285 -moz-border-top-colors: none; 286 -moz-border-bottom-colors: none; 287 -moz-border-right-colors: none; 288 -moz-border-left-colors: none; 289 } 290 291 treechildren::-moz-tree-twisty { 292 padding: 0 4px; 293 } 294 295 /* Undo tree row spacing change in Fx25 on Windows */ 296 #zotero-collections-tree treechildren::-moz-tree-row, 297 #zotero-items-tree treechildren::-moz-tree-row, 298 #zotero-prefs treechildren::-moz-tree-row { 299 height: 1.6em; 300 } 301 302 tree { 303 border-width: 0; 304 } 305 306 /* Restore row highlighting on drag over, though I'm not sure how we're losing it to begin with. */ 307 #zotero-collections-tree treechildren::-moz-tree-row(dropOn) { 308 background-color: Highlight; 309 } 310 311 #zotero-tag-selector groupbox { 312 -moz-appearance: none; 313 padding: 0; 314 border: 0; 315 } 316 317 #tags-box { 318 padding-top: 0.1em; 319 padding-left: 0.05em; 320 } 321 322 #tags-box button { 323 margin: .04em 0 0 .15em !important; 324 } 325 326 #zotero-editpane-tabs spacer { 327 border: 0; 328 } 329 330 #zotero-view-item { 331 padding: 0 !important; 332 -moz-appearance: none; 333 background-color: -moz-field; 334 border-width: 1px 0 0 0; 335 border-color: var(--theme-border-color); 336 } 337 338 #zotero-view-tabbox > tabs { 339 margin-top: 2px; 340 } 341 342 #zotero-item-pane-groupbox { 343 -moz-appearance: none !important; 344 border-width: 0; 345 } 346 347 #zotero-editpane-item-box > scrollbox, #zotero-view-item > tabpanel > vbox, 348 #zotero-editpane-tags > scrollbox, #zotero-editpane-related { 349 padding-top: 5px; 350 } 351 352 #zotero-editpane-tags > scrollbox { 353 padding-left: 5px; 354 } 355 356 #zotero-view-item > tabpanel > vbox { 357 padding-left: 5px; 358 }