1 /* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
5 /* === BEGIN panelUIOverlay.inc.css === */
8 background-color: #000000;
9 -moz-margin-start: 38px;
12 .panel-subviews:-moz-locale-dir(rtl) {
15 .panel-viewstack[viewtype="main"] > .panel-subviews {
16 transform: translateX(21em);
19 .panel-viewstack[viewtype="main"] > .panel-subviews:-moz-locale-dir(rtl) {
20 transform: translateX(-21em);
23 .panel-viewstack:not([viewtype="main"]) > .panel-mainview > #PanelUI-mainView {
29 flex-direction: column;
32 #app-extension-point-end > #PanelUI-menu-button {
35 #app-extension-point-end > #PanelUI-menu-button .toolbarbutton-text {
38 #app-extension-point-end > #PanelUI-menu-button .toolbarbutton-icon {
42 #PanelUI-popup > arrowscrollbox > autorepeatbutton {
45 #PanelUI-popup > arrowscrollbox > scrollbox {
49 #PanelUI-popup > .panel-arrowcontainer > .panel-arrowcontent {
58 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text,
59 #bookmarks-menu-button > toolbarbutton > .toolbarbutton-text,
60 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarpaletteitem > toolbaritem > toolbarbutton > .toolbarbutton-text,
61 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbaritem > toolbarbutton > .toolbarbutton-text,
62 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarpaletteitem > toolbarbutton > .toolbarbutton-text,
63 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarbutton > .toolbarbutton-text {
67 #wrapper-edit-controls:-moz-any([place="palette"],[place="panel"]) > #edit-controls,
68 #wrapper-zoom-controls:-moz-any([place="palette"],[place="panel"]) > #zoom-controls {
73 .panel-mainview:not([panelid="PanelUI-popup"]) {
77 panelview:not([mainview]) .toolbarbutton-text,
78 #customizationui-widget-panel toolbarbutton > .toolbarbutton-text {
80 -moz-padding-start: 8px;
92 #PanelUI-contents-scroller {
101 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton > .toolbarbutton-icon,
102 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton > .toolbarbutton-icon {
108 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item),
109 #PanelUI-contents toolbarbutton,
110 toolbarpaletteitem[place="panel"] > toolbarbutton,
111 toolbarpaletteitem[place="palette"] > toolbarbutton,
112 toolbarpaletteitem[place="panel"] > toolbaritem > toolbarbutton,
113 toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton,
114 .panel-customization-placeholder {
115 -moz-appearance: none;
116 -moz-box-orient: vertical;
125 .panel-customization-placeholder[expand],
126 .panel-customization-placeholder[contract] {
127 transition-property: width;
128 transition-duration: 170ms;
129 transition-delay: 20ms;
130 transition-timing-function: ease-in-out;
135 .panel-combined-button[disabled] > .toolbarbutton-icon {
139 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] {
141 margin: 0 !important;
144 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-widget) {
145 -moz-box-align: center;
146 -moz-box-pack: center;
149 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] > iframe {
150 margin: calc(5em / 12) auto;
153 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text {
157 .panel-customization-placeholder-child > .toolbarbutton-icon,
158 #bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
159 toolbarbutton[cui-areatype="menu-panel"] > .toolbarbutton-icon,
160 toolbaritem[cui-areatype="menu-panel"] > toolbarbutton > .toolbarbutton-icon,
161 toolbarpaletteitem[place="palette"] > #bookmarks-menu-button > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
162 toolbarpaletteitem[place="palette"] > toolbarbutton > .toolbarbutton-icon,
163 toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton > .toolbarbutton-icon {
164 min-width: calc(8em / 3);
165 min-height: calc(8em / 3);
166 margin: calc(5em / 12);
169 toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
173 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button,
174 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-reset-button {
180 #zoom-in-button > .toolbarbutton-text,
181 #zoom-out-button > .toolbarbutton-text,
182 #zoom-reset-button > .toolbarbutton-icon {
188 background-color: #000000;
189 border-top: 1px solid #9C9CFF;
200 -moz-appearance: none;
202 background-image: none;
203 border: 1px solid transparent;
204 border-bottom-style: none;
206 transition: background-color;
207 -moz-box-orient: vertical;
210 :-moz-any(#PanelUI-help, #PanelUI-customize, #PanelUI-quit) > .toolbarbutton-icon {
215 list-style-image: url("chrome://browser/skin/menuPanel-customize.png");
219 -moz-border-start-style: none;
220 list-style-image: url("chrome://browser/skin/menuPanel-help.png");
224 -moz-border-end-style: none;
225 list-style-image: url("chrome://browser/skin/menuPanel-exit.png");
231 -moz-image-region: rect(0, 16px, 16px, 0);
234 #PanelUI-customize:hover,
235 #PanelUI-help:not([disabled]):hover,
236 #PanelUI-quit:not([disabled]):hover,
237 #PanelUI-customize:hover:active,
238 #PanelUI-help:not([disabled]):hover:active,
239 #PanelUI-quit:not([disabled]):hover:active {
240 -moz-image-region: rect(0, 32px, 16px, 16px);
243 #PanelUI-help[disabled],
244 #PanelUI-quit[disabled] {
245 -moz-image-region: rect(0, 48px, 16px, 32px);
248 #PanelUI-help:not([disabled]):hover,
249 #PanelUI-customize:hover,
250 #PanelUI-quit:not([disabled]):hover {
251 /* border-color: rgba(8,25,42,0.2);
252 border-top-color: rgba(8,25,42,0.1);
253 background-color: rgba(0,0,0,0.1);
257 #main-window[customize-entered] #PanelUI-customize {
259 background-color: #008484;
262 #main-window[customize-entered] #PanelUI-customize:hover,
263 #main-window[customize-entered] #PanelUI-customize:hover:active {
265 background-color: #FFCF00;
268 #customization-palette .toolbarbutton-text {
272 panelview toolbarbutton,
273 #widget-overflow-list > toolbarbutton,
274 .customizationmode-button,
275 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
276 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
277 #BMB_bookmarksPopup > menu,
278 #BMB_bookmarksPopup > menuitem {
279 -moz-appearance: none;
281 /* background-color: hsla(210,4%,10%,0);
284 border-color: hsla(210,4%,10%,0);*/
285 transition-property: background-color, border-color;
286 transition-duration: 150ms;
289 panelview .toolbarbutton-1,
290 #widget-overflow-list > toolbarbutton {
294 panelview toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
295 #widget-overflow-list > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
296 .customizationmode-button,
297 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
298 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
299 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem):not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
300 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem):not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
301 #BMB_bookmarksPopup > menu:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
302 #BMB_bookmarksPopup > menuitem:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover {
303 background-color: hsla(210,4%,10%,.08);
304 border-color: hsla(210,4%,10%,.1);
307 panelview toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
308 .customizationmode-button:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
309 #widget-overflow-list > toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
310 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
311 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
312 #BMB_bookmarksPopup > menu:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
313 #BMB_bookmarksPopup > menuitem:not([disabled]):-moz-any([open],[checked="true"],:hover:active) {
314 background-color: hsla(210,4%,10%,.15);
315 border-color: hsla(210,4%,10%,.15);
316 box-shadow: 0 1px 0 0 hsla(210,4%,10%,.05) inset;
319 #BMB_bookmarksPopup > menu,
320 #BMB_bookmarksPopup > menuitem {
324 #BMB_bookmarksPopup > menu:not([disabled="true"]),
325 #BMB_bookmarksPopup > menuitem:not([disabled="true"]) {
329 #BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-up,
330 #BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-down {
331 -moz-appearance: none;
336 panelview toolbarseparator,
337 #BMB_bookmarksPopup > menuseparator {
338 -moz-appearance: none;
340 border-top: 1px solid ThreeDShadow;
344 #PanelUI-historyItems > toolbarbutton {
345 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
348 #PanelUI-recentlyClosedWindows > toolbarbutton > .toolbarbutton-icon,
349 #PanelUI-recentlyClosedTabs > toolbarbutton > .toolbarbutton-icon,
350 #PanelUI-historyItems > toolbarbutton > .toolbarbutton-icon {
355 #PanelUI-footer.panel-multiview-anchor,
356 #PanelUI-footer.panel-multiview-anchor > #PanelUI-help,
357 toolbarbutton.panel-multiview-anchor {
358 /* background-color: Highlight;
359 background-image: linear-gradient(rgba(255,255,255,0.3), rgba(255,255,255,0));
360 background-repeat: repeat-x;
361 color: HighlightText;*/
364 toolbarpaletteitem[place="palette"] > #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker,
365 #bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-dropmarker {
369 #search-container[cui-areatype="menu-panel"] {
373 toolbarpaletteitem[place="palette"] > #search-container {
378 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem),
379 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) {
380 /* background-color: hsla(210,4%,10%,0);
383 border-color: hsla(210,4%,10%,0);
384 border-bottom-color: hsla(210,4%,10%,.1);*/
387 transition-property: background-color, border-color;
388 transition-duration: 150ms;
391 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
392 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton {
397 /* reduce the width with 2px for each button to compensate for two separators
399 min-width: calc(7em - 2px);
400 max-width: calc(7em - 2px);
403 -moz-box-orient: horizontal;
406 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton[disabled] > .toolbarbutton-icon,
407 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton[disabled] > .toolbarbutton-icon {
411 #zoom-controls[cui-areatype="toolbar"] > #zoom-reset-button > .toolbarbutton-text {
415 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button:-moz-locale-dir(ltr),
416 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button:-moz-locale-dir(rtl),
417 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button:-moz-locale-dir(ltr),
418 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button:-moz-locale-dir(rtl) {
419 border-top-right-radius: 0;
420 border-bottom-right-radius: 0;
423 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button:-moz-locale-dir(rtl),
424 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button:-moz-locale-dir(ltr),
425 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button:-moz-locale-dir(rtl),
426 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button:-moz-locale-dir(ltr) {
427 border-top-left-radius: 0;
428 border-bottom-left-radius: 0;
431 #edit-controls > separator,
432 #zoom-controls > separator {
434 -moz-box-align: stretch;
435 /* background-image: linear-gradient(to bottom, hsla(0,0%,100%,0), hsla(0,0%,100%,.3) 40%, hsla(0,0%,100%,.3) 60%, hsla(0,0%,100%,0)),
436 linear-gradient(to bottom, hsla(210,54%,20%,0), hsla(210,54%,20%,.15) 40%, hsla(210,54%,20%,.15) 60%, hsla(210,54%,20%,0)),
437 linear-gradient(to bottom, hsla(0,0%,100%,0), hsla(0,0%,100%,.3) 40%, hsla(0,0%,100%,.3) 60%, hsla(0,0%,100%,0));
438 background-size: 1px, 1px, 1px;
439 background-position: 0 0, 1px 0, 2px 0;
440 background-repeat: no-repeat;*/
443 #widget-overflow > .panel-arrowcontainer > .panel-arrowcontent {
447 #widget-overflow-scroller {
455 #widget-overflow-list {
461 #widget-overflow-list > .overflowedItem {
465 background-repeat: no-repeat;
466 background-position: 0 center;
469 #widget-overflow-list > toolbarbutton,
470 #widget-overflow-list > toolbarbutton > toolbarbutton {
471 -moz-box-align: center;
472 -moz-box-orient: horizontal;
475 #widget-overflow-list > toolbarbutton > .toolbarbutton-text,
476 #widget-overflow-list > #bookmarks-menu-button > toolbarbutton > .toolbarbutton-text {
478 -moz-padding-start: .5em;
481 #widget-overflow-list > #edit-controls,
482 #widget-overflow-list > #zoom-controls {
486 #PanelUI-developerItems > toolbarbutton[checked="true"],
487 #PanelUI-bookmarks > toolbarbutton[checked="true"],
488 .PanelUI-characterEncodingView-list > toolbarbutton[current] {
489 -moz-padding-start: 4px;
492 #PanelUI-developerItems > toolbarbutton[checked="true"] > .toolbarbutton-text,
493 #PanelUI-bookmarks > toolbarbutton[checked="true"] > .toolbarbutton-text,
494 .PanelUI-characterEncodingView-list > toolbarbutton[current] > .toolbarbutton-text,
495 #customizationui-widget-panel .PanelUI-characterEncodingView-list > toolbarbutton[current] > .toolbarbutton-text {
496 -moz-padding-start: 0px;
499 #BMB_bookmarksPopup > menuitem[checked="true"]::before,
500 #PanelUI-bookmarks > toolbarbutton[checked="true"]::before,
501 #PanelUI-developerItems > toolbarbutton[checked="true"]::before,
502 .PanelUI-characterEncodingView-list > toolbarbutton[current]::before {
508 #PanelUI-bookmarks > toolbarbutton[checked="true"]::before,
509 #PanelUI-developerItems > toolbarbutton[checked="true"]::before,
510 .PanelUI-characterEncodingView-list > toolbarbutton[current]::before {
511 -moz-margin-end: -2px;
514 #BMB_bookmarksPopup > menuitem[checked="true"] > .menu-iconic-left {
518 /* === END panelUIOverlay.inc.css === */
520 #PanelUI-contents #zoom-out-btn {
525 #PanelUI-contents #zoom-in-btn {
530 #BMB_bookmarksPopup > menu,
531 #BMB_bookmarksPopup > menuitem {
536 #BMB_bookmarksPopup > menu > .menu-text,
537 #BMB_bookmarksPopup > menuitem > .menu-text,
538 #BMB_bookmarksPopup > menu > .menu-iconic-text,
539 #BMB_bookmarksPopup > menuitem > .menu-iconic-text,
540 #BMB_bookmarksPopup > menuseparator {