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 {
14 #PanelUI-button:-moz-locale-dir(rtl) {
19 background-color: #000000;
20 -moz-margin-start: 38px;
23 .panel-viewstack[viewtype="main"] > .panel-subviews {
24 transform: translateX(21em);
27 .panel-viewstack[viewtype="main"] > .panel-subviews:-moz-locale-dir(rtl) {
28 transform: translateX(-21em);
31 .panel-viewstack:not([viewtype="main"]) > .panel-mainview > #PanelUI-mainView {
41 #PanelUI-popup .panel-subview-body {
46 .panel-subview-header,
47 .subviewbutton.panel-subview-footer {
51 .panel-subview-header {
53 background-color: #A09090;
58 .panel-subview-footer {
59 border-top: 1px solid #A09090;
62 .cui-widget-panelview .panel-subview-header {
66 .cui-widget-panelview .subviewbutton.panel-subview-footer {
68 -moz-box-pack: center;
73 flex-direction: column;
77 #app-extension-point-end > #PanelUI-menu-button {
80 #app-extension-point-end > #PanelUI-menu-button .toolbarbutton-text {
83 #app-extension-point-end > #PanelUI-menu-button .toolbarbutton-icon {
87 #PanelUI-popup > arrowscrollbox > autorepeatbutton {
90 #PanelUI-popup > arrowscrollbox > scrollbox {
94 #PanelUI-popup > .panel-arrowcontainer > .panel-arrowcontent {
103 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text,
104 #bookmarks-menu-button > toolbarbutton > .toolbarbutton-text,
105 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarpaletteitem > toolbaritem > toolbarbutton > .toolbarbutton-text,
106 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbaritem > toolbarbutton > .toolbarbutton-text,
107 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarpaletteitem > toolbarbutton > .toolbarbutton-text,
108 :-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarbutton > .toolbarbutton-text {
112 #wrapper-edit-controls:-moz-any([place="palette"],[place="panel"]) > #edit-controls,
113 #wrapper-zoom-controls:-moz-any([place="palette"],[place="panel"]) > #zoom-controls {
114 -moz-margin-start: 0;
118 .panel-mainview:not([panelid="PanelUI-popup"]) {
122 panelview:not([mainview]) .toolbarbutton-text,
123 .cui-widget-panel toolbarbutton > .toolbarbutton-text {
125 -moz-padding-start: 8px;
129 .cui-widget-panel > .panel-arrowcontainer > .panel-arrowcontent {
133 .cui-widget-panel.cui-widget-panelWithFooter > .panel-arrowcontainer > .panel-arrowcontent {
145 #PanelUI-contents-scroller {
152 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton > .toolbarbutton-icon {
158 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item),
159 .panelUI-grid .toolbarbutton-1,
160 .panel-customization-placeholder-child {
161 -moz-appearance: none;
162 -moz-box-orient: vertical;
163 width: calc(7em - 2px); /* LCARStrek: XXX: found out to be needed to fit the icons */
164 height: calc(51px + 2.2em);
167 /* Help SDK buttons fit in. */
168 toolbarpaletteitem[place="palette"] > toolbarbutton[sdk-button="true"] > .toolbarbutton-icon,
169 toolbarbutton[sdk-button="true"][cui-areatype="menu-panel"] > .toolbarbutton-icon {
174 .customization-palette .toolbarbutton-1 {
175 -moz-appearance: none;
176 -moz-box-orient: vertical;
179 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button {
180 -moz-appearance: none;
181 -moz-box-orient: vertical;
182 width: calc(7em - 2px);
183 height: calc(49px + 2.2em);
187 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-text,
188 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text {
189 margin-top: 2px; /* Hack needed to get the label of type=menu-button aligned with other buttons */
192 .panel-customization-placeholder-child {
194 /* padding: 2px 6px;*/
197 .panelUI-grid .toolbarbutton-1[type="menu"] {
198 background-image: url("chrome://global/skin/arrow/arrow-down-sharp.gif");
199 background-position: right 3px top 16px;
200 background-repeat: no-repeat;
203 .panelUI-grid .toolbarbutton-1[type="menu"]:-moz-locale-dir(rtl) {
204 background-position: left 3px top 16px;
207 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menu-dropmarker {
211 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
212 -moz-box-align: center;
214 -moz-margin-start: -16px;
216 margin-bottom: 2.2em;
220 .panelUI-grid .toolbarbutton-1:not([buttonover]):not([disabled]):-moz-any([open],:hover:active) > .toolbarbutton-menubutton-dropmarker {
221 border-radius: 0 0 0 2px;
224 .panelUI-grid .toolbarbutton-1:not([buttonover]):not([disabled]):-moz-any([open],:hover:active)> .toolbarbutton-menubutton-dropmarker:-moz-locale-dir(rtl) {
225 border-radius: 0 0 2px 0;
228 .panel-combined-button[disabled] > .toolbarbutton-icon {
232 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) {
234 margin: 0 !important;
237 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) {
238 -moz-box-align: center;
239 -moz-box-pack: center;
242 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] > iframe {
247 * XXXgijs: this is a workaround for a layout issue that was caused by these iframes,
248 * which was affecting subview display. Because of this, we're hiding the iframe *only*
249 * when displaying a subview. The discerning user might notice this, but it's not nearly
250 * as bad as the brokenness.
251 * This hack should be removed once https://bugzilla.mozilla.org/show_bug.cgi?id=975375
254 #PanelUI-multiView[viewtype="subview"] toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > iframe {
258 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text {
262 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
263 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-icon,
264 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-badge-container,
265 .customization-palette .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
266 .customization-palette .toolbarbutton-1 > .toolbarbutton-icon,
267 .panelUI-grid #bookmarks-toolbar-placeholder > .toolbarbutton-icon,
268 .customization-palette #bookmarks-toolbar-placeholder > .toolbarbutton-icon,
269 .panel-customization-placeholder-child > .toolbarbutton-icon {
272 /* Explanation for the below formula (A / B - C)
274 Each button is 7em (menuPanelButtonWidth) wide
276 Each button has two margins.
278 The button icon is 32 pixels wide.
279 The button has 12px of horizontal padding (6 on each side).
280 The button has 0px of horizontal border (0 on each side).
281 Total width of button's icon + button padding should therefore be 44px,
282 which means each horizontal margin should be the half the button's width - (44/2) px.
284 margin: 4px calc(7em / 2 - 22px);
287 /* above we treat the container as the icon for the margins, that is so the
288 /* badge itself is positioned correctly. Here we make sure that the icon itself
289 /* has the minum size we want, but no padding/margin. */
290 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-badge-container > .toolbarbutton-icon {
297 toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
301 #personal-bookmarks[overflowedItem=true] > #bookmarks-toolbar-placeholder {
305 #personal-bookmarks[cui-areatype="toolbar"][overflowedItem=true] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
306 -moz-margin-end: 2px;
309 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button,
310 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-reset-button {
316 #zoom-in-button > .toolbarbutton-text,
317 #zoom-out-button > .toolbarbutton-text,
318 #zoom-reset-button > .toolbarbutton-icon {
325 flex-direction: column;
326 /* background-color: hsla(210,4%,10%,.07);*/
329 /* min-height: 4em;*/
330 border-bottom-right-radius: 4px;
331 border-bottom-left-radius: 4px;
334 #PanelUI-footer-inner {
336 border-top: 1px solid #9C9CFF;
339 #PanelUI-footer-inner > toolbarseparator {
341 border-left: 1px solid #9C9CFF;
345 #PanelUI-footer-inner:hover > toolbarseparator {
357 background-image: none;
360 transition: background-color;
361 -moz-box-orient: horizontal;
364 #PanelUI-fxa-status {
365 border-top: 1px solid #9C9CFF;
366 border-bottom: 1px solid transparent;
370 #PanelUI-fxa-status > .toolbarbutton-text {
371 width: 0; /* Fancy cropping solution for flexbox. */
379 #PanelUI-fxa-status > .toolbarbutton-text,
380 #PanelUI-customize > .toolbarbutton-text {
386 #PanelUI-help > .toolbarbutton-text,
387 #PanelUI-quit > .toolbarbutton-text {
391 #PanelUI-help > .toolbarbutton-icon,
392 #PanelUI-quit > .toolbarbutton-icon {
398 -moz-padding-start: 15px;
399 -moz-border-start-style: none;
402 #PanelUI-fxa-status {
403 list-style-image: url("chrome://browser/skin/sync-horizontalbar.png");
406 #PanelUI-fxa-status[status="active"] {
407 list-style-image: url("chrome://browser/skin/syncProgress-horizontalbar.png");
411 list-style-image: url("chrome://browser/skin/menuPanel-customize.png");
414 #customization-panelHolder #PanelUI-customize {
415 list-style-image: url("chrome://browser/skin/customizableui/menuPanel-customizeFinish.png");
419 list-style-image: url("chrome://browser/skin/menuPanel-help.png");
423 -moz-border-end-style: none;
424 list-style-image: url("chrome://browser/skin/menuPanel-exit.png");
431 -moz-image-region: rect(0, 16px, 16px, 0);
434 #PanelUI-customize:hover,
435 #PanelUI-help:not([disabled]):hover,
436 #PanelUI-quit:not([disabled]):hover,
437 #PanelUI-customize:hover:active,
438 #PanelUI-help:not([disabled]):hover:active,
439 #PanelUI-quit:not([disabled]):hover:active {
440 -moz-image-region: rect(0, 32px, 16px, 16px);
443 #PanelUI-help[disabled],
444 #PanelUI-quit[disabled] {
445 -moz-image-region: rect(0, 48px, 16px, 32px);
448 #PanelUI-fxa-status:not([disabled]):hover,
449 #PanelUI-help:not([disabled]):hover,
450 #PanelUI-customize:hover,
451 #PanelUI-quit:not([disabled]):hover {
454 #PanelUI-fxa-status:not([disabled]):hover:active,
455 #PanelUI-help:not([disabled]):hover:active,
456 #PanelUI-customize:hover:active,
457 #PanelUI-quit:not([disabled]):hover:active {
460 #PanelUI-fxa-status:not([disabled]):hover,
461 #PanelUI-fxa-status:not([disabled]):hover:active {
464 #PanelUI-quit:not([disabled]):hover {
465 background-color: #FF0000;
468 #PanelUI-quit:not([disabled]):hover:active {
469 background-color: #FF9F00;
472 #customization-panelHolder #PanelUI-customize {
474 background-color: #008484;
479 #customization-panelHolder #PanelUI-customize + toolbarseparator {
483 #customization-panelHolder #PanelUI-customize:hover,
484 #customization-panelHolder #PanelUI-customize:hover:active {
485 background-color: #FFCF00;
489 #customization-palette .toolbarbutton-multiline-text,
490 #customization-palette .toolbarbutton-text {
494 panelview .toolbarbutton-1,
496 .widget-overflow-list .toolbarbutton-1,
497 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button,
498 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton {
500 background-color: hsla(210,4%,10%,0);
503 border-color: hsla(210,4%,10%,0);*/
504 transition-property: background-color, border-color;
505 transition-duration: 150ms;
508 panelview .toolbarbutton-1,
510 .widget-overflow-list .toolbarbutton-1,
511 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton {
515 .subviewbutton.panel-subview-footer {
520 .subviewbutton.panel-subview-footer > .toolbarbutton-text,
521 .subviewbutton.panel-subview-footer > .menu-text {
522 -moz-padding-start: 0;
523 -moz-padding-end: 12px;
527 .subviewbutton:not(.panel-subview-footer) {
531 .subviewbutton:not(.panel-subview-footer) > .toolbarbutton-text,
532 /* Bookmark items need a more specific selector. */
533 .PanelUI-subView .subviewbutton:not(.panel-subview-footer) > .menu-text,
534 .PanelUI-subView .subviewbutton:not(.panel-subview-footer) > .menu-iconic-text {
535 /* font-size: 1.1em;*/
538 .cui-widget-panelview .subviewbutton:not(.panel-subview-footer) {
543 panelview .toolbarbutton-1,
544 .widget-overflow-list .toolbarbutton-1 {
549 panelview toolbarbutton-1:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
550 toolbarbutton.subviewbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
551 menu.subviewbutton:not(:-moz-any([disabled],:active))[_moz-menuactive],
552 menuitem.subviewbutton:not(:-moz-any([disabled],:active))[_moz-menuactive],
553 .widget-overflow-list .toolbarbutton-1:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
554 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)
555 > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover {
556 background-color: hsla(210,4%,10%,.08);
557 border-color: hsla(210,4%,10%,.11);
560 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem):not(:-moz-any([disabled],[checked="true"],[open],:active)):hover {
561 border-color: hsla(210,4%,10%,.11);
564 panelview .toolbarbutton-1:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
565 toolbarbutton.subviewbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
566 menu.subviewbutton:not([disabled])[_moz-menuactive]:active,
567 menuitem.subviewbutton:not([disabled])[_moz-menuactive]:active,
568 .widget-overflow-list .toolbarbutton-1:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
569 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)
570 > toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active) {
571 background-color: hsla(210,4%,10%,.12);
572 border-color: hsla(210,4%,10%,.14);
573 box-shadow: 0 1px 0 hsla(210,4%,10%,.03) inset;
576 .subviewbutton.panel-subview-footer {
577 margin: 4px -4px -4px;
578 background-color: hsla(210,4%,10%,.07);
579 border-top: 1px solid hsla(210,4%,10%,.12);
584 .subviewbutton.panel-subview-footer:not(:-moz-any([disabled],[open],:active)):hover {
585 background-color: hsla(210,4%,10%,.1);
586 border-top: 1px solid hsla(210,4%,10%,.12);
589 .subviewbutton.panel-subview-footer:not([disabled]):-moz-any([open],[checked="true"],:hover:active) {
590 background-color: hsla(210,4%,10%,.15);
591 border-top: 1px solid hsla(210,4%,10%,.12);
592 box-shadow: 0 1px 0 hsla(210,4%,10%,.05) inset;
595 #BMB_bookmarksPopup .subviewbutton {
600 #BMB_bookmarksPopup .subviewbutton:not([disabled="true"]) {
604 #BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-up,
605 #BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-down {
606 -moz-appearance: none;
611 / Remove padding on xul:arrowscrollbox to avoid extra padding on footer /
612 #BMB_bookmarksPopup arrowscrollbox {
616 #BMB_bookmarksPopup menupopup {
620 #BMB_bookmarksPopup menupopup > .bookmarks-actions-menuseparator {
621 / Hide bottom separator as the styled footer includes a top border serving the same purpose /
626 .PanelUI-subView menuseparator,
627 .PanelUI-subView toolbarseparator,
628 .cui-widget-panelview menuseparator {
629 -moz-appearance: none;
631 border-top: 1px solid #9C9CFF;
636 .PanelUI-subView menuseparator,
637 .PanelUI-subView toolbarseparator {
638 /* -moz-margin-start: -5px;
639 -moz-margin-end: -4px;*/
642 .PanelUI-subView menuseparator.small-separator,
643 .PanelUI-subView toolbarseparator.small-separator {
648 .cui-widget-panelview menuseparator.small-separator {
653 .subviewbutton > .menu-accel-container {
654 -moz-box-pack: start;
655 -moz-margin-start: 10px;
656 -moz-margin-end: auto;
657 /* color: hsl(0,0%,50%);*/
660 #PanelUI-historyItems > toolbarbutton {
661 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
664 #PanelUI-recentlyClosedWindows > toolbarbutton > .toolbarbutton-icon,
665 #PanelUI-recentlyClosedTabs > toolbarbutton > .toolbarbutton-icon,
666 #PanelUI-historyItems > toolbarbutton > .toolbarbutton-icon {
671 #PanelUI-footer > #PanelUI-footer-inner[panel-multiview-anchor=true],
672 toolbarbutton[panel-multiview-anchor=true] {
673 background-color: #008484;
676 toolbarbutton[panel-multiview-anchor=true] {
677 background-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted.png");
678 background-position: right 5px center;
679 background-repeat: no-repeat;
682 toolbarbutton[panel-multiview-anchor=true]:-moz-locale-dir(rtl) {
683 background-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted-rtl.png");
684 background-position: left 5px center;
687 #PanelUI-footer > #PanelUI-footer-inner[panel-multiview-anchor=true],
688 toolbarbutton[panel-multiview-anchor=true],
689 toolbarbutton[panel-multiview-anchor=true] > .toolbarbutton-menubutton-button {
693 toolbarpaletteitem[place="palette"] > .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker,
694 #bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-dropmarker {
698 #search-container[cui-areatype="menu-panel"],
699 #wrapper-search-container[place="panel"] {
703 #search-container[cui-areatype="menu-panel"] {
708 toolbarpaletteitem[place="palette"] > #search-container {
713 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) {
715 transition-property: background-color, border-color;
716 transition-duration: 150ms;
719 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton {
726 /* We'd prefer to use height: auto here but it leads to layout bugs in the panel. Cope:
727 1.2em for line height + 2 * .5em padding + margin on the label (2 * 2px) */
728 height: calc(2.2em + 4px);
730 -moz-box-orient: horizontal;
733 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button,
734 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-reset-button {
735 /* reduce the width with 2px for this button to compensate for two separators
737 min-width: calc(7em - 2px);
738 max-width: calc(7em - 2px);
741 #main-window:not([customizing]) .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton[disabled] > .toolbarbutton-icon {
745 #zoom-controls[cui-areatype="toolbar"] > #zoom-reset-button > .toolbarbutton-text {
749 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button:-moz-locale-dir(ltr),
750 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button:-moz-locale-dir(rtl),
751 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button:-moz-locale-dir(ltr),
752 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button:-moz-locale-dir(rtl) {
753 border-top-right-radius: 0;
754 border-bottom-right-radius: 0;
757 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button:-moz-locale-dir(rtl),
758 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button:-moz-locale-dir(ltr),
759 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button:-moz-locale-dir(rtl),
760 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button:-moz-locale-dir(ltr) {
761 border-top-left-radius: 0;
762 border-bottom-left-radius: 0;
765 .toolbaritem-combined-buttons > separator {
766 -moz-appearance: none;
768 -moz-box-align: stretch;
771 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > separator {
775 /* background: hsla(210,4%,10%,.15);*/
776 transition-property: margin;
777 transition-duration: 10ms;
778 transition-timing-function: ease;
781 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem):hover > separator {
785 #widget-overflow > .panel-arrowcontainer > .panel-arrowcontent {
789 .cui-widget-panelview,
790 #widget-overflow-scroller {
795 #widget-overflow-scroller {
801 #widget-overflow-list {
807 #widget-overflow-list > .overflowedItem {
811 background-repeat: no-repeat;
812 background-position: 0 center;
815 .widget-overflow-list .toolbarbutton-1,
816 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button {
817 -moz-box-align: center;
818 -moz-box-orient: horizontal;
821 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-text,
822 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-text {
824 -moz-padding-start: .5em;
827 #widget-overflow-list > .toolbaritem-combined-buttons {
831 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button::after {
836 -moz-margin-end: -1px;
839 .subviewbutton[checked="true"] {
840 background-image: url("chrome://global/skin/menu/menu-check.gif");
841 background-position: top 5px left 4px;
842 background-repeat: no-repeat;
845 .subviewbutton[checked="true"]:hover {
846 background-image: url("chrome://global/skin/menu/menu-check-hover.gif");
849 .PanelUI-subView .menu-iconic-left {
850 -moz-appearance: none;
851 -moz-margin-end: 3px;
854 .PanelUI-subView menuitem[checked="true"] > .menu-iconic-left {
858 /* === END panelUIOverlay.inc.css === */
860 #PanelUI-contents #zoom-out-btn {
865 #PanelUI-contents #zoom-in-btn {
870 /* bookmark panel submenus */
872 #BMB_bookmarksPopup menupopup {
873 background: transparent;
878 #BMB_bookmarksPopup menupopup > hbox {
879 /* emulating chrome://browser/content/places/menu.xml#places-popup-arrow but without the arrow */
881 border: 1px solid rgba(0,0,0,0.25);
882 border-radius: 3.5px;
886 #BMB_bookmarksPopup .menu-text {
890 /* bookmark panel separator */
891 #BMB_bookmarksPopup menuseparator {
896 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button {
897 -moz-appearance: none;
899 -moz-margin-start: 3px;
902 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
904 -moz-padding-start: 0;
908 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
912 .subviewbutton > .toolbarbutton-text {
913 -moz-padding-start: 16px;
916 .subviewbutton:-moz-any([image],[targetURI],.cui-withicon, .restoreallitem, .bookmark-item) > .toolbarbutton-text {
917 -moz-padding-start: 0;
920 .subviewbutton.bookmark-item > .toolbarbutton-icon {
921 -moz-margin-start: 3px;
924 /* subviewbutton entries for social sidebars have images that come from external
925 /* sources, and are not guaranteed to be the size we want, so force the size on
927 toolbarbutton.social-provider-menuitem > .toolbarbutton-icon {
932 .subviewbutton:-moz-any([image],[targetURI],.cui-withicon, .restoreallitem, .bookmark-item)[checked="true"] > .toolbarbutton-icon {
936 menu.subviewbutton > .menu-right {
937 -moz-appearance: none;
938 list-style-image: url("chrome://browser/skin/places/bookmarks-menu-arrow.png");
939 -moz-image-region: rect(0, 16px, 16px, 0);
942 menu[disabled="true"].subviewbutton > .menu-right {
943 -moz-image-region: rect(0, 32px, 16px, 16px);