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 === */
7 #customization-panelHolder {
12 background-color: #000000;
13 -moz-margin-start: 38px;
16 .panel-subviews:-moz-locale-dir(rtl) {
19 .panel-viewstack[viewtype="main"] > .panel-subviews {
20 transform: translateX(21em);
23 .panel-viewstack[viewtype="main"] > .panel-subviews:-moz-locale-dir(rtl) {
24 transform: translateX(-21em);
27 .panel-viewstack:not([viewtype="main"]) > .panel-mainview > #PanelUI-mainView {
32 background-color: #000000;
34 flex-direction: column;
38 #app-extension-point-end > #PanelUI-menu-button {
41 #app-extension-point-end > #PanelUI-menu-button .toolbarbutton-text {
44 #app-extension-point-end > #PanelUI-menu-button .toolbarbutton-icon {
48 #PanelUI-popup > arrowscrollbox > autorepeatbutton {
51 #PanelUI-popup > arrowscrollbox > scrollbox {
55 #PanelUI-popup > .panel-arrowcontainer > .panel-arrowcontent {
64 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text,
65 #bookmarks-menu-button > toolbarbutton > .toolbarbutton-text,
66 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarpaletteitem > toolbaritem > toolbarbutton > .toolbarbutton-text,
67 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbaritem > toolbarbutton > .toolbarbutton-text,
68 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarpaletteitem > toolbarbutton > .toolbarbutton-text,
69 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarbutton > .toolbarbutton-text {
73 #wrapper-edit-controls:-moz-any([place="palette"],[place="panel"]) > #edit-controls,
74 #wrapper-zoom-controls:-moz-any([place="palette"],[place="panel"]) > #zoom-controls {
79 .panel-mainview:not([panelid="PanelUI-popup"]) {
83 panelview:not([mainview]) .toolbarbutton-text,
84 #customizationui-widget-panel toolbarbutton > .toolbarbutton-text {
86 -moz-padding-start: 8px;
98 #PanelUI-contents-scroller {
107 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton > .toolbarbutton-icon,
108 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton > .toolbarbutton-icon {
114 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item),
115 #PanelUI-contents toolbarbutton,
116 toolbarpaletteitem[place="panel"] > toolbarbutton,
117 toolbarpaletteitem[place="palette"] > toolbarbutton,
118 toolbarpaletteitem[place="panel"] > toolbaritem > toolbarbutton,
119 toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton,
120 .panel-customization-placeholder {
121 -moz-appearance: none;
122 -moz-box-orient: vertical;
131 .panel-customization-placeholder[expand],
132 .panel-customization-placeholder[contract] {
133 transition-property: width;
134 transition-duration: 170ms;
135 transition-delay: 20ms;
136 transition-timing-function: ease-in-out;
141 .panel-combined-button[disabled] > .toolbarbutton-icon {
145 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] {
147 margin: 0 !important;
150 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-widget) {
151 -moz-box-align: center;
152 -moz-box-pack: center;
155 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] > iframe {
156 margin: calc(5em / 12) auto;
159 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text {
163 .panel-customization-placeholder-child > .toolbarbutton-icon,
164 #bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
165 toolbarbutton[cui-areatype="menu-panel"] > .toolbarbutton-icon,
166 toolbaritem[cui-areatype="menu-panel"] > toolbarbutton > .toolbarbutton-icon,
167 toolbarpaletteitem[place="palette"] > #bookmarks-menu-button > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
168 toolbarpaletteitem[place="palette"] > toolbarbutton > .toolbarbutton-icon,
169 toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton > .toolbarbutton-icon {
170 min-width: calc(8em / 3);
171 min-height: calc(8em / 3);
172 margin: calc(5em / 12);
175 toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
179 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button,
180 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-reset-button {
186 #zoom-in-button > .toolbarbutton-text,
187 #zoom-out-button > .toolbarbutton-text,
188 #zoom-reset-button > .toolbarbutton-icon {
194 border-top: 1px solid #9C9CFF;
198 border-bottom-right-radius: 4px;
199 border-bottom-left-radius: 4px;
207 -moz-appearance: none;
209 background-image: none;
210 border: 1px solid transparent;
211 border-bottom-style: none;
213 transition: background-color;
214 -moz-box-orient: horizontal;
222 #PanelUI-customize > .toolbarbutton-text {
226 #PanelUI-help > .toolbarbutton-text,
227 #PanelUI-quit > .toolbarbutton-text {
231 #PanelUI-help > .toolbarbutton-icon,
232 #PanelUI-quit > .toolbarbutton-icon {
238 -moz-padding-start: 15px;
239 -moz-border-start-style: none;
240 list-style-image: url("chrome://browser/skin/menuPanel-customize.png");
244 list-style-image: url("chrome://browser/skin/menuPanel-help.png");
248 -moz-border-end-style: none;
249 list-style-image: url("chrome://browser/skin/menuPanel-exit.png");
255 -moz-image-region: rect(0, 16px, 16px, 0);
258 #PanelUI-customize:hover,
259 #PanelUI-help:not([disabled]):hover,
260 #PanelUI-quit:not([disabled]):hover,
261 #PanelUI-customize:hover:active,
262 #PanelUI-help:not([disabled]):hover:active,
263 #PanelUI-quit:not([disabled]):hover:active {
264 -moz-image-region: rect(0, 32px, 16px, 16px);
267 #PanelUI-help[disabled],
268 #PanelUI-quit[disabled] {
269 -moz-image-region: rect(0, 48px, 16px, 32px);
272 #PanelUI-help:not([disabled]):hover,
273 #PanelUI-customize:hover,
274 #PanelUI-quit:not([disabled]):hover {
277 #main-window[customize-entered] #PanelUI-customize {
279 background-color: #008484;
282 #main-window[customize-entered] #PanelUI-customize:hover,
283 #main-window[customize-entered] #PanelUI-customize:hover:active {
285 background-color: #FFCF00;
288 #customization-palette .toolbarbutton-text {
292 panelview toolbarbutton,
293 #widget-overflow-list > toolbarbutton,
294 .customizationmode-button,
295 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
296 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
297 #BMB_bookmarksPopup > menu,
298 #BMB_bookmarksPopup > menuitem {
299 -moz-appearance: none;
301 transition-property: background-color, border-color;
302 transition-duration: 150ms;
305 panelview .toolbarbutton-1,
306 #widget-overflow-list > toolbarbutton {
310 panelview toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
311 #widget-overflow-list > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
312 .customizationmode-button,
313 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
314 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
315 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem):not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
316 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem):not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
317 #BMB_bookmarksPopup > menu:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
318 #BMB_bookmarksPopup > menuitem:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover {
319 background-color: hsla(210,4%,10%,.08);
320 border-color: hsla(210,4%,10%,.1);
323 panelview toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
324 .customizationmode-button:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
325 #widget-overflow-list > toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
326 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
327 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
328 #BMB_bookmarksPopup > menu:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
329 #BMB_bookmarksPopup > menuitem:not([disabled]):-moz-any([open],[checked="true"],:hover:active) {
330 background-color: hsla(210,4%,10%,.15);
331 border-color: hsla(210,4%,10%,.15);
332 box-shadow: 0 1px 0 0 hsla(210,4%,10%,.05) inset;
335 #BMB_bookmarksPopup > menu,
336 #BMB_bookmarksPopup > menuitem {
340 #BMB_bookmarksPopup > menu:not([disabled="true"]),
341 #BMB_bookmarksPopup > menuitem:not([disabled="true"]) {
345 #BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-up,
346 #BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-down {
347 -moz-appearance: none;
352 panelview toolbarseparator,
353 #BMB_bookmarksPopup > menuseparator {
354 -moz-appearance: none;
356 border-top: 1px solid ThreeDShadow;
360 #PanelUI-historyItems > toolbarbutton {
361 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
364 #PanelUI-recentlyClosedWindows > toolbarbutton > .toolbarbutton-icon,
365 #PanelUI-recentlyClosedTabs > toolbarbutton > .toolbarbutton-icon,
366 #PanelUI-historyItems > toolbarbutton > .toolbarbutton-icon {
371 #PanelUI-footer.panel-multiview-anchor,
372 #PanelUI-footer.panel-multiview-anchor > #PanelUI-help,
373 toolbarbutton.panel-multiview-anchor {
374 background-color: #008484;
377 toolbarpaletteitem[place="palette"] > #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker,
378 #bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-dropmarker {
382 #search-container[cui-areatype="menu-panel"] {
386 toolbarpaletteitem[place="palette"] > #search-container {
391 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem),
392 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) {
395 transition-property: background-color, border-color;
396 transition-duration: 150ms;
399 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
400 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton {
405 /* reduce the width with 2px for each button to compensate for two separators
407 min-width: calc(7em - 2px);
408 max-width: calc(7em - 2px);
411 -moz-box-orient: horizontal;
414 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton[disabled] > .toolbarbutton-icon,
415 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton[disabled] > .toolbarbutton-icon {
419 #zoom-controls[cui-areatype="toolbar"] > #zoom-reset-button > .toolbarbutton-text {
423 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button:-moz-locale-dir(ltr),
424 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button:-moz-locale-dir(rtl),
425 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button:-moz-locale-dir(ltr),
426 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button:-moz-locale-dir(rtl) {
427 border-top-right-radius: 0;
428 border-bottom-right-radius: 0;
431 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button:-moz-locale-dir(rtl),
432 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button:-moz-locale-dir(ltr),
433 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button:-moz-locale-dir(rtl),
434 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button:-moz-locale-dir(ltr) {
435 border-top-left-radius: 0;
436 border-bottom-left-radius: 0;
439 #edit-controls > separator,
440 #zoom-controls > separator {
442 -moz-box-align: stretch;
445 #widget-overflow > .panel-arrowcontainer > .panel-arrowcontent {
449 #widget-overflow-scroller {
457 #widget-overflow-list {
463 #widget-overflow-list > .overflowedItem {
467 background-repeat: no-repeat;
468 background-position: 0 center;
471 #widget-overflow-list > toolbarbutton,
472 #widget-overflow-list > toolbarbutton > toolbarbutton {
473 -moz-box-align: center;
474 -moz-box-orient: horizontal;
477 #widget-overflow-list > toolbarbutton > .toolbarbutton-text,
478 #widget-overflow-list > #bookmarks-menu-button > toolbarbutton > .toolbarbutton-text {
480 -moz-padding-start: .5em;
483 #widget-overflow-list > #edit-controls,
484 #widget-overflow-list > #zoom-controls {
488 #PanelUI-developerItems > toolbarbutton[checked="true"],
489 #PanelUI-bookmarks > toolbarbutton[checked="true"],
490 #PanelUI-history > toolbarbutton[checked="true"],
491 .PanelUI-characterEncodingView-list > toolbarbutton[current] {
492 -moz-padding-start: 4px;
495 #PanelUI-developerItems > toolbarbutton[checked="true"] > .toolbarbutton-text,
496 #PanelUI-bookmarks > toolbarbutton[checked="true"] > .toolbarbutton-text,
497 #PanelUI-history > toolbarbutton[checked="true"] > .toolbarbutton-text,
498 .PanelUI-characterEncodingView-list > toolbarbutton[current] > .toolbarbutton-text,
499 #customizationui-widget-panel .PanelUI-characterEncodingView-list > toolbarbutton[current] > .toolbarbutton-text {
500 -moz-padding-start: 0px;
503 #BMB_bookmarksPopup > menuitem[checked="true"]::before,
504 #PanelUI-bookmarks > toolbarbutton[checked="true"]::before,
505 #PanelUI-history > toolbarbutton[checked="true"]::before,
506 #PanelUI-developerItems > toolbarbutton[checked="true"]::before,
507 .PanelUI-characterEncodingView-list > toolbarbutton[current]::before {
513 #PanelUI-bookmarks > toolbarbutton[checked="true"]::before,
514 #PanelUI-history > toolbarbutton[checked="true"]::before,
515 #PanelUI-developerItems > toolbarbutton[checked="true"]::before,
516 .PanelUI-characterEncodingView-list > toolbarbutton[current]::before {
517 -moz-margin-end: -2px;
520 #BMB_bookmarksPopup > menuitem[checked="true"] > .menu-iconic-left {
524 /* === END panelUIOverlay.inc.css === */
526 #PanelUI-contents #zoom-out-btn {
531 #PanelUI-contents #zoom-in-btn {
536 #BMB_bookmarksPopup > menu,
537 #BMB_bookmarksPopup > menuitem {
542 #BMB_bookmarksPopup > menu > .menu-text,
543 #BMB_bookmarksPopup > menuitem > .menu-text,
544 #BMB_bookmarksPopup > menu > .menu-iconic-text,
545 #BMB_bookmarksPopup > menuitem > .menu-iconic-text,
546 #BMB_bookmarksPopup > menuseparator {