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 @import url("chrome://global/skin/");
6 @import url("downloads/indicator.css");
8 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
9 @namespace html url("http://www.w3.org/1999/xhtml");
12 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar");
15 /* Remove selector when Australis lands - this makes it only apply post-Australis as iconsize doesn't exist there */
16 #navigator-toolbox:not([iconsize]) > toolbar[customizable="true"] {
17 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-browsercustom");
20 toolbar[type="menubar"][autohide="true"] {
21 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide");
24 /* Remove selector when Australis lands - this makes it only apply post-Australis as iconsize doesn't exist there */
25 #navigator-toolbox:not([iconsize]) > #toolbar-menubar[autohide="true"] {
26 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide-browsercustom");
30 -moz-binding: url("chrome://global/skin/globalBindings.xml#menubar");
34 -moz-box-orient: vertical; /* for flex hack */
38 -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
41 /* ::::: primary toolbar ::::: */
43 .toolbar-primary > .toolbar-box > .toolbar-holder {
44 background-color: #A09090;
47 .toolbar-primary > .toolbar-box > .toolbar-startcap,
48 .toolbar-primary > .toolbar-box > .toolbar-endcap {
49 background-color: #9C9CFF;
52 /* We want a 4px gap between the TabsToolbar and the toolbar-menubar when the
53 toolbar-menu is displayed, and a 16px gap when it is not. 1px is taken care
54 of by the (light) outer shadow of the tab, the remaining 3/15 are these margins. */
55 #toolbar-menubar:not([autohide="true"]) ~ #TabsToolbar,
56 #toolbar-menubar[autohide="true"]:not([inactive]) ~ #TabsToolbar {
60 #main-window[tabsintitlebar][sizemode="normal"][chromehidden~="menubar"] #toolbar-menubar ~ #TabsToolbar,
61 #main-window[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="true"][inactive] ~ #TabsToolbar {
62 /* margin-top: 15px;*/
65 /* Remove selector when Australis lands - this makes it only apply post-Australis as iconsize doesn't exist there */
66 #navigator-toolbox:not([iconsize]) > #toolbar-menubar:not([autohide="true"]) {
67 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-drag-browsercustom");
70 #main-window[tabsintitlebar] #toolbar-menubar .toolbar-endcap {
71 /* the titlebar buttons are shown right over the endcap but we have no power over the buttonbox position just for this case, so hide the endcap */
78 #navigator-toolbox::after {
81 -moz-box-ordinal-group: 101; /* tabs toolbar is 100 */
84 #navigator-toolbox[tabsontop=false]::after,
85 #main-window[disablechrome] #navigator-toolbox::after {
89 #navigator-toolbox > toolbar:not(:-moz-lwtheme) {
92 #main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[inactive] ~ #TabsToolbar:not(:-moz-lwtheme) {
94 background-color: #6000CF;
97 #main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[inactive] ~ #TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive {
98 background-color: #8050B0;
101 #main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[inactive] ~ #TabsToolbar > .tabbrowser-tabs > .tabbrowser-tab {
105 #main-window[tabsintitlebar] #titlebar:-moz-lwtheme {
108 #main-window[tabsintitlebar] #titlebar-content:-moz-lwtheme {
109 -moz-binding: url("chrome://global/content/bindings/general.xml#windowdragbox");
113 #nav-bar[tabsontop="true"],
114 #nav-bar[tabsontop="true"][collapsed="true"]:not([customizing]) + toolbar,
115 #nav-bar[tabsontop="true"][collapsed="true"]:not([customizing]) + #customToolbars + #PersonalToolbar {
116 /* background-image: linear-gradient(@toolbarHighlight@, rgba(255,255,255,0)); */
117 /* Position the toolbar above the bottom of background tabs */
122 #personal-bookmarks {
123 /* min-height: 24px; */
126 #print-preview-toolbar:not(:-moz-lwtheme) {
127 /* -moz-appearance: toolbox; */
130 /* ::::: app menu button ::::: */
132 /* The app menu button must appear on top of the navigator-toolbox in order
133 * for click and hover mouse events to work properly for the button in the
134 * restored window state. Otherwise, elements in the navigator-toolbox, like the
135 * menubar can swallow these events. It will also place the button above the
136 * fog on themes with Aero Glass.
138 #main-window[tabsintitlebar] #appmenu-button-container {
143 background-color: #FF9F00;
144 background-clip: padding-box;
147 border-right: 3px solid #000000;
154 #appmenu-button:-moz-locale-dir(rtl) {
155 border-left: 3px solid #000000;
159 #main-window[privatebrowsingmode=temporary] #appmenu-button {
160 background-color: #6000CF;
164 #appmenu-button:hover:not(:active):not([open]) {
167 #main-window[privatebrowsingmode=temporary] #appmenu-button:hover:not(:active):not([open]) {
170 #appmenu-button:hover,
171 #appmenu-button:hover:active,
172 #appmenu-button[open] {
173 background-color: #FFCF00;
177 #appmenu-button > .button-box > .button-menu-dropmarker {
178 list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
184 background-color: transparent;
185 -moz-margin-start: .5em;
188 #main-window[privatebrowsingmode=temporary] #appmenu-button > .button-box > .button-menu-dropmarker {
189 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
192 #appmenuPrimaryPane > menuitem,
193 #appmenuSecondaryPane > menuitem,
194 #appmenuPrimaryPane > menu {
198 .splitmenu-menuitem {
199 -moz-padding-start: 2px;
202 -moz-margin-end: 1px;
211 .appmenu-edit-button {
214 .appmenu-edit-button[disabled="true"] {
217 #appmenuPrimaryPane {
218 -moz-border-end: 1px solid #9C9CFF;
223 #appmenuPrimaryPane {
225 #appmenuSecondaryPane {
227 #appmenuSecondaryPane:-moz-locale-dir(rtl) {
230 #appmenuSecondaryPane menupopup {
233 .appmenu-menuseparator {
236 .appmenu-edit-button:not([disabled]):hover {
239 #appmenuSecondaryPane-spacer {
248 #appmenu_print_popup,
249 .appmenu-edit-button,
250 #appmenu-editmenu-cut,
251 #appmenu-editmenu-copy,
252 #appmenu-editmenu-paste,
254 list-style-image: url("appmenu-icons.png");
258 #appmenu-editmenu-cut {
259 -moz-image-region: rect(0 16px 16px 0);
262 #appmenu-cut:hover:not([disabled="true"]),
263 #appmenu-editmenu-cut:hover:not([disabled="true"]) {
264 -moz-image-region: rect(16px 16px 32px 0);
267 #appmenu-cut[disabled="true"],
268 #appmenu-editmenu-cut[disabled="true"] {
269 -moz-image-region: rect(32px 16px 48px 0);
273 #appmenu-editmenu-copy {
274 -moz-image-region: rect(0 32px 16px 16px);
277 #appmenu-copy:hover:not([disabled="true"]),
278 #appmenu-editmenu-copy:hover:not([disabled="true"]) {
279 -moz-image-region: rect(16px 32px 32px 16px);
282 #appmenu-copy[disabled="true"],
283 #appmenu-editmenu-copy[disabled="true"] {
284 -moz-image-region: rect(32px 32px 48px 16px);
288 #appmenu-editmenu-paste {
289 -moz-image-region: rect(0 48px 16px 32px);
292 #appmenu-paste:hover:not([disabled="true"]),
293 #appmenu-editmenu-paste:hover:not([disabled="true"]) {
294 -moz-image-region: rect(16px 48px 32px 32px);
297 #appmenu-paste[disabled="true"],
298 #appmenu-editmenu-paste[disabled="true"] {
299 -moz-image-region: rect(32px 48px 48px 32px);
303 #appmenu_print_popup {
304 -moz-image-region: rect(0 64px 16px 48px);
307 #appmenu_print:hover:not([disabled="true"]),
308 #appmenu_print[open="true"],
309 #appmenu_print_popup:hover:not([disabled="true"]) {
310 -moz-image-region: rect(16px 64px 32px 48px);
313 #appmenu-print[disabled="true"],
314 #appmenu_print_popup[disabled="true"] {
315 -moz-image-region: rect(32px 64px 48px 48px);
319 -moz-image-region: rect(0 80px 16px 64px);
322 #appmenu-quit:hover {
323 -moz-image-region: rect(16px 80px 32px 64px);
326 #appmenu-edit-label {
327 -moz-appearance: none;
328 background: transparent;
333 list-style-image: url("chrome://browser/skin/places/bookmark.png");
334 -moz-image-region: rect(0px 48px 16px 32px);
337 #appmenu_privateBrowsing,
338 #appmenu_newPrivateWindow {
339 list-style-image: url("chrome://browser/skin/Privacy-16.png");
342 @media (min-resolution: 1.25dppx) {
343 #appmenu_privateBrowsing,
344 #appmenu_newPrivateWindow {
345 list-style-image: url("chrome://browser/skin/Privacy-32.png");
350 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
353 @media (min-resolution: 1.25dppx) {
355 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
359 #BMB_bookmarkThisPage,
360 #appmenu_bookmarkThisPage {
361 list-style-image: url("chrome://browser/skin/places/bookmark.png");
362 -moz-image-region: rect(0 16px 16px 0);
365 /* ::::: titlebar ::::: */
369 background-color: #6000CF;
372 #titlebar:-moz-window-inactive {
373 background-color: #8050B0;
377 #main-window[sizemode="normal"] > #titlebar {
382 #main-window[sizemode="maximized"] > #titlebar {
386 /* The button box must appear on top of the navigator-toolbox in order for
387 * click and hover mouse events to work properly for the button in the restored
388 * window state. Otherwise, elements in the navigator-toolbox, like the menubar,
389 * can swallow those events. It will also place the buttons above the fog on
390 * themes with Aero Glass.
392 #titlebar-buttonbox {
394 -moz-margin-end: 3px;
398 #main-window[sizemode="maximized"] #titlebar-buttonbox {
401 .titlebar-placeholder[type="appmenu-button"] {
405 .titlebar-placeholder[type="caption-buttons"] {
409 /* titlebar command buttons */
412 list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
415 #titlebar-min:hover {
416 list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
420 list-style-image: url("chrome://browser/skin/win-maximize.gif");
423 #titlebar-max:hover {
424 list-style-image: url("chrome://browser/skin/win-maximize-hover.gif");
427 #main-window[sizemode="maximized"] #titlebar-max {
428 list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
431 #main-window[sizemode="maximized"] #titlebar-max:hover {
432 list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
436 list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
439 #titlebar-close:hover {
440 list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
443 /* ::::: bookmark buttons ::::: */
445 .bookmark-item > .toolbarbutton-icon,
446 #personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
451 /* Force the display of the label for bookmarks */
452 .bookmark-item > .toolbarbutton-text,
453 #personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-text {
454 display: -moz-box !important;
457 .bookmark-item > .toolbarbutton-menu-dropmarker {
461 #wrapper-personal-bookmarks[place="palette"] > .toolbarpaletteitem-box {
462 background: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") no-repeat center;
465 .bookmarks-toolbar-customize,
466 #bookmarks-toolbar-placeholder {
467 max-width: 15em !important;
468 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") !important;
471 /* ::::: bookmark menus ::::: */
474 menuitem.bookmark-item {
479 .bookmark-item > .menu-iconic-left {
484 .bookmark-item > .menu-iconic-left > .menu-iconic-icon {
485 -moz-padding-start: 0px;
488 /* ::::: bookmark items ::::: */
491 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
492 -moz-image-region: auto;
495 .bookmark-item[container] {
496 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
497 -moz-image-region: auto;
500 .bookmark-item[container][open] {
501 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
502 -moz-image-region: auto;
505 .bookmark-item[container][livemark] {
506 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-folder.png");
507 -moz-image-region: auto;
510 .bookmark-item[container][livemark] .bookmark-item {
511 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-item.png");
512 -moz-image-region: rect(0px, 16px, 16px, 0px);
515 .bookmark-item[container][livemark] .bookmark-item[visited] {
516 -moz-image-region: rect(0px, 32px, 16px, 16px);
519 .bookmark-item[container][query] {
520 list-style-image: url("chrome://communicator/skin/bookmarks/query.png");
521 -moz-image-region: auto;
524 .bookmark-item[query][tagContainer] {
525 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
526 -moz-image-region: auto;
529 .bookmark-item[query][dayContainer] {
530 list-style-image: url("chrome://communicator/skin/history/calendar.png");
531 -moz-image-region: auto;
534 .bookmark-item[query][hostContainer] {
535 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
536 -moz-image-region: auto;
539 .bookmark-item[query][hostContainer][open] {
540 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
541 -moz-image-region: auto;
544 .bookmark-item[cutting] > .toolbarbutton-icon,
545 .bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-icon {
549 .bookmark-item[cutting] > .toolbarbutton-text,
550 .bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-text {
554 /* ::::: primary toolbar buttons ::::: */
556 /* === BEGIN toolbarbuttons.inc.css === */
558 /* Whole section of this included file: */
559 /* Remove |#navigator-toolbox:not([iconsize])| selector when Australis lands - this makes it only apply post-Australis as iconsize doesn't exist there */
560 #navigator-toolbox:not([iconsize]) :-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button,
561 #cut-button, #copy-button, #paste-button, #fullscreen-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #sync-button, #feed-button,
562 #tabview-button, #webrtc-status-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button,
563 #privatebrowsing-button, #save-page-button, #switch-to-metro-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button,
564 #PanelUI-menu-button, #characterencoding-button, #email-link-button),
565 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
566 list-style-image: url("chrome://browser/skin/ToolbarFx.png");
569 #navigator-toolbox:not([iconsize]) #back-button {
570 -moz-image-region: rect(0, 36px, 18px, 18px);
573 #navigator-toolbox:not([iconsize]) #back-button:hover:not([disabled="true"]) {
574 -moz-image-region: rect(18px, 36px, 36px, 18px);
577 #navigator-toolbox:not([iconsize]) #back-button[disabled="true"] {
578 -moz-image-region: rect(36px, 36px, 54px, 18px);
581 #navigator-toolbox:not([iconsize]) #forward-button {
582 -moz-image-region: rect(0, 72px, 18px, 54px);
585 #navigator-toolbox:not([iconsize]) #forward-button:hover:not([disabled="true"]) {
586 -moz-image-region: rect(18px, 72px, 36px, 54px);
589 #navigator-toolbox:not([iconsize]) #forward-button[disabled="true"] {
590 -moz-image-region: rect(36px, 72px, 54px, 54px);
593 #navigator-toolbox:not([iconsize]) #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
594 #navigator-toolbox:not([iconsize]) #forward-button:-moz-locale-dir(rtl) {
595 transform: scaleX(-1);
598 #navigator-toolbox:not([iconsize]) #home-button[cui-areatype="toolbar"] {
599 -moz-image-region: rect(0, 126px, 18px, 108px);
602 #navigator-toolbox:not([iconsize]) #home-button[cui-areatype="toolbar"]:hover {
603 -moz-image-region: rect(18px, 126px, 36px, 108px);
606 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"] {
607 -moz-image-region: rect(0, 144px, 18px, 126px);
610 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"]:hover,
611 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"][open="true"] {
612 -moz-image-region: rect(18px, 144px, 36px, 126px);
615 /* When "new tab" page shows up, the menubutton-button (star button) is disabled */
616 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-button[disabled="true"] {
617 -moz-image-region: rect(36px, 144px, 54px, 126px) !important;
618 background-color: transparent !important;
621 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"][starred] {
622 -moz-image-region: rect(0, 162px, 18px, 144px);
625 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"][starred]:hover,
626 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"][starred][open="true"] {
627 -moz-image-region: rect(18px, 162px, 36px, 144px);
630 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
631 -moz-image-region: rect(0, 630px, 18px, 612px);
634 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker {
636 -moz-box-align: center;
639 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"]:hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
640 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"][open="true"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
641 -moz-image-region: rect(18px, 630px, 36px, 612px);
644 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"]:hover:active > .toolbarbutton-menubutton-dropmarker,
645 #navigator-toolbox:not([iconsize]) #bookmarks-menu-button[cui-areatype="toolbar"][open="true"] > .toolbarbutton-menubutton-dropmarker {
648 -moz-padding-start: 2px;
649 -moz-padding-end: 0px;
652 #navigator-toolbox:not([iconsize]) #history-panelmenu[cui-areatype="toolbar"] {
653 -moz-image-region: rect(0, 180px, 18px, 162px);
656 #navigator-toolbox:not([iconsize]) #history-panelmenu[cui-areatype="toolbar"]:hover,
657 #navigator-toolbox:not([iconsize]) #history-panelmenu[cui-areatype="toolbar"][open="true"] {
658 -moz-image-region: rect(18px, 180px, 36px, 162px);
661 #navigator-toolbox:not([iconsize]) #downloads-button[cui-areatype="toolbar"] {
662 -moz-image-region: rect(0, 198px, 18px, 180px);
665 #navigator-toolbox:not([iconsize]) #downloads-button[cui-areatype="toolbar"]:hover,
666 #navigator-toolbox:not([iconsize]) #downloads-button[cui-areatype="toolbar"][open="true"] {
667 -moz-image-region: rect(18px, 198px, 36px, 180px);
670 #navigator-toolbox:not([iconsize]) #add-ons-button[cui-areatype="toolbar"] {
671 -moz-image-region: rect(0, 216px, 18px, 198px);
674 #navigator-toolbox:not([iconsize]) #add-ons-button[cui-areatype="toolbar"]:hover {
675 -moz-image-region: rect(18px, 216px, 36px, 198px);
678 #navigator-toolbox:not([iconsize]) #switch-to-metro-button[cui-areatype="toolbar"] {
679 -moz-image-region: rect(0, 648px, 18px, 630px);
682 #navigator-toolbox:not([iconsize]) #switch-to-metro-button[cui-areatype="toolbar"]:hover {
683 -moz-image-region: rect(18px, 648px, 36px, 630px);
686 #navigator-toolbox:not([iconsize]) #open-file-button[cui-areatype="toolbar"] {
687 -moz-image-region: rect(0, 234px, 18px, 216px);
690 #navigator-toolbox:not([iconsize]) #open-file-button[cui-areatype="toolbar"]:hover {
691 -moz-image-region: rect(18px, 234px, 36px, 216px);
694 #navigator-toolbox:not([iconsize]) #save-page-button[cui-areatype="toolbar"] {
695 -moz-image-region: rect(0, 252px, 18px, 234px);
698 #navigator-toolbox:not([iconsize]) #save-page-button[cui-areatype="toolbar"]:hover {
699 -moz-image-region: rect(18px, 252px, 36px, 234px);
702 #navigator-toolbox:not([iconsize]) #sync-button[cui-areatype="toolbar"] {
703 -moz-image-region: rect(0, 270px, 18px, 252px);
706 #navigator-toolbox:not([iconsize]) #sync-button[cui-areatype="toolbar"]:hover {
707 -moz-image-region: rect(18px, 270px, 36px, 252px);
710 #navigator-toolbox:not([iconsize]) #feed-button[cui-areatype="toolbar"] {
711 -moz-image-region: rect(0, 288px, 18px, 270px);
714 #navigator-toolbox:not([iconsize]) #feed-button[cui-areatype="toolbar"]:hover:not([disabled="true"]) {
715 -moz-image-region: rect(18px, 288px, 36px, 270px);
718 #navigator-toolbox:not([iconsize]) #feed-button[cui-areatype="toolbar"][disabled="true"] {
719 -moz-image-region: rect(36px, 288px, 54px, 270px);
722 #navigator-toolbox:not([iconsize]) #social-share-button[cui-areatype="toolbar"] {
723 -moz-image-region: rect(0px, 306px, 18px, 288px);
726 #navigator-toolbox:not([iconsize]) #social-share-button[cui-areatype="toolbar"]:hover {
727 -moz-image-region: rect(18px, 306px, 36px, 288px);
730 #navigator-toolbox:not([iconsize]) #email-link-button[cui-areatype="toolbar"] {
731 -moz-image-region: rect(0, 306px, 18px, 288px);
732 /* This is temporary until we have an email-link icon (Bug 932235) */
733 transform: scale(-1, -1);
736 #navigator-toolbox:not([iconsize]) #email-link-button[cui-areatype="toolbar"]:hover {
737 -moz-image-region: rect(18px, 306px, 36px, 288px);
740 #navigator-toolbox:not([iconsize]) #characterencoding-button[cui-areatype="toolbar"] {
741 -moz-image-region: rect(0, 324px, 18px, 306px);
744 #navigator-toolbox:not([iconsize]) #characterencoding-button[cui-areatype="toolbar"]:hover:not([disabled="true"]),
745 #navigator-toolbox:not([iconsize]) #characterencoding-button[cui-areatype="toolbar"][open="true"] {
746 -moz-image-region: rect(18px, 324px, 36px, 306px);
749 #navigator-toolbox:not([iconsize]) #characterencoding-button[cui-areatype="toolbar"][disabled="true"] {
750 -moz-image-region: rect(36px, 324px, 54px, 306px);
753 #navigator-toolbox:not([iconsize]) #new-window-button[cui-areatype="toolbar"] {
754 -moz-image-region: rect(0, 342px, 18px, 324px);
757 #navigator-toolbox:not([iconsize]) #new-window-button[cui-areatype="toolbar"]:hover {
758 -moz-image-region: rect(18px, 342px, 36px, 324px);
761 #navigator-toolbox:not([iconsize]) #new-tab-button[cui-areatype="toolbar"] {
762 -moz-image-region: rect(0, 360px, 18px, 342px);
765 #navigator-toolbox:not([iconsize]) #new-tab-button[cui-areatype="toolbar"]:hover {
766 -moz-image-region: rect(18px, 360px, 36px, 342px);
769 #navigator-toolbox:not([iconsize]) #privatebrowsing-button[cui-areatype="toolbar"] {
770 -moz-image-region: rect(0, 378px, 18px, 360px);
773 #navigator-toolbox:not([iconsize]) #privatebrowsing-button[cui-areatype="toolbar"]:hover {
774 -moz-image-region: rect(18px, 378px, 36px, 360px);
777 #navigator-toolbox:not([iconsize]) #find-button[cui-areatype="toolbar"] {
778 -moz-image-region: rect(0, 396px, 18px, 378px);
781 #navigator-toolbox:not([iconsize]) #find-button[cui-areatype="toolbar"]:hover {
782 -moz-image-region: rect(18px, 396px, 36px, 378px);
785 #navigator-toolbox:not([iconsize]) #print-button[cui-areatype="toolbar"] {
786 -moz-image-region: rect(0, 414px, 18px, 396px);
789 #navigator-toolbox:not([iconsize]) #print-button[cui-areatype="toolbar"]:hover {
790 -moz-image-region: rect(18px, 414px, 36px, 396px);
793 #navigator-toolbox:not([iconsize]) #fullscreen-button[cui-areatype="toolbar"] {
794 -moz-image-region: rect(0, 432px, 18px, 414px);
797 #navigator-toolbox:not([iconsize]) #fullscreen-button[cui-areatype="toolbar"]:hover {
798 -moz-image-region: rect(18px, 432px, 36px, 414px);
801 #navigator-toolbox:not([iconsize]) #developer-button[cui-areatype="toolbar"] {
802 -moz-image-region: rect(0, 450px, 18px, 432px);
805 #navigator-toolbox:not([iconsize]) #developer-button[cui-areatype="toolbar"]:hover,
806 #navigator-toolbox:not([iconsize]) #developer-button[cui-areatype="toolbar"][open="true"] {
807 -moz-image-region: rect(18px, 450px, 36px, 432px);
810 #navigator-toolbox:not([iconsize]) #preferences-button[cui-areatype="toolbar"] {
811 -moz-image-region: rect(0, 468px, 18px, 450px);
814 #navigator-toolbox:not([iconsize]) #preferences-button[cui-areatype="toolbar"]:hover {
815 -moz-image-region: rect(18px, 468px, 36px, 450px);
818 #navigator-toolbox:not([iconsize]) #PanelUI-menu-button {
819 -moz-image-region: rect(0, 486px, 18px, 468px);
822 #navigator-toolbox:not([iconsize]) #PanelUI-menu-button:hover,
823 #navigator-toolbox:not([iconsize]) #PanelUI-menu-button[open="true"] {
824 -moz-image-region: rect(18px, 486px, 36px, 468px);
827 #navigator-toolbox:not([iconsize]) #edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #cut-button {
828 -moz-image-region: rect(0, 504px, 18px, 486px);
831 #navigator-toolbox:not([iconsize]) #edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #cut-button:hover:not([disabled="true"]) {
832 -moz-image-region: rect(18px, 504px, 36px, 486px);
835 #navigator-toolbox:not([iconsize]) #edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #cut-button[disabled="true"] {
836 -moz-image-region: rect(36px, 504px, 54px, 486px);
839 #navigator-toolbox:not([iconsize]) #edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #copy-button {
840 -moz-image-region: rect(0, 522px, 18px, 504px);
843 #navigator-toolbox:not([iconsize]) #edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #copy-button:hover:not([disabled="true"]) {
844 -moz-image-region: rect(18px, 522px, 36px, 504px);
847 #navigator-toolbox:not([iconsize]) #edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #copy-button[disabled="true"] {
848 -moz-image-region: rect(36px, 522px, 54px, 504px);
851 #navigator-toolbox:not([iconsize]) #edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #paste-button {
852 -moz-image-region: rect(0, 540px, 18px, 522px);
855 #navigator-toolbox:not([iconsize]) #edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #paste-button:hover:not([disabled="true"]) {
856 -moz-image-region: rect(18px, 540px, 36px, 522px);
859 #navigator-toolbox:not([iconsize]) #edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #paste-button[disabled="true"] {
860 -moz-image-region: rect(36px, 540px, 54px, 522px);
863 #navigator-toolbox:not([iconsize]) #zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-out-button {
864 -moz-image-region: rect(0, 558px, 18px, 540px);
867 #navigator-toolbox:not([iconsize]) #zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-out-button:hover:not([disabled="true"]) {
868 -moz-image-region: rect(18px, 558px, 36px, 540px);
871 #navigator-toolbox:not([iconsize]) #zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-out-button[disabled="true"] {
872 -moz-image-region: rect(36px, 558px, 54px, 540px);
875 #navigator-toolbox:not([iconsize]) #zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-in-button {
876 -moz-image-region: rect(0, 576px, 18px, 558px);
879 #navigator-toolbox:not([iconsize]) #zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-in-button:hover:not([disabled="true"]) {
880 -moz-image-region: rect(18px, 576px, 36px, 558px);
883 #navigator-toolbox:not([iconsize]) #zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-in-button[disabled="true"] {
884 -moz-image-region: rect(36px, 576px, 54px, 558px);
887 #navigator-toolbox:not([iconsize]) #webrtc-status-button:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) {
888 -moz-image-region: rect(0, 594px, 18px, 576px);
891 #navigator-toolbox:not([iconsize]) #webrtc-status-button:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)):hover,
892 #navigator-toolbox:not([iconsize]) #webrtc-status-button:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem))[open="true"] {
893 -moz-image-region: rect(18px, 594px, 36px, 576px);
896 #navigator-toolbox:not([iconsize]) #nav-bar-overflow-button {
897 -moz-image-region: rect(0, 612px, 18px, 594px);
900 #navigator-toolbox:not([iconsize]) #nav-bar-overflow-button:hover,
901 #navigator-toolbox:not([iconsize]) #nav-bar-overflow-button[open="true"] {
902 -moz-image-region: rect(18px, 612px, 36px, 594px);
905 /* === END toolbarbuttons.inc.css === */
907 /* === BEGIN menupanel.inc.css === */
909 /* Menu panel and palette styles */
911 /* Remove |:-moz-any(#customization-palette, #panelUI-contents)| selector when Australis lands - this makes it only apply post-Australis as those elements only exist there */
912 :-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button,
913 #cut-button, #copy-button, #paste-button, #fullscreen-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #sync-button, #feed-button,
914 #tabview-button, #webrtc-status-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button,
915 #privatebrowsing-button, #save-page-button, #switch-to-metro-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button,
916 #PanelUI-menu-button, #characterencoding-button, #email-link-button)[cui-areatype="menu-panel"],
917 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > :-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button,
918 #cut-button, #copy-button, #paste-button, #fullscreen-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #sync-button, #feed-button,
919 #tabview-button, #webrtc-status-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button,
920 #privatebrowsing-button, #save-page-button, #switch-to-metro-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button,
921 #PanelUI-menu-button, #characterencoding-button, #email-link-button) {
922 list-style-image: url("chrome://browser/skin/menuPanel.png");
925 #home-button[cui-areatype="menu-panel"],
926 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #home-button {
927 -moz-image-region: rect(0px, 128px, 32px, 96px);
930 #home-button[cui-areatype="menu-panel"]:hover,
931 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #home-button:hover {
932 -moz-image-region: rect(32px, 128px, 64px, 96px);
935 #bookmarks-menu-button[cui-areatype="menu-panel"],
936 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #bookmarks-menu-button {
937 -moz-image-region: rect(0px, 160px, 32px, 128px);
940 #bookmarks-menu-button[cui-areatype="menu-panel"]:hover,
941 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #bookmarks-menu-button:hover {
942 -moz-image-region: rect(32px, 160px, 64px, 128px);
945 #bookmarks-menu-button[starred][cui-areatype="menu-panel"] {
946 -moz-image-region: rect(0px, 192px, 32px, 160px);
949 #bookmarks-menu-button[starred][cui-areatype="menu-panel"]:hover {
950 -moz-image-region: rect(32px, 192px, 64px, 160px);
953 #history-panelmenu[cui-areatype="menu-panel"],
954 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #history-panelmenu {
955 -moz-image-region: rect(0px, 224px, 32px, 192px);
958 #history-panelmenu[cui-areatype="menu-panel"]:hover,
959 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #history-panelmenu:hover {
960 -moz-image-region: rect(32px, 224px, 64px, 192px);
963 #downloads-button[cui-areatype="menu-panel"],
964 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #downloads-button {
965 -moz-image-region: rect(0px, 256px, 32px, 224px);
968 #downloads-button[cui-areatype="menu-panel"]:hover,
969 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #downloads-button:hover {
970 -moz-image-region: rect(32px, 256px, 64px, 224px);
973 #switch-to-metro-button[cui-areatype="menu-panel"],
974 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #switch-to-metro-button {
975 -moz-image-region: rect(0px, 800px, 32px, 768px);
978 #switch-to-metro-button[cui-areatype="menu-panel"]:hover,
979 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #switch-to-metro-button:hover {
980 -moz-image-region: rect(32px, 800px, 64px, 768px);
983 #add-ons-button[cui-areatype="menu-panel"],
984 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #add-ons-button {
985 -moz-image-region: rect(0px, 288px, 32px, 256px);
988 #add-ons-button[cui-areatype="menu-panel"]:hover,
989 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #add-ons-button:hover {
990 -moz-image-region: rect(32px, 288px, 64px, 256px);
993 #open-file-button[cui-areatype="menu-panel"],
994 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #open-file-button {
995 -moz-image-region: rect(0px, 320px, 32px, 288px);
998 #open-file-button[cui-areatype="menu-panel"]:hover,
999 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #open-file-button:hover {
1000 -moz-image-region: rect(32px, 320px, 64px, 288px);
1003 #save-page-button[cui-areatype="menu-panel"],
1004 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #save-page-button {
1005 -moz-image-region: rect(0px, 352px, 32px, 320px);
1008 #save-page-button[cui-areatype="menu-panel"]:hover,
1009 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #save-page-button:hover {
1010 -moz-image-region: rect(32px, 352px, 64px, 320px);
1013 #sync-button[cui-areatype="menu-panel"],
1014 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #sync-button {
1015 -moz-image-region: rect(0px, 384px, 32px, 352px);
1018 #sync-button[cui-areatype="menu-panel"]:hover,
1019 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #sync-button:hover {
1020 -moz-image-region: rect(32px, 384px, 64px, 352px);
1023 #feed-button[cui-areatype="menu-panel"],
1024 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #feed-button {
1025 -moz-image-region: rect(0px, 416px, 32px, 384px);
1028 #feed-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
1029 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #feed-button:hover:not([disabled="true"]) {
1030 -moz-image-region: rect(32px, 416px, 64px, 384px);
1033 #feed-button[cui-areatype="menu-panel"][disabled="true"],
1034 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #feed-button[disabled="true"] {
1035 -moz-image-region: rect(64px, 416px, 96px, 384px);
1038 #social-share-button[cui-areatype="menu-panel"],
1039 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #social-share-button {
1040 -moz-image-region: rect(0px, 448px, 32px, 416px);
1043 #social-share-button[cui-areatype="menu-panel"]:hover,
1044 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #social-share-button:hover {
1045 -moz-image-region: rect(32px, 448px, 64px, 416px);
1048 #email-link-button[cui-areatype="menu-panel"],
1049 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #email-link-button {
1050 -moz-image-region: rect(0, 448px, 32px, 416px);
1053 #email-link-button[cui-areatype="menu-panel"]:hover,
1054 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #email-link-button:hover {
1055 -moz-image-region: rect(32px, 448px, 64px, 416px);
1058 /* This is temporary until we have an email-link icon (Bug 932235) */
1059 #email-link-button[cui-areatype="menu-panel"] > image,
1060 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #email-link-button > image {
1061 transform: scale(-1, -1);
1064 #characterencoding-button[cui-areatype="menu-panel"],
1065 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #characterencoding-button {
1066 -moz-image-region: rect(0px, 480px, 32px, 448px);
1069 #characterencoding-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
1070 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #characterencoding-button:hover:not([disabled="true"]) {
1071 -moz-image-region: rect(32px, 480px, 64px, 448px);
1074 #characterencoding-button[cui-areatype="menu-panel"][disabled="true"],
1075 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #characterencoding-button[disabled="true"] {
1076 -moz-image-region: rect(64px, 480px, 96px, 448px);
1079 #new-window-button[cui-areatype="menu-panel"],
1080 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #new-window-button {
1081 -moz-image-region: rect(0px, 512px, 32px, 480px);
1084 #new-window-button[cui-areatype="menu-panel"]:hover,
1085 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #new-window-button:hover {
1086 -moz-image-region: rect(32px, 512px, 64px, 480px);
1089 #new-tab-button[cui-areatype="menu-panel"],
1090 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #new-tab-button {
1091 -moz-image-region: rect(0px, 544px, 32px, 512px);
1094 #new-tab-button[cui-areatype="menu-panel"]:hover,
1095 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #new-tab-button:hover {
1096 -moz-image-region: rect(32px, 544px, 64px, 512px);
1099 #privatebrowsing-button[cui-areatype="menu-panel"],
1100 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #privatebrowsing-button {
1101 -moz-image-region: rect(0px, 576px, 32px, 544px);
1104 #privatebrowsing-button[cui-areatype="menu-panel"]:hover,
1105 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #privatebrowsing-button:hover {
1106 -moz-image-region: rect(32px, 576px, 64px, 544px);
1109 #find-button[cui-areatype="menu-panel"],
1110 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #find-button {
1111 -moz-image-region: rect(0px, 640px, 32px, 608px);
1114 #find-button[cui-areatype="menu-panel"]:hover,
1115 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #find-button:hover {
1116 -moz-image-region: rect(32px, 640px, 64px, 608px);
1119 #print-button[cui-areatype="menu-panel"],
1120 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #print-button {
1121 -moz-image-region: rect(0px, 672px, 32px, 640px);
1124 #print-button[cui-areatype="menu-panel"]:hover,
1125 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #print-button:hover {
1126 -moz-image-region: rect(32px, 672px, 64px, 640px);
1129 #fullscreen-button[cui-areatype="menu-panel"],
1130 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #fullscreen-button {
1131 -moz-image-region: rect(0px, 704px, 32px, 672px);
1134 #fullscreen-button[cui-areatype="menu-panel"]:hover,
1135 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #fullscreen-button:hover {
1136 -moz-image-region: rect(32px, 704px, 64px, 672px);
1139 #developer-button[cui-areatype="menu-panel"],
1140 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #developer-button {
1141 -moz-image-region: rect(0px, 736px, 32px, 704px);
1144 #developer-button[cui-areatype="menu-panel"]:hover,
1145 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #developer-button:hover {
1146 -moz-image-region: rect(32px, 736px, 64px, 704px);
1149 #preferences-button[cui-areatype="menu-panel"],
1150 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #preferences-button {
1151 -moz-image-region: rect(0px, 768px, 32px, 736px);
1154 #preferences-button[cui-areatype="menu-panel"]:hover,
1155 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #preferences-button:hover {
1156 -moz-image-region: rect(32px, 768px, 64px, 736px);
1159 /* Wide panel control icons */
1161 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
1162 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
1163 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #edit-controls > toolbarbutton,
1164 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #zoom-controls > toolbarbutton {
1165 list-style-image: url("chrome://browser/skin/menuPanel-small.png");
1168 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button,
1169 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button {
1170 -moz-image-region: rect(0px, 32px, 16px, 16px);
1173 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button:hover:not([disabled="true"]),
1174 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button:hover:not([disabled="true"]) {
1175 -moz-image-region: rect(16px, 32px, 32px, 16px);
1178 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button[disabled="true"],
1179 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button[disabled="true"] {
1180 -moz-image-region: rect(32px, 32px, 48px, 16px);
1183 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button,
1184 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button {
1185 -moz-image-region: rect(0px, 48px, 16px, 32px);
1188 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button:hover:not([disabled="true"]),
1189 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button:hover:not([disabled="true"]) {
1190 -moz-image-region: rect(16px, 48px, 32px, 32px);
1193 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button[disabled="true"],
1194 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button[disabled="true"] {
1195 -moz-image-region: rect(32px, 48px, 48px, 32px);
1198 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button,
1199 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button {
1200 -moz-image-region: rect(0px, 64px, 16px, 48px);
1203 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button:hover:not([disabled="true"]),
1204 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button:hover:not([disabled="true"]) {
1205 -moz-image-region: rect(16px, 64px, 32px, 48px);
1208 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button[disabled="true"],
1209 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button[disabled="true"] {
1210 -moz-image-region: rect(32px, 64px, 48px, 48px);
1213 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button,
1214 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button {
1215 -moz-image-region: rect(0px, 80px, 16px, 64px);
1218 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button:hover:not([disabled="true"]),
1219 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button:hover:not([disabled="true"]) {
1220 -moz-image-region: rect(16px, 80px, 32px, 64px);
1223 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button[disabled="true"],
1224 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button[disabled="true"] {
1225 -moz-image-region: rect(32px, 80px, 48px, 64px);
1228 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button,
1229 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button {
1230 -moz-image-region: rect(0px, 96px, 16px, 80px);
1233 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button:hover:not([disabled="true"]),
1234 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button:hover:not([disabled="true"]) {
1235 -moz-image-region: rect(16px, 96px, 32px, 80px);
1238 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button[disabled="true"],
1239 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button[disabled="true"] {
1240 -moz-image-region: rect(32px, 96px, 48px, 80px);
1243 /* === END menupanel.inc.css === */
1246 list-style-image: url("chrome://browser/skin/FxToolbar.png");
1249 .toolbarbutton-1:not([type="menu-button"]) {
1250 -moz-box-orient: vertical;
1254 .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1259 .toolbarbutton-1:not([type="menu-button"]) {
1260 -moz-box-orient: vertical;
1264 .toolbarbutton-1 > .toolbarbutton-menubutton-button,
1265 .toolbarbutton-1[disabled="true"]:hover:active,
1266 .toolbarbutton-1[disabled="true"]:hover:active > .toolbarbutton-menubutton-button {
1270 .toolbarbutton-1:hover:active,
1271 .toolbarbutton-1[open="true"],
1272 .toolbarbutton-1:hover:active > .toolbarbutton-menubutton-button {
1274 padding-bottom: 0px;
1275 -moz-padding-start: 3px;
1276 -moz-padding-end: 1px;
1279 /* ::::: small primary toolbar buttons ::::: */
1282 /* force iconsize="small" on this toolbar */
1283 counter-reset: smallicons;
1286 toolbar[mode="text"] .toolbarbutton-1,
1287 toolbar[mode="icons"] .toolbarbutton-1,
1288 toolbar[iconsize="small"] .toolbarbutton-1,
1289 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1,
1290 toolbar[mode="text"] .toolbarbutton-menubutton-button,
1291 toolbar[mode="icons"] .toolbarbutton-menubutton-button,
1292 toolbar[iconsize="small"] .toolbarbutton-menubutton-button,
1293 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1298 toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker {
1300 padding-bottom: 8px;
1301 -moz-padding-start: 1px;
1302 -moz-padding-end: 1px;
1305 toolbar[mode="icons"] .toolbarbutton-menubutton-dropmarker,
1306 toolbar[iconsize="small"] .toolbarbutton-menubutton-dropmarker,
1307 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1309 padding-bottom: 13px;
1310 -moz-padding-start: 1px;
1311 -moz-padding-end: 1px;
1314 toolbar[mode="text"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
1315 toolbar[mode="text"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker {
1317 padding-bottom: 7px;
1318 -moz-padding-start: 2px;
1319 -moz-padding-end: 0px;
1322 toolbar[mode="icons"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
1323 toolbar[mode="icons"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker,
1324 toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
1325 toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker,
1326 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
1327 :-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker {
1329 padding-bottom: 12px;
1330 -moz-padding-start: 2px;
1331 -moz-padding-end: 0px;
1334 toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker[disabled="true"] {
1335 padding-top: 4px !important;
1336 padding-bottom: 8px !important;
1337 -moz-padding-start: 1px !important;
1338 -moz-padding-end: 1px !important;
1341 toolbar[mode="icons"] .toolbarbutton-menubutton-dropmarker[disabled="true"],
1342 toolbar[iconsize="small"] > .toolbarbutton-menubutton-dropmarker[disabled="true"] {
1343 padding-top: 0px !important;
1344 padding-bottom: 13px !important;
1345 -moz-padding-start: 1px !important;
1346 -moz-padding-end: 1px !important;
1349 toolbar[mode="icons"] .toolbarbutton-text,
1350 toolbar[mode="text"] .toolbarbutton-icon {
1354 toolbar[mode="text"] .toolbarbutton-text {
1358 toolbar[mode="text"] .toolbarbutton-1,
1359 toolbar[mode="text"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1360 -moz-box-orient: horizontal;
1363 toolbar[mode="full"] .toolbarbutton-1,
1364 toolbar[mode="full"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1368 #navigator-toolbox[iconsize=small] > #nav-bar {
1371 #navigator-toolbox[iconsize=large][mode=icons] > #nav-bar {
1375 /* unified back/forward button */
1379 padding: 0 !important;
1382 #forward-button > menupopup {
1383 margin-top: 1px !important;
1391 /* A number of styles use :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) - this makes it only apply pre-Australis as iconsize and palette-box or addon-bar don't exist afterwards */
1392 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #back-button {
1393 -moz-image-region: rect(0, 18px, 18px, 0);
1396 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #back-button:not([disabled="true"]):hover {
1397 -moz-image-region: rect(18px, 18px, 36px, 0);
1400 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #back-button[disabled="true"] {
1401 -moz-image-region: rect(36px, 18px, 54px, 0);
1405 -moz-margin-start: 0;
1408 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #forward-button {
1409 -moz-image-region: rect(0, 36px, 18px, 18px);
1412 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #forward-button:not([disabled="true"]):hover {
1413 -moz-image-region: rect(18px, 36px, 36px, 18px);
1416 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #forward-button[disabled="true"] {
1417 -moz-image-region: rect(36px, 36px, 54px, 18px);
1420 #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
1421 #forward-button:-moz-locale-dir(rtl),
1422 #forward-button:-moz-locale-dir(rtl) > .toolbarbutton-text {
1423 transform: scaleX(-1);
1426 #nav-bar #back-button:-moz-locale-dir(ltr) {
1427 border-top-right-radius: 0;
1428 border-bottom-right-radius: 0;
1431 #nav-bar #back-button:-moz-locale-dir(rtl),
1432 #nav-bar #forward-button {
1433 border-top-left-radius: 0;
1434 border-bottom-left-radius: 0;
1437 /* Remove selector when Australis lands - this makes it only apply post-Australis as back/forward buttons are in the urlbar-container there */
1438 #urlbar-container > #back-button,
1439 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1440 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1441 #unified-back-forward-button > #back-button {
1442 border-radius: 10000px;
1448 margin-bottom: -2px;
1450 -moz-image-region: rect(54px, 20px, 74px, 0);
1453 /* Remove selector when Australis lands - this makes it only apply post-Australis as back/forward buttons are in the urlbar-container there */
1454 #urlbar-container > #back-button[open="true"],
1455 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1456 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1457 #unified-back-forward-button > #back-button:not([disabled="true"]):hover,
1458 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1459 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1460 #unified-back-forward-button > #back-button[open="true"] {
1461 -moz-image-region: rect(54px, 40px, 74px, 20px);
1464 /* Remove selector when Australis lands - this makes it only apply post-Australis as back/forward buttons are in the urlbar-container there */
1465 #urlbar-container > #back-button[disabled="true"],
1466 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1467 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1468 #unified-back-forward-button > #back-button[disabled="true"] {
1469 -moz-image-region: rect(54px, 60px, 74px, 40px);
1472 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1473 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1474 #unified-back-forward-button > #back-button:not([disabled="true"]):not([open="true"]):not(:active):hover {
1477 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1478 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1479 #unified-back-forward-button > #back-button:not([disabled="true"]):hover:active,
1480 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1481 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1482 #unified-back-forward-button > #back-button[open="true"] {
1485 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar[currentset*="unified-back-forward-button"],
1486 #navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar:not([currentset]) {
1487 /* padding-top: 3px;
1488 padding-bottom: 5px; */
1491 #navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar[currentset*="unified-back-forward-button"],
1492 #navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar:not([currentset]) {
1493 /* padding-top: 5px; */
1496 /* Remove selector when Australis lands - this makes it only apply post-Australis as back/forward buttons are in the urlbar-container there */
1497 #urlbar-container > #forward-button,
1498 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1499 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1500 #unified-back-forward-button > #forward-button {
1501 /*mask: url(keyhole-forward-mask.svg#mask); XXX: this regresses twinopen */
1502 /*clip-path: url("chrome://browser/content/browser.xul#winstripe-keyhole-forward-clip-path"); */
1503 -moz-margin-start: -6px !important;
1510 /* Remove selector when Australis lands - this makes it only apply post-Australis as back/forward buttons are in the urlbar-container there */
1511 #urlbar-container > #forward-button:-moz-locale-dir(ltr),
1512 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1513 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1514 #unified-back-forward-button > #forward-button:-moz-locale-dir(ltr) {
1515 border-top-right-radius: 11px;
1516 border-bottom-right-radius: 11px;
1519 /* Remove selector when Australis lands - this makes it only apply post-Australis as back/forward buttons are in the urlbar-container there */
1520 #urlbar-container > #forward-button:-moz-locale-dir(rtl),
1521 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1522 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1523 #unified-back-forward-button > #forward-button:-moz-locale-dir(rtl) {
1524 border-top-left-radius: 11px;
1525 border-bottom-left-radius: 11px;
1528 .unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
1529 .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
1530 list-style-image: url("chrome://global/skin/arrow/arrow-left.gif") !important;
1533 .unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr):hover,
1534 .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl):hover {
1535 list-style-image: url("chrome://global/skin/arrow/arrow-left-hover.gif") !important;
1538 .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr),
1539 .unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl) {
1540 list-style-image: url("chrome://global/skin/arrow/arrow-right.gif") !important;
1543 .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr):hover,
1544 .unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl):hover {
1545 list-style-image: url("chrome://global/skin/arrow/arrow-right.gif") !important;
1548 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1549 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1550 #unified-back-forward-button > #forward-button {
1551 /* border-top-right-radius: 0;
1552 border-bottom-right-radius: 0;
1553 -moz-margin-end: 0; */
1556 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1557 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1558 #unified-back-forward-button:not([switchingtabs]) > #forward-button,
1559 window:not([chromehidden~="toolbar"]) #urlbar-container:not([switchingtabs]) > #forward-button {
1560 transition: opacity 150ms ease-out;
1563 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1564 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1565 #unified-back-forward-button:not(:hover) > #forward-button[disabled],
1566 window:not([chromehidden~="toolbar"]) #urlbar-container:not(:hover) > #forward-button[disabled] {
1570 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1571 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1572 #unified-back-forward-button:hover > #forward-button[disabled],
1573 window:not([chromehidden~="toolbar"]) #urlbar-container:hover > #forward-button[disabled] {
1574 background-color: transparent;
1577 /* A number of buttons use :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) - this makes it only apply pre-Australis as iconsize and the palette-box don't exist afterwards */
1578 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #stop-button {
1579 -moz-image-region: rect(0, 54px, 18px, 36px);
1582 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #stop-button:not([disabled="true"]):hover {
1583 -moz-image-region: rect(18px, 54px, 36px, 36px);
1586 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #stop-button[disabled="true"] {
1587 -moz-image-region: rect(36px, 54px, 54px, 36px);
1590 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #reload-button {
1591 -moz-image-region: rect(0, 72px, 18px, 54px);
1594 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #reload-button:not([disabled="true"]):hover {
1595 -moz-image-region: rect(18px, 72px, 36px, 54px);
1598 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #reload-button[disabled="true"] {
1599 -moz-image-region: rect(36px, 72px, 54px, 54px);
1602 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #home-button.bookmark-item {
1603 list-style-image: url("chrome://browser/skin/FxToolbar.png");
1605 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #home-button {
1606 -moz-image-region: rect(0, 90px, 18px, 72px);
1609 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #home-button:not([disabled="true"]):hover {
1610 -moz-image-region: rect(18px, 90px, 36px, 72px);
1613 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #home-button[disabled="true"] {
1614 -moz-image-region: rect(36px, 90px, 54px, 72px);
1617 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #downloads-button {
1618 -moz-image-region: rect(0, 108px, 18px, 90px);
1621 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #downloads-button:not([disabled="true"]):hover {
1622 -moz-image-region: rect(18px, 108px, 36px, 90px);
1625 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #downloads-button[disabled="true"] {
1626 -moz-image-region: rect(36px, 108px, 54px, 90px);
1629 #downloads-button > .toolbarbutton-icon {
1633 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #history-button {
1634 -moz-image-region: rect(0, 126px, 18px, 108px);
1637 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #history-button:not([disabled="true"]):hover {
1638 -moz-image-region: rect(18px, 126px, 36px, 108px);
1641 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #history-button[disabled="true"] {
1642 -moz-image-region: rect(36px, 126px, 54px, 108px);
1645 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #bookmarks-button,
1646 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #bookmarks-menu-button {
1647 list-style-image: url("chrome://browser/skin/FxToolbar.png") !important; /* for making the palette work */
1648 -moz-image-region: rect(0, 144px, 18px, 126px);
1651 #bookmarks-menu-button.bookmark-item {
1652 /* list-style-image: url("chrome://browser/skin/FxToolbar.png"); */
1655 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #bookmarks-menu-button.toolbarbutton-1 {
1656 -moz-box-orient: horizontal;
1659 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #bookmarks-button:not([disabled="true"]):hover,
1660 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #bookmarks-menu-button[open="true"],
1661 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #bookmarks-menu-button:not([disabled="true"]):hover {
1662 -moz-image-region: rect(18px, 144px, 36px, 126px);
1665 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #bookmarks-button[disabled="true"],
1666 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #bookmarks-menu-button[disabled="true"] {
1667 -moz-image-region: rect(36px, 144px, 54px, 126px);
1670 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #print-button {
1671 -moz-image-region: rect(0, 162px, 18px, 144px);
1674 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #print-button:not([disabled="true"]):hover {
1675 -moz-image-region: rect(18px, 162px, 36px, 144px);
1678 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #print-button[disabled="true"] {
1679 -moz-image-region: rect(36px, 162px, 54px, 144px);
1682 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #new-tab-button {
1683 -moz-image-region: rect(0, 180px, 18px, 162px);
1686 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #new-tab-button:not([disabled="true"]):hover {
1687 -moz-image-region: rect(18px, 180px, 36px, 162px);
1690 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #new-tab-button[disabled="true"] {
1691 -moz-image-region: rect(36px, 180px, 54px, 162px);
1694 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #new-window-button {
1695 -moz-image-region: rect(0, 198px, 18px, 180px);
1698 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #new-window-button:not([disabled="true"]):hover {
1699 -moz-image-region: rect(18px, 198px, 36px, 180px);
1702 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #new-window-button[disabled="true"] {
1703 -moz-image-region: rect(36px, 198px, 54px, 180px);
1707 -moz-image-region: rect(0, 216px, 18px, 198px);
1710 #cut-button:not([disabled="true"]):hover {
1711 -moz-image-region: rect(18px, 216px, 36px, 198px);
1714 #cut-button[disabled="true"] {
1715 -moz-image-region: rect(36px, 216px, 54px, 198px);
1719 -moz-image-region: rect(0, 234px, 18px, 216px);
1722 #copy-button:not([disabled="true"]):hover {
1723 -moz-image-region: rect(18px, 234px, 36px, 216px);
1726 #copy-button[disabled="true"] {
1727 -moz-image-region: rect(36px, 234px, 54px, 216px);
1731 -moz-image-region: rect(0, 252px, 18px, 234px);
1734 #paste-button:not([disabled="true"]):hover {
1735 -moz-image-region: rect(18px, 252px, 36px, 234px);
1738 #paste-button[disabled="true"] {
1739 -moz-image-region: rect(36px, 252px, 54px, 234px);
1742 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #fullscreen-button {
1743 -moz-image-region: rect(0, 270px, 18px, 252px);
1746 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #fullscreen-button:not([disabled="true"]):hover {
1747 -moz-image-region: rect(18px, 270px, 36px, 252px);
1750 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #fullscreen-button[disabled="true"] {
1751 -moz-image-region: rect(36px, 270px, 54px, 252px);
1755 -moz-image-region: rect(0, 288px, 18px, 270px);
1760 -moz-image-region: rect(0, 306px, 18px, 288px);
1763 #zoom-out-button:not([disabled="true"]):hover {
1764 -moz-image-region: rect(18px, 288px, 36px, 270px);
1767 #zoom-out-button[disabled="true"] {
1768 -moz-image-region: rect(36px, 288px, 54px, 270px);
1771 #zoom-in-button:not([disabled="true"]):hover {
1772 -moz-image-region: rect(18px, 306px, 36px, 288px);
1775 #zoom-in-button[disabled="true"] {
1776 -moz-image-region: rect(36px, 306px, 54px, 288px);
1779 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #sync-button:not([status]) {
1780 list-style-image: url("chrome://browser/skin/FxToolbar.png") !important; /* for making the palette work */
1781 -moz-image-region: rect(0, 324px, 18px, 306px);
1784 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #sync-button[status="active"] {
1785 list-style-image: url("chrome://browser/skin/sync-throbber.png");
1786 -moz-image-region: rect(0, 18px, 18px, 0);
1789 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #sync-button[disabled="true"] {
1790 -moz-image-region: rect(36px, 324px, 54px, 306px);
1793 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #feed-button {
1794 -moz-image-region: rect(0, 342px, 18px, 324px);
1797 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #feed-button[disabled="true"] {
1798 -moz-image-region: rect(36px, 342px, 54px, 324px);
1801 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #webrtc-status-button {
1802 -moz-image-region: rect(0, 360px, 18px, 342px);
1805 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #webrtc-status-button:not([disabled="true"]):hover,
1806 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #webrtc-status-button[open="true"] {
1807 -moz-image-region: rect(18px, 360px, 36px, 342px);
1810 :-moz-any(#palette-box, #navigator-toolbox[iconsize], #addon-bar) #webrtc-status-button[disabled="true"] {
1811 -moz-image-region: rect(36px, 360px, 54px, 342px);
1814 /* tabview button & menu item */
1818 list-style-image: url("chrome://browser/skin/tabview/tabview.png") !important;
1822 -moz-image-region: rect(0, 90px, 18px, 72px);
1825 #tabview-button[groups="0"] {
1826 -moz-image-region: rect(0, 18px, 18px, 0);
1829 #tabview-button[groups="1"] {
1830 -moz-image-region: rect(0, 36px, 18px, 18px);
1833 #tabview-button[groups="2"] {
1834 -moz-image-region: rect(0, 54px, 18px, 36px);
1837 #tabview-button[groups="3"] {
1838 -moz-image-region: rect(0, 72px, 18px, 54px);
1842 -moz-image-region: rect(1px, 89px, 17px, 73px);
1845 #menu_tabview[groups="0"] {
1846 -moz-image-region: rect(1px, 17px, 17px, 1px);
1849 #menu_tabview[groups="1"] {
1850 -moz-image-region: rect(1px, 35px, 17px, 19px);
1853 #menu_tabview[groups="2"] {
1854 -moz-image-region: rect(1px, 53px, 17px, 37px);
1857 #menu_tabview[groups="3"] {
1858 -moz-image-region: rect(1px, 71px, 17px, 55px);
1861 /* ::::: fullscreen window controls ::::: */
1864 -moz-margin-start: 4px;
1874 list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
1877 #minimize-button:hover {
1878 list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
1882 list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
1885 #restore-button:hover {
1886 list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
1890 list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
1893 #close-button:hover {
1894 list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
1897 /* ::::: Location Bar ::::: */
1900 .searchbar-textbox {
1903 -moz-margin-start: 3px;
1908 /* make color as light as possible to deal with dark non-domain parts */
1912 #urlbar:-moz-lwtheme,
1913 .searchbar-textbox:-moz-lwtheme {
1914 /* background-color: rgba(255,255,255,.8);
1915 @navbarTextboxCustomBorder@
1919 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1920 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1921 #unified-back-forward-button + #urlbar-container,
1922 window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper {
1924 -moz-margin-start: -22px;
1926 pointer-events: none;
1929 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1930 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1931 #unified-back-forward-button + #urlbar-container > #urlbar,
1932 window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar {
1933 /* -moz-border-start: none;
1935 pointer-events: all;
1938 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1939 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1940 #unified-back-forward-button:not([switchingtabs]) + #urlbar-container > #urlbar,
1941 window:not([chromehidden~="toolbar"]) #urlbar-container:not([switchingtabs]) > #urlbar-wrapper > #urlbar {
1942 transition: margin-left 150ms ease-out;
1945 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1946 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1947 #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(ltr),
1948 window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(ltr) {
1949 /* border-top-left-radius: 0;
1950 border-bottom-left-radius: 0; */
1953 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1954 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1955 #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(rtl),
1956 window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) {
1957 /* border-top-right-radius: 0;
1958 border-bottom-right-radius: 0; */
1961 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1962 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1963 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar,
1964 window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar {
1968 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1969 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1970 #unified-back-forward-button[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar,
1971 window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:hover:not([switchingtabs]) > #urlbar-wrapper > #urlbar {
1972 /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */
1973 transition-delay: 100s;
1976 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1977 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1978 #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar,
1979 window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar {
1980 /* when not hovered anymore, trigger a new transition to hide the forward button immediately */
1981 margin-left: -22.01px;
1984 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1985 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1986 #unified-back-forward-button + #urlbar-container:-moz-locale-dir(rtl),
1987 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1988 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1989 #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(rtl),
1990 window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper:-moz-locale-dir(rtl),
1991 window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) {
1992 /* let winstripe-urlbar-back-button-clip-path clip the urlbar's right side for RTL */
1993 transform: scaleX(-1);
1996 html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
1997 .searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
2001 #urlbar:-moz-lwtheme[focused="true"],
2002 .searchbar-textbox:-moz-lwtheme[focused="true"] {
2003 /* background-color: white; */
2007 -moz-box-orient: horizontal;
2008 -moz-box-align: stretch;
2011 .urlbar-textbox-container {
2012 -moz-box-align: stretch;
2016 -moz-margin-start: 0;
2021 -moz-box-align: center;
2028 .searchbar-engine-button,
2029 .search-go-container {
2033 .search-go-container > .search-go-button {
2037 .urlbar-icon:hover {
2040 .urlbar-icon[open="true"],
2041 .urlbar-icon:hover:active {
2044 #urlbar-search-splitter {
2046 -moz-margin-start: -3px;
2048 background: transparent;
2051 #urlbar-search-splitter + #urlbar-container > #urlbar,
2052 #urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox {
2053 -moz-margin-start: 0;
2057 -moz-border-end: 1px solid #9C9CFF;
2058 -moz-margin-end: 3px;
2061 -moz-margin-start: 0;
2066 min-width: calc(54px + 11ch);
2076 #notification-popup-box:not([hidden]) + #identity-box {
2077 -moz-padding-start: 10px !important;
2081 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
2082 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
2083 #unified-back-forward-button + #urlbar-container > #urlbar > #identity-box,
2084 window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar > #identity-box {
2085 /* border-radius: 0; */
2086 -moz-padding-start: 2px;
2087 -moz-padding-end: 2px;
2088 -moz-margin-end: 1px;
2091 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
2092 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
2093 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar >
2094 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr),
2095 window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar >
2096 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
2098 transition: padding-left;
2101 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
2102 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
2103 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar >
2104 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl),
2105 window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar >
2106 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
2108 transition: padding-right;
2111 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
2112 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
2113 #unified-back-forward-button[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar >
2114 #notification-popup-box[hidden] + #identity-box,
2115 window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:hover:not([switchingtabs]) > #urlbar-wrapper > #urlbar >
2116 #notification-popup-box[hidden] + #identity-box {
2117 /* forward button hiding is delayed when hovered */
2118 transition-delay: 100s;
2121 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
2122 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
2123 #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar >
2124 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr),
2125 window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar >
2126 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
2127 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
2128 padding-left: 2.01px;
2131 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
2132 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
2133 #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar >
2134 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl),
2135 window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar >
2136 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
2137 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
2138 padding-right: 2.01px;
2141 #urlbar[pageproxystate="valid"] > #identity-box.chromeUI,
2142 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
2143 -moz-margin-end: 3px;
2146 #urlbar[pageproxystate="valid"] > #identity-box.chromeUI:-moz-locale-dir(ltr),
2147 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(ltr) {
2148 border-top-right-radius: 0;
2149 border-bottom-right-radius: 0;
2152 #urlbar[pageproxystate="valid"] > #identity-box.chromeUI:-moz-locale-dir(rtl),
2153 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(rtl) {
2154 border-top-left-radius: 0;
2155 border-bottom-left-radius: 0;
2158 #identity-box.verifiedIdentity:not(:-moz-lwtheme) {
2159 background-color: #000000;
2162 #identity-box:-moz-focusring {
2163 outline: 1px dotted #008484;
2164 outline-offset: -1px;
2167 #identity-box.verifiedDomain:-moz-focusring,
2168 #identity-box.verifiedIdentity:-moz-focusring {
2169 outline-color: #000000;
2172 #identity-icon-labels {
2173 -moz-margin-start: 1px;
2174 -moz-margin-end: 3px;
2177 /* Location bar dropmarker */
2179 .urlbar-history-dropmarker:not(:hover):not([open="true"]) {
2180 background-color: transparent;
2183 #urlbar-container[combined="true"] > #urlbar > .urlbar-history-dropmarker,
2184 #urlbar-wrapper > #urlbar > .urlbar-history-dropmarker {
2189 .urlbar-history-dropmarker:hover {
2192 .urlbar-history-dropmarker:hover:active,
2193 .urlbar-history-dropmarker[open="true"] {
2196 /* page proxy icon */
2198 /* === BEGIN identity-block.inc.css === */
2200 #urlbar[pageproxystate="valid"] > #identity-box.chromeUI {
2201 /* Default theme does different color per channel, we can't as they do it build-time. */
2203 -moz-border-end: 1px solid #9C9CFF;
2206 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
2208 -moz-border-end: 1px solid #008484;
2211 #urlbar[pageproxystate="valid"] > #identity-box.chromeUI,
2212 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
2213 background-position: right;
2214 background-size: 1px;
2215 background-repeat: no-repeat;
2218 /* page proxy icon */
2220 #page-proxy-favicon {
2223 list-style-image: url("chrome://browser/skin/identity-icons-generic.png");
2227 .chromeUI > #page-proxy-favicon[pageproxystate="valid"] {
2228 list-style-image: url("chrome://branding/content/identity-icons-brand.png");
2231 .verifiedDomain > #page-proxy-favicon[pageproxystate="valid"] {
2232 list-style-image: url("chrome://browser/skin/identity-icons-https.png");
2235 .verifiedIdentity > #page-proxy-favicon[pageproxystate="valid"] {
2236 list-style-image: url("chrome://browser/skin/identity-icons-https-ev.png");
2239 .mixedActiveContent > #page-proxy-favicon[pageproxystate="valid"] {
2240 list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-active.png");
2243 .mixedDisplayContent > #page-proxy-favicon[pageproxystate="valid"] {
2244 list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-display.png");
2247 .mixedDisplayContentLoadedActiveBlocked > #page-proxy-favicon[pageproxystate="valid"] {
2248 list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-display.png");
2251 #page-proxy-favicon[pageproxystate="invalid"] {
2255 #identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon {
2256 list-style-image: url("chrome://branding/content/icon64.png");
2259 #identity-popup-brandName {
2263 margin-bottom: .5em;
2266 #identity-popup-content-box {
2270 /* === END identity-block.inc.css === */
2272 #page-proxy-favicon {
2273 -moz-image-region: rect(0, 16px, 16px, 0);
2276 #identity-box:hover > #page-proxy-favicon {
2277 -moz-image-region: rect(0, 32px, 16px, 16px);
2280 #identity-box:hover:active > #page-proxy-favicon,
2281 #identity-box[open=true] > #page-proxy-favicon {
2282 -moz-image-region: rect(0, 48px, 16px, 32px);
2285 #identity-box:hover {
2286 background-color: #FFCF00;
2290 #identity-box:hover:active,
2291 #identity-box[open=true] {
2292 background-color: #FF9F00;
2296 #urlbar[pageproxystate="valid"] > #identity-box.chromeUI:hover,
2297 #urlbar[pageproxystate="valid"] > #identity-box.chromeUI:hover:active,
2298 #urlbar[pageproxystate="valid"] > #identity-box.chromeUI[open=true] {
2299 background-color: #9C9CFF;
2303 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover,
2304 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover:active,
2305 #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity[open=true] {
2306 background-color: #008484;
2312 #treecolAutoCompleteImage {
2316 .ac-result-type-bookmark,
2317 .autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
2318 list-style-image: url("chrome://browser/skin/places/bookmark.png");
2319 -moz-image-region: rect(0px 16px 16px 0px);
2324 .ac-result-type-keyword,
2325 .autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) {
2326 list-style-image: url("chrome://global/skin/icons/Search-glass.png");
2327 -moz-image-region: rect(0px 32px 16px 16px);
2332 .ac-result-type-tag,
2333 .autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
2334 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
2343 .ac-extra > .ac-comment {
2352 richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
2353 list-style-image: url("chrome://browser/skin/actionicon-tab.png");
2354 -moz-image-region: rect(0, 16px, 16px, 0);
2358 richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
2359 -moz-image-region: rect(16px, 16px, 32px, 0);
2362 .autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
2366 .ac-comment[selected="true"],
2367 .ac-url-text[selected="true"],
2368 .ac-action-text[selected="true"] {
2369 color: inherit !important;
2372 .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
2373 .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
2379 .autocomplete-treebody::-moz-tree-cell(suggesthint) {
2380 border-top: 1px solid #9C9CFF;
2383 /* combined go/reload/stop button in location bar */
2386 #urlbar > toolbarbutton {
2387 list-style-image: url("chrome://browser/skin/reload-stop-go.png");
2389 -moz-margin-start: 0;
2391 background-origin: border-box;
2393 -moz-border-start: 1px solid #9C9CFF;
2400 #urlbar:-moz-locale-dir(ltr) > toolbarbutton {
2401 border-top-left-radius: 0px;
2402 border-bottom-left-radius: 0px;
2405 #urlbar:-moz-locale-dir(rtl) > toolbarbutton {
2406 border-top-right-radius: 0px;
2407 border-bottom-right-radius: 0px;
2410 #urlbar > toolbarbutton:not([disabled]):active:hover,
2411 #urlbar-reload-button:not(:hover) {
2412 -moz-border-start-style: none;
2413 -moz-padding-start: 3px;
2416 #urlbar > toolbarbutton:not([disabled]):active:hover {
2420 -moz-image-region: rect(0, 42px, 14px, 28px);
2423 #go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
2424 #urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
2425 transform: scaleX(-1);
2428 #urlbar-go-button:hover,
2430 -moz-image-region: rect(14px, 42px, 28px, 28px);
2433 #urlbar-reload-button {
2434 -moz-image-region: rect(0px, 14px, 14px, 0px);
2437 #urlbar-reload-button[disabled] {
2438 -moz-image-region: rect(28px, 14px, 42px, 0px);
2441 #urlbar-reload-button:not([disabled]):hover {
2442 -moz-image-region: rect(14px, 14px, 28px, 0px);
2445 #urlbar-stop-button {
2446 -moz-image-region: rect(0px, 28px, 14px, 14px);
2449 #urlbar-stop-button:hover {
2450 -moz-image-region: rect(14px, 28px, 28px, 14px);
2453 /* popup blocker button */
2455 #page-report-button {
2456 list-style-image: url("chrome://browser/skin/urlbar-popup-blocked.png");
2457 -moz-image-region: rect(0, 16px, 16px, 0);
2460 #page-report-button:hover ,
2461 #page-report-button:hover:active,
2462 #page-report-button[open="true"] {
2463 -moz-image-region: rect(0, 32px, 16px, 16px);
2466 /* social share panel */
2468 #social-share-panel > iframe {
2469 /* background: linear-gradient(to bottom, #f0f4f7, #fafbfc);*/
2474 #social-share-button {
2475 list-style-image: url("chrome://browser/skin/social/share-button.png");
2476 -moz-image-region: rect(0, 16px, 16px, 0);
2479 .social-share-toolbar {
2480 border-right: 1px solid #9C9CFF;
2481 /* background-color: #000000; */
2484 #social-share-provider-buttons {
2488 #social-share-provider-buttons > .share-provider-button {
2489 -moz-appearance: none;
2497 #social-share-provider-buttons > .share-provider-button[checked="true"]:not([disabled="true"]),
2498 #social-share-provider-buttons > .share-provider-button:hover,
2499 #social-share-provider-buttons > .share-provider-button:active {
2503 #social-share-provider-buttons > .share-provider-button[checked="true"]:not([disabled="true"]) {
2506 #social-share-provider-buttons > .share-provider-button > .toolbarbutton-text {
2509 #social-share-provider-buttons > .share-provider-button > .toolbarbutton-icon {
2515 toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
2522 /* fixup corners for share panel */
2523 .social-panel > .social-panel-frame {
2524 border-radius: inherit;
2527 #social-share-panel {
2534 .social-share-frame {
2535 /* background: linear-gradient(to bottom, #f0f4f7, #fafbfc); */
2538 /* we resize our panels dynamically, make it look nice */
2539 transition: height 100ms ease-out, width 100ms ease-out;
2542 .social-share-frame:-moz-locale-dir(ltr) {
2543 border-top-left-radius: 0;
2544 border-bottom-left-radius: 0;
2545 border-top-right-radius: inherit;
2546 border-bottom-right-radius: inherit;
2549 .social-share-frame:-moz-locale-dir(rtl) {
2550 border-top-left-radius: inherit;
2551 border-bottom-left-radius: inherit;
2552 border-top-right-radius: 0;
2553 border-bottom-right-radius: 0;
2556 #social-share-panel > .social-share-toolbar:-moz-locale-dir(ltr) {
2557 border-top-left-radius: inherit;
2558 border-bottom-left-radius: inherit;
2561 #social-share-panel > .social-share-toolbar:-moz-locale-dir(rtl) {
2562 border-top-right-radius: inherit;
2563 border-bottom-right-radius: inherit;
2566 #social-share-provider-buttons:-moz-locale-dir(ltr) {
2567 border-top-left-radius: inherit;
2568 border-bottom-left-radius: inherit;
2571 #social-share-provider-buttons:-moz-locale-dir(rtl) {
2572 border-top-right-radius: inherit;
2573 border-bottom-right-radius: inherit;
2576 /* social recommending panel */
2578 #social-mark-button {
2579 -moz-image-region: rect(0, 16px, 16px, 0);
2584 /* #urlbar-container only directly contains the urlbar pre-Australis, don't assign an icon in Australis */
2585 #urlbar-container > #urlbar > #urlbar-icons > #star-button {
2586 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark.png");
2587 -moz-image-region: rect(16px 16px 32px 0px);
2590 #urlbar-container > #urlbar > #urlbar-icons > #star-button:hover {
2591 -moz-image-region: rect(16px 32px 32px 16px);
2594 #urlbar-container > #urlbar > #urlbar-icons > #star-button:hover:active {
2595 -moz-image-region: rect(16px 48px 32px 32px);
2598 #urlbar-container > #urlbar > #urlbar-icons > #star-button[starred="true"] {
2599 -moz-image-region: rect(0px 16px 16px 0px);
2602 #urlbar-container > #urlbar > #urlbar-icons > #star-button[starred="true"]:hover {
2603 -moz-image-region: rect(0px 32px 16px 16px);
2606 #urlbar-container > #urlbar > #urlbar-icons > #star-button[starred="true"]:hover:active {
2607 -moz-image-region: rect(0px 48px 16px 32px);
2610 /* bookmarking panel */
2611 #editBookmarkPanelStarIcon {
2612 list-style-image: url("chrome://browser/skin/places/starred48.png");
2617 #editBookmarkPanelStarIcon[unstarred] {
2618 list-style-image: url("chrome://browser/skin/places/unstarred48.png");
2621 #editBookmarkPanelTitle {
2625 #editBookmarkPanelHeader,
2626 #editBookmarkPanelContent {
2627 margin-bottom: .5em;
2630 /* Implements editBookmarkPanel resizing on folderTree un-collapse. */
2631 #editBMPanel_folderTree {
2636 margin: 5px -6px -6px;
2638 border-top: 1px solid #9C9CFF;
2639 border-bottom-left-radius: 5px;
2640 border-bottom-right-radius: 5px;
2644 list-style-image: url("chrome://browser/skin/sync-notification-24.png");
2645 -moz-margin-end: 10px;
2646 vertical-align: middle;
2649 .panel-promo-closebutton {
2650 list-style-image: url("chrome://global/skin/icons/close-button.gif");
2651 -moz-margin-end: -3px;
2655 .panel-promo-closebutton:hover {
2656 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2659 .panel-promo-closebutton:hover:active {
2660 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2663 .panel-promo-closebutton > .toolbarbutton-text {
2668 /* ::::: content area ::::: */
2671 background-color: Window;
2675 -moz-padding-start: 0px;
2678 .browserContainer > findbar {
2680 background-color: -moz-dialog;
2681 color: -moz-DialogText;
2685 /* ::::: throbber ::::: */
2687 #navigator-throbber {
2693 #navigator-throbber[busy="true"] {
2694 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
2697 #navigator-throbber,
2698 #wrapper-navigator-throbber > #navigator-throbber {
2699 list-style-image: url("chrome://communicator/skin/brand/throbber16-single.png");
2704 /* Remove selector when Australis lands - this makes it only apply post-Australis as iconsize doesn't exist there */
2705 #navigator-toolbox:not([iconsize]) > #TabsToolbar,
2709 -moz-binding: url("chrome://global/content/bindings/toolbar.xml#toolbar");
2712 #TabsToolbar .toolbar-holder {
2713 background-color: #000000; /* correct effect of being an actual toolbar */
2716 #main-window[disablechrome] #TabsToolbar,
2717 #TabsToolbar[tabsontop="false"] {
2718 border-bottom: 1px solid #008484;
2721 /* === BEGIN tabs.inc.css === */
2724 .tabs-newtab-button,
2725 #TabsToolbar > #new-tab-button {
2730 padding: 1px 4px 2px;
2733 .tabbrowser-tab:first-of-type {
2734 -moz-margin-start: 2px;
2737 .tabs-newtab-button,
2738 #TabsToolbar > #new-tab-button {
2739 border-radius: 8px 8px 0px 0px;
2740 -moz-margin-start: 0;
2743 .tabs-newtab-button:not(:hover),
2744 #TabsToolbar > #new-tab-button:not(:hover) {
2745 background-color: #C09070;
2748 .tabbrowser-tab[remote] {
2749 text-decoration: underline;
2754 .tabbrowser-tab[selected="true"] {
2757 /* End selected tab */
2761 .tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) {
2762 background-color: #E7ADE7;
2764 .tabbrowser-tab[pinned][titlechanged]:not([selected="true"]):hover {
2765 background-color: #3333FF;
2769 /* New tab button */
2771 .tabs-newtab-button {
2775 #TabsToolbar > #new-tab-button {
2779 /* === END tabs.inc.css === */
2785 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
2786 -moz-image-region: auto;
2787 -moz-margin-end: 3px;
2791 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim-connect.png");
2794 .tab-throbber[progress] {
2795 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
2798 .tab-throbber[pinned],
2799 .tab-icon-image[pinned] {
2800 -moz-margin-start: 2px;
2801 -moz-margin-end: 2px;
2804 /* tabbrowser-tab focus ring */
2805 .tabbrowser-tab:focus > .tab-stack {
2806 outline: 1px dotted;
2809 /* Tab DnD indicator */
2810 .tab-drop-indicator {
2811 list-style-image: url("chrome://browser/skin/tabbrowser/tabDragIndicator.png");
2812 margin-bottom: -11px;
2815 /* Tab close button */
2820 list-style-image: url("chrome://global/skin/icons/close-button.gif");
2823 .tab-close-button:hover,
2824 .tab-close-button:hover[selected="true"] {
2825 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2828 .tab-close-button:hover:active,
2829 .tab-close-button:hover:active[selected="true"] {
2830 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2833 /* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */
2835 .tabbrowser-arrowscrollbox > .scrollbutton-up,
2836 .tabbrowser-arrowscrollbox > .scrollbutton-down {
2842 .tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
2843 background-color: #008484;
2846 .tabs-newtab-button > .toolbarbutton-icon {
2848 margin-bottom: -1px;
2851 .tabs-newtab-button,
2852 #TabsToolbar > #new-tab-button,
2853 #TabsToolbar > toolbarpaletteitem > #new-tab-button {
2854 list-style-image: url("chrome://browser/skin/tabbrowser/newtab.png");
2855 -moz-image-region: rect(0, 16px, 18px, 0);
2858 /* Remove |#navigator-toolbox:not([iconsize])| selector when Australis lands - this makes it only apply post-Australis as iconsize doesn't exist there */
2859 .tabs-newtab-button,
2860 .tabs-newtab-button:hover,
2861 #navigator-toolbox:not([iconsize]) #TabsToolbar > #new-tab-button,
2862 #navigator-toolbox:not([iconsize]) #TabsToolbar > #new-tab-button:hover,
2863 #TabsToolbar > #new-tab-button:hover {
2864 -moz-image-region: rect(0, 32px, 18px, 16px);
2868 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
2871 #alltabs-button > .toolbarbutton-menu-dropmarker {
2875 #alltabs-button:hover,
2876 #alltabs-button:hover:active,
2877 #alltabs-button[open="true"] {
2878 list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
2881 /* All tabs menupopup */
2882 .alltabs-item > .menu-iconic-left > .menu-iconic-icon {
2883 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
2884 -moz-image-region: auto;
2887 .alltabs-item[selected="true"] {
2891 .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon {
2892 list-style-image: url("chrome://global/skin/icons/loading.gif");
2895 .alltabs-item[tabIsVisible]:not([_moz-menuactive="true"]) {
2896 background-color: #402800;
2899 /* Tabstrip close button */
2904 list-style-image: url("chrome://global/skin/icons/close-button.gif");
2907 .tabs-closebutton > .toolbarbutton-icon {
2910 .tabs-closebutton > .toolbarbutton-text {
2914 .tabs-closebutton:hover,
2915 .tabs-closebutton:hover:active {
2916 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2919 toolbarbutton.chevron {
2920 list-style-image: url("chrome://global/skin/toolbar/chevron.gif") !important;
2923 toolbarbutton.chevron:hover {
2924 list-style-image: url("chrome://global/skin/toolbar/chevron-hover.gif") !important;
2927 toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon,
2928 toolbarbutton.chevron:-moz-locale-dir(rtl):hover > .toolbarbutton-icon {
2929 transform: scaleX(-1);
2932 toolbarbutton.chevron > .toolbarbutton-text,
2933 toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
2937 toolbarbutton.chevron > .toolbarbutton-icon {
2941 toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
2942 display: -moz-box; /* display chevron icon in text mode */
2945 #sidebar-throbber[loading="true"] {
2946 list-style-image: url("chrome://global/skin/icons/loading.gif");
2947 -moz-margin-end: 4px;
2950 /* Bookmarks toolbar */
2951 #PlacesToolbarDropIndicator {
2952 list-style-image: url("chrome://communicator/skin/bookmarks/toolbarDropMarker.png");
2955 toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2956 background-color: #008484 !important;
2957 color: #FFCF00 !important;
2960 /* rules for menupopup drop indicators */
2961 .menupopup-drop-indicator-bar {
2963 /* these two margins must together compensate the indicator's height */
2965 margin-bottom: -1px;
2968 .menupopup-drop-indicator {
2969 list-style-image: none;
2971 -moz-margin-end: -4em;
2972 background-color: #008484;
2975 /* ::::: Identity Indicator Styling ::::: */
2978 #identity-popup-icon {
2982 list-style-image: url("chrome://browser/skin/identity.png");
2983 -moz-image-region: rect(0px, 64px, 64px, 0px);
2986 #identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
2987 -moz-image-region: rect(64px, 64px, 128px, 0px);
2990 #identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
2991 -moz-image-region: rect(128px, 64px, 192px, 0px);
2994 /* Popup Body Text */
2995 .identity-popup-description {
2996 white-space: pre-wrap;
2997 -moz-padding-start: 15px;
3001 .identity-popup-label {
3002 white-space: pre-wrap;
3003 -moz-padding-start: 15px;
3007 #identity-popup-content-host,
3008 #identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner {
3012 #identity-popup-content-host {
3019 #identity-popup-content-owner {
3021 margin-bottom: 0 !important;
3026 .verifiedDomain > #identity-popup-content-owner {
3027 font-weight: normal;
3030 #identity-popup-content-verifier {
3034 #identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
3035 #identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
3037 -moz-margin-start: -24px;
3040 #identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
3041 #identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
3042 list-style-image: url("chrome://browser/skin/Secure24.png");
3045 #identity-popup-help-icon {
3047 margin: 7px 0 0 -3px;
3050 list-style-image: url("chrome://global/skin/icons/question-16.png");
3054 #identity-popup-help-icon > .button-box > .button-text {
3058 #identity-popup-help-icon > .button-box > .button-icon {
3063 #identity-popup-more-info-button {
3069 #identity-popup > .panel-arrowcontainer > .panel-arrowcontent {
3073 #identity-popup-container {
3078 #identity-popup-button-container {
3079 /* background: linear-gradient(to bottom, rgba(0,0,0,0.04) 60%, transparent);*/
3084 .popup-notification-icon {
3087 -moz-margin-end: 10px;
3090 .popup-notification-icon[popupid="geolocation"] {
3091 list-style-image: url("chrome://browser/skin/Geolocation-64.png");
3094 .popup-notification-icon[popupid="xpinstall-disabled"],
3095 .popup-notification-icon[popupid="addon-progress"],
3096 .popup-notification-icon[popupid="addon-install-cancelled"],
3097 .popup-notification-icon[popupid="addon-install-blocked"],
3098 .popup-notification-icon[popupid="addon-install-failed"],
3099 .popup-notification-icon[popupid="addon-install-complete"] {
3100 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
3105 .popup-notification-icon[popupid="click-to-play-plugins"] {
3106 list-style-image: url("chrome://mozapps/skin/plugins/pluginBlocked-64.png");
3109 .popup-notification-icon[popupid="plugins-not-found"] {
3110 list-style-image: url("chrome://browser/skin/pluginInstall-64.png");
3113 .popup-notification-icon[popupid="web-notifications"] {
3114 list-style-image: url("chrome://browser/skin/notification-64.png");
3117 .addon-progress-description {
3122 .popup-progress-label,
3123 .popup-progress-meter {
3124 -moz-margin-start: 0;
3128 .popup-progress-cancel {
3129 -moz-appearance: none;
3130 background: transparent;
3136 list-style-image: url("chrome://mozapps/skin/downloads/downloadButtons.png");
3137 -moz-image-region: rect(0px, 32px, 16px, 16px);
3140 .popup-progress-cancel:hover {
3141 -moz-image-region: rect(16px, 32px, 32px, 16px);
3144 .popup-progress-cancel:active {
3145 -moz-image-region: rect(32px, 32px, 48px, 16px);
3148 .popup-notification-icon[popupid="indexedDB-permissions-prompt"],
3149 .popup-notification-icon[popupid="indexedDB-quota-prompt"],
3150 .popup-notification-icon[popupid*="offline-app-requested"],
3151 .popup-notification-icon[popupid="offline-app-usage"] {
3152 list-style-image: url("chrome://global/skin/icons/alert-question.gif");
3155 .popup-notification-icon[popupid="password-save"],
3156 .popup-notification-icon[popupid="password-change"] {
3157 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-64.png");
3160 .popup-notification-icon[popupid="webapps-install-progress"],
3161 .popup-notification-icon[popupid="webapps-install"] {
3162 list-style-image: url("chrome://global/skin/icons/webapps-64.png");
3165 .popup-notification-icon[popupid="mixed-content-blocked"] {
3166 list-style-image: url("chrome://browser/skin/mixed-content-blocked-64.png");
3169 .popup-notification-icon[popupid="webRTC-sharingDevices"],
3170 .popup-notification-icon[popupid="webRTC-shareDevices"] {
3171 list-style-image: url("chrome://browser/skin/webRTC-shareDevice-64.png");
3174 .popup-notification-icon[popupid="pointerLock"] {
3175 list-style-image: url("chrome://browser/skin/pointerLock-64.png");
3178 /* Notification icon box */
3179 #notification-popup-box {
3181 background-color: #000000;
3182 background-clip: padding-box;
3185 border-radius: 3px 0 0 3px;
3186 border-image: url("chrome://browser/skin/urlbar-arrow.png") 0 8 0 0 / 0 8px 0 0;
3187 -moz-margin-end: -8px;
3188 border-right-width: 8px;
3191 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
3192 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
3193 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box {
3194 /* padding-left: 5px; */
3197 #notification-popup-box:-moz-locale-dir(rtl),
3198 .notification-anchor-icon:-moz-locale-dir(rtl) {
3199 transform: scaleX(-1);
3202 .notification-anchor-icon {
3208 .notification-anchor-icon:-moz-focusring {
3209 outline: 1px dotted #008484;
3210 /* outline-offset: -3px; */
3213 .default-notification-icon,
3214 #default-notification-icon {
3215 list-style-image: url("chrome://global/skin/icons/information-16.png");
3218 .identity-notification-icon,
3219 #identity-notification-icon {
3220 list-style-image: url("chrome://mozapps/skin/profile/profileicon.png");
3223 .geo-notification-icon,
3224 #geo-notification-icon {
3225 list-style-image: url("chrome://browser/skin/Geolocation-16.png");
3228 #addons-notification-icon {
3229 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
3232 .indexedDB-notification-icon,
3233 #indexedDB-notification-icon {
3234 list-style-image: url("chrome://global/skin/icons/question-16.png");
3237 #password-notification-icon {
3238 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-16.png");
3241 #webapps-notification-icon {
3242 list-style-image: url("chrome://gobal/skin/icons/webapps-16.png");
3245 #plugins-notification-icon {
3246 list-style-image: url("chrome://browser/skin/notification-pluginNormal.png");
3249 #plugins-notification-icon.plugin-hidden {
3250 list-style-image: url("chrome://browser/skin/notification-pluginAlert.png");
3253 #plugins-notification-icon.plugin-blocked {
3254 list-style-image: url("chrome://browser/skin/notification-pluginBlocked.png");
3257 #plugins-notification-icon {
3258 /* -moz-image-region: rect(0, 16px, 16px, 0);*/
3261 #plugins-notification-icon:hover {
3262 /* -moz-image-region: rect(0, 32px, 16px, 16px);*/
3265 #plugin-install-notification-icon {
3266 list-style-image: url("chrome://browser/skin/pluginInstall-16.png");
3269 #notification-popup-box[hidden] {
3270 /* Override display:none to make the pluginBlockedNotification animation work
3271 when showing the notification repeatedly. */
3273 visibility: collapse;
3276 #plugins-notification-icon.plugin-blocked[showing] {
3277 animation: pluginBlockedNotification 500ms ease 0s 5 alternate both;
3280 @keyframes pluginBlockedNotification {
3289 .mixed-content-blocked-notification-icon,
3290 #mixed-content-blocked-notification-icon {
3291 list-style-image: url("chrome://browser/skin/mixed-content-blocked-16.png");
3294 .webRTC-shareDevices-notification-icon,
3295 #webRTC-shareDevices-notification-icon {
3296 list-style-image: url("chrome://browser/skin/webRTC-shareDevice-16.png");
3299 .webRTC-sharingDevices-notification-icon,
3300 #webRTC-sharingDevices-notification-icon {
3301 list-style-image: url("chrome://browser/skin/webRTC-sharingDevice-16.png");
3304 .web-notifications-notification-icon,
3305 #web-notifications-notification-icon {
3306 list-style-image: url("chrome://browser/skin/notification-16.png");
3309 #pointerLock-notification-icon {
3310 list-style-image: url("chrome://browser/skin/pointerLock-16.png");
3312 #pointerLock-cancel {
3317 list-style-image: url("chrome://browser/skin/FxToolbar.png");
3318 -moz-image-region: rect(0, 108px, 18px, 90px);
3321 /* Bookmarks roots menu-items */
3322 #appmenu_subscribeToPage:not([disabled]),
3323 #appmenu_subscribeToPageMenu,
3324 #subscribeToPageMenuitem:not([disabled]),
3325 #subscribeToPageMenupopup,
3326 #BMB_subscribeToPageMenuitem:not([disabled]),
3327 #BMB_subscribeToPageMenupopup {
3328 list-style-image: url("chrome://browser/skin/feeds/feedIcon16.png");
3331 #bookmarksToolbarFolderMenu,
3332 #appmenu_bookmarksToolbar,
3333 #BMB_bookmarksToolbar {
3334 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png");
3335 -moz-image-region: auto;
3338 #appmenu_unsortedBookmarks,
3339 #BMB_unsortedBookmarks {
3340 list-style-image: url("chrome://communicator/skin/bookmarks/unsortedBookmarks.png");
3341 -moz-image-region: auto;
3344 /* ::::: Keyboard UI Panel ::::: */
3349 border-radius: 20px;
3352 .KUI-panel[level="top"] {
3353 /*background-color: rgba(27%,27%,27%,.65);*/
3359 padding: 20px 10px 10px;
3363 .ctrlTab-favicon[src] {
3364 background-color: #000000;
3370 .ctrlTab-preview-inner > .tabPreview-canvas {
3373 .ctrlTab-preview:not(#ctrlTab-showAll) > * > .ctrlTab-preview-inner > .tabPreview-canvas {
3377 .ctrlTab-preview-inner {
3378 padding-bottom: 10px;
3381 #ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
3383 background-color: #000000;
3384 border-radius: .5em;
3387 .ctrlTab-preview:focus > * > .ctrlTab-preview-inner {
3389 background-color: #000000;
3392 border: 2px solid #9C9CFF;
3393 border-radius: .5em;
3396 .ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
3397 margin: -10px -10px 0;
3408 border-top: 3px solid #000000;
3409 border-bottom-width: 0;
3412 #addon-bar .toolbar-holder {
3413 background-color: #8050B0;
3417 #addon-bar .toolbar-holder {
3418 background-color: #8050B0;
3422 #addon-bar .toolbar-startcap,
3423 #addon-bar .toolbar-endcap{
3424 background-color: #6000CF;
3428 -moz-binding: url("chrome://global/content/bindings/general.xml#statusbar");
3433 #addon-bar[customizing] > #status-bar {
3435 /* background-image: -moz-repeating-linear-gradient(-45deg,
3436 rgba(255,255,255,.3), rgba(255,255,255,.3) 5px,
3437 rgba(0,0,0,.3) 5px, rgba(0,0,0,.3) 10px);*/
3440 /* Remove all borders from statusbarpanel children of
3442 #status-bar > statusbarpanel {
3446 #addonbar-closebutton {
3449 list-style-image: url("chrome://global/skin/icons/close-button.gif");
3452 #addonbar-closebutton:hover,
3453 #addonbar-closebutton:hover:active {
3454 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
3459 .statuspanel-label {
3462 background: #404000;
3463 border: 1px none #9C9CFF;
3464 border-top-style: solid;
3469 .statuspanel-label:-moz-locale-dir(ltr):not([mirror]),
3470 .statuspanel-label:-moz-locale-dir(rtl)[mirror] {
3471 border-right-style: solid;
3472 border-top-right-radius: .3em;
3476 .statuspanel-label:-moz-locale-dir(rtl):not([mirror]),
3477 .statuspanel-label:-moz-locale-dir(ltr)[mirror] {
3478 border-left-style: solid;
3479 border-top-left-radius: .3em;
3483 /* HACK to abolish devily color on main content */
3486 background-color: transparent !important;
3489 /* === BEGIN highlighter.inc.css === */
3493 .highlighter-outline {
3494 box-shadow: 0 0 0 1px black;
3495 outline: 1px dashed #A09090;
3498 .highlighter-outline[locked] {
3499 box-shadow: 0 0 0 1px rgba(0,0,0,0.3);
3500 outline-color: rgba(255,255,255,0.7);
3503 /* Highlighter - Node Infobar */
3505 .highlighter-nodeinfobar {
3508 background-color: #000000;
3509 background-clip: padding-box;
3510 border: 1px solid #008484;
3512 /* Avoid cases where the infobar is smaller than the arrow, when the text is
3517 /* Highlighter - Node Infobar - text */
3519 .highlighter-nodeinfobar-text {
3520 /* 100% - size of the buttons and margins */
3521 max-width: calc(100% - 2 * (26px + 6px));
3522 padding-bottom: 1px;
3525 html|*.highlighter-nodeinfobar-tagname {
3529 html|*.highlighter-nodeinfobar-id {
3533 html|*.highlighter-nodeinfobar-pseudo-classes {
3537 /* Highlighter - Node Infobar - buttons */
3539 .highlighter-nodeinfobar-button {
3545 .highlighter-nodeinfobar-inspectbutton {
3546 list-style-image: url("chrome://browser/skin/devtools/inspect-button.png");
3547 -moz-image-region: rect(0px 16px 16px 0px);
3548 -moz-margin-start: 0px;
3549 -moz-margin-end: 2px;
3552 .highlighter-nodeinfobar-inspectbutton:hover,
3553 .highlighter-nodeinfobar-inspectbutton:hover:active/*,
3554 .highlighter-nodeinfobar-container:not([locked]) > .highlighter-nodeinfobar > .highlighter-nodeinfobar-inspectbutton*/ {
3555 -moz-image-region: rect(0px 32px 16px 16px);
3558 .highlighter-nodeinfobar-menu {
3561 .highlighter-nodeinfobar-menu > .toolbarbutton-menu-dropmarker {
3562 -moz-box-align: center;
3563 -moz-margin-start: -1px;
3566 /* Highlighter - Node Infobar - box & arrow */
3568 .highlighter-nodeinfobar-arrow {
3571 -moz-margin-start: calc(50% - 7px);
3572 transform: rotate(-45deg);
3573 background-clip: padding-box;
3574 background-repeat: no-repeat;
3577 .highlighter-nodeinfobar-arrow-top {
3578 margin-bottom: -8px;
3580 background-image: linear-gradient(to bottom left, transparent 50%, rgb(0, 132, 132) 50%);
3583 .highlighter-nodeinfobar-arrow-bottom {
3586 background-image: linear-gradient(to top right, transparent 50%, rgb(0, 132, 132) 50%);
3589 .highlighter-nodeinfobar-container[hide-arrow] > .highlighter-nodeinfobar {
3593 /* === END highlighter.inc.css === */
3595 #full-screen-warning-message {
3596 background-color: #000000;
3601 box-shadow: 0 0 2px #9C9CFF;
3604 #full-screen-warning-container[obscure-browser] {
3605 background-color: rgba(0,0,0,0.3);
3608 .full-screen-description {
3612 #full-screen-domain-text {
3616 .full-screen-approval-button,
3617 #full-screen-remember-decision {
3621 /* === BEGIN commandline.inc.css === */
3623 /* Developer toolbar */
3625 #developer-toolbar {
3626 border-top: 3px solid #000000;
3627 border-bottom: none;
3630 #developer-toolbar .toolbar-holder {
3631 background-color: #8050B0;
3635 #developer-toolbar .toolbar-holder {
3636 background-color: #8050B0;
3640 #developer-toolbar .toolbar-startcap,
3641 #developer-toolbar .toolbar-endcap{
3642 background-color: #6000CF;
3645 #developer-toolbar {
3647 min-height: 32px; */
3650 #developer-toolbar > toolbarbutton {
3656 .developer-toolbar-button > image {
3657 /* margin: auto 10px; */
3660 #developer-toolbar-toolbox-button > label {
3664 #developer-toolbar-toolbox-button {
3665 list-style-image: url("chrome://browser/skin/devtools/toggle-tools.png");
3666 -moz-image-region: rect(0px, 16px, 16px, 0px);
3669 #developer-toolbar-toolbox-button > label {
3673 #developer-toolbar-toolbox-button:hover,
3674 #developer-toolbar-toolbox-button:hover:active,
3675 #developer-toolbar-toolbox-button[checked=true] {
3676 -moz-image-region: rect(0px, 32px, 16px, 16px);
3679 #developer-toolbar-closebutton {
3680 list-style-image: url("chrome://browser/skin/devtools/close.png");
3681 -moz-image-region: rect(0px, 16px, 16px, 0px);
3686 #developer-toolbar-closebutton > .toolbarbutton-icon {
3689 #developer-toolbar-closebutton > .toolbarbutton-text {
3693 #developer-toolbar-closebutton:hover,
3694 #developer-toolbar-closebutton:hover:active {
3695 -moz-image-region: rect(0px, 32px, 16px, 16px);
3700 html|*#gcli-tooltip-frame,
3701 html|*#gcli-output-frame {
3704 background-color: transparent;
3710 background-color: transparent;
3713 .gclitoolbar-input-node,
3714 .gclitoolbar-complete-node {
3716 -moz-box-align: center;
3720 background-color: transparent;
3723 .gclitoolbar-input-node {
3725 /* line-height: 32px;
3726 outline-style: none; */
3727 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 16, 16, 0);
3728 background-repeat: no-repeat;
3729 background-color: rgba(0, 0, 0, .75);
3732 .gclitoolbar-input-node[focused="true"] {
3733 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16);
3734 background-color: #000000;
3737 .gclitoolbar-input-node:not([focused="true"]) {
3738 border-color: transparent;
3741 .gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection {
3742 background-color: #008484;
3747 .gclitoolbar-complete-node {
3749 background-color: transparent;
3752 pointer-events: none;
3755 .gcli-in-incomplete,
3759 .gcli-in-closebrace,
3766 .gcli-in-incomplete {
3767 border-bottom: 2px dotted #8050B0;
3771 border-bottom: 2px dotted #FF0000;
3782 .gcli-in-closebrace {
3786 /* === END commandline.inc.css === */
3788 /* === BEGIN responsivedesign.inc.css === */
3790 /* Responsive Mode */
3792 .browserContainer[responsivemode] {
3793 background: #221500 url("chrome://browser/skin/devtools/responsive-background.png");
3794 padding: 0 20px 20px 20px;
3797 .browserStack[responsivemode] {
3798 box-shadow: 0 0 7px #9C9CFF;
3801 .devtools-responsiveui-toolbar {
3802 background: transparent;
3803 /* text color is textColor from dark theme, since no theme is applied to
3804 * the responsive toolbar.
3810 border-bottom-width: 0;
3813 .devtools-responsiveui-menulist,
3814 .devtools-responsiveui-toolbarbutton {
3815 -moz-box-align: center;
3817 /* min-height: 22px;*/
3818 /* margin: 0 3px; */
3821 .devtools-responsiveui-toolbarbutton > .toolbarbutton-menubutton-button {
3822 -moz-box-orient: horizontal;
3825 .devtools-responsiveui-menulist:-moz-focusring,
3826 .devtools-responsiveui-toolbarbutton:-moz-focusring {
3827 /* outline: 1px dotted hsla(210,30%,85%,0.7);
3828 outline-offset: -4px;*/
3831 .devtools-responsiveui-toolbarbutton:not([label]) > .toolbarbutton-text {
3835 .devtools-responsiveui-toolbarbutton:not([checked=true]):hover:active {
3836 /* border-color: hsla(210,8%,5%,.6);
3837 background: linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
3838 box-shadow: 0 0 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15); */
3841 .devtools-responsiveui-menulist[open=true],
3842 .devtools-responsiveui-toolbarbutton[open=true],
3843 .devtools-responsiveui-toolbarbutton[checked=true] {
3844 /* border-color: hsla(210,8%,5%,.6) !important;
3845 background: linear-gradient(hsla(220,6%,10%,.6), hsla(210,11%,18%,.45) 75%, hsla(210,11%,30%,.4));
3846 box-shadow: 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15); */
3849 .devtools-responsiveui-toolbarbutton[checked=true] {
3850 /* color: hsl(208,100%,60%); */
3853 .devtools-responsiveui-toolbarbutton[checked=true]:hover {
3854 /* background-color: transparent !important;*/
3857 .devtools-responsiveui-toolbarbutton[checked=true]:hover:active {
3858 /* background-color: hsla(210,8%,5%,.2) !important;*/
3861 .devtools-responsiveui-menulist > .menulist-label-box {
3865 .devtools-responsiveui-menulist > .menulist-dropmarker {
3866 /* display: -moz-box;
3867 background-color: transparent;
3868 list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
3869 -moz-box-align: center;
3874 .devtools-responsiveui-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-button {
3877 -moz-border-end: 1px solid hsla(210,8%,5%,.45);
3878 box-shadow: -1px 0 0 hsla(210,16%,76%,.15) inset, 1px 0 0 hsla(210,16%,76%,.15);*/
3881 .devtools-responsiveui-toolbarbutton[type=menu-button]:-moz-locale-dir(rtl) > .toolbarbutton-menubutton-button {
3882 /* box-shadow: 1px 0 0 hsla(210,16%,76%,.15) inset, -1px 0 0 hsla(210,16%,76%,.15);*/
3885 .devtools-responsiveui-toolbarbutton[type=menu-button] {
3886 /* padding: 0 1px;*/
3887 -moz-box-align: stretch;
3890 .devtools-responsiveui-toolbarbutton[type=menu] > .toolbarbutton-menu-dropmarker,
3891 .devtools-responsiveui-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-dropmarker {
3892 /* list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
3893 -moz-box-align: center;
3897 .devtools-responsiveui-toolbar:-moz-locale-dir(ltr) > *:first-child,
3898 .devtools-responsiveui-toolbar:-moz-locale-dir(rtl) > *:last-child {
3902 .devtools-responsiveui-close {
3903 list-style-image: url("chrome://browser/skin/devtools/close.png");
3904 -moz-image-region: rect(0px,16px,16px,0px);
3907 .devtools-responsiveui-close:hover {
3908 -moz-image-region: rect(0px,32px,16px,16px);
3911 .devtools-responsiveui-rotate {
3912 list-style-image: url("chrome://browser/skin/devtools/responsiveui-rotate.png");
3913 -moz-image-region: rect(0px,16px,16px,0px);
3916 .devtools-responsiveui-rotate:hover {
3917 -moz-image-region: rect(0px,32px,16px,16px);
3920 .devtools-responsiveui-touch {
3921 list-style-image: url("chrome://browser/skin/devtools/responsiveui-touch.png");
3922 -moz-image-region: rect(0px,16px,16px,0px);
3925 .devtools-responsiveui-touch:hover,
3926 .devtools-responsiveui-touch[checked],
3927 .devtools-responsiveui-touch[checked]:hover {
3928 -moz-image-region: rect(0px,32px,16px,16px);
3931 .devtools-responsiveui-screenshot {
3932 list-style-image: url("chrome://browser/skin/devtools/responsiveui-screenshot.png");
3933 -moz-image-region: rect(0px,16px,16px,0px);
3936 .devtools-responsiveui-screenshot:hover {
3937 -moz-image-region: rect(0px,32px,16px,16px);
3940 .devtools-responsiveui-resizebarV {
3944 transform: translate(12px, -12px);
3945 background-image: url("chrome://browser/skin/devtools/responsive-vertical-resizer.png");
3948 .devtools-responsiveui-resizebarH {
3952 transform: translate(-12px, 12px);
3953 background-image: url("chrome://browser/skin/devtools/responsive-horizontal-resizer.png");
3956 .devtools-responsiveui-resizehandle {
3960 transform: translate(12px, 12px);
3961 background-image: url("chrome://browser/skin/devtools/responsive-se-resizer.png");
3964 /* === END responsivedesign.inc.css === */
3966 /* === including indicator.css is done at the start of the file === */
3970 #developer-toolbar-toolbox-button[error-count]:before {
3974 background-color: #FF0000;
3976 -moz-margin-end: 5px;
3979 /* Social toolbar item */
3981 #social-provider-button {
3982 -moz-image-region: rect(0, 16px, 16px, 0);
3983 list-style-image: url("chrome://browser/skin/social/services-16.png");
3986 #social-provider-button > .toolbarbutton-menu-dropmarker {
3990 .toolbarbutton-badge-container {
3996 #navigator-toolbox[iconsize=large][mode=icons] > #nav-bar .toolbarbutton-1 > .toolbarbutton-badge-container {
4000 .toolbarbutton-1 > .toolbarbutton-badge-container > .toolbar-icon {
4006 .toolbarbutton-badge-container > .toolbarbutton-icon[label]:not([label=""]) {
4010 .toolbarbutton-badge[badge=""] {
4013 .toolbarbutton-badge[badge]:not([badge=""])::after {
4014 /* The |content| property is set in the content stylesheet. */
4019 background-color: #000000;
4020 border: 1px solid #9C9CFF;
4027 #navigator-toolbox[iconsize=large][mode=icons] > #nav-bar *|* > .toolbarbutton-badge[badge]:not([badge=""])::after {
4032 .toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
4037 #navigator-toolbox[iconsize=large][mode=icons] > #nav-bar *|* > .toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
4042 #social-notification-icon-mentions {
4043 background-color: #000000;
4045 -moz-margin-start: 2px;
4048 #social-notification-icon-mentions:hover {
4049 background-color: #FFCF00;
4052 #social-notification-icon-mentions[open="true"] {
4053 background-color: #FF9F00;
4056 #social-sidebar-splitter {
4060 .popup-notification-icon[popupid="servicesInstall"] {
4061 list-style-image: url("chrome://browser/skin/social/services-64.png");
4063 #servicesInstall-notification-icon {
4064 list-style-image: url("chrome://browser/skin/social/services-16.png");
4066 #social-undoactivation-button,
4067 #servicesInstall-learnmore-link {
4068 -moz-margin-start: 0; /* override default label margin to match description margin */
4071 #socialActivatedNotification .popup-notification-button-container {
4075 .social-activation-icon {
4082 #social-activation-message {
4086 #social-activation-message > label {
4090 /* social toolbar provider menu */
4091 .social-statusarea-popup {
4094 margin-right: -12px;
4097 .social-statusarea-user {
4098 border-bottom: 1px solid #9C9CFF;
4099 background-color: #000000;
4105 .social-statusarea-user-portrait {
4112 .social-statusarea-loggedInStatus {
4113 background: transparent;
4118 list-style-image: none;
4121 #social-statusarea-user[_moz-menuactive] > vbox > .social-statusarea-loggedInStatus {
4122 text-decoration: underline;
4125 .social-panel > .panel-arrowcontainer > .panel-arrowcontent {
4129 .social-panel-frame {
4130 border-radius: inherit;
4133 /* === BEGIN chat.inc.css === */
4141 .chat-toolbarbutton {
4142 -moz-appearance: none;
4150 .chat-toolbarbutton > .toolbarbutton-text {
4154 .chat-toolbarbutton > .toolbarbutton-icon {
4158 .chat-toolbarbutton.notification-anchor-icon > .toolbarbutton-icon {
4163 .chat-close-button {
4164 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
4165 -moz-image-region: rect(0, 16px, 16px, 0);
4168 .chat-close-button:hover,
4169 .chat-close-button:hover:active {
4170 -moz-image-region: rect(0, 32px, 16px, 16px);
4173 .chat-minimize-button {
4174 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
4175 -moz-image-region: rect(16px, 16px, 32px, 0);
4178 .chat-minimize-button:hover:active,
4179 .chat-minimize-button:hover {
4180 -moz-image-region: rect(16px, 32px, 32px, 16px);
4184 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
4185 -moz-image-region: rect(48px, 16px, 64px, 0);
4188 .chat-swap-button:hover:active,
4189 .chat-swap-button:hover {
4190 -moz-image-region: rect(48px, 32px, 64px, 16px);
4193 chatbar > chatbox > .chat-titlebar > .chat-swap-button {
4194 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
4195 -moz-image-region: rect(32px, 16px, 48px, 0);
4198 chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover:active,
4199 chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover {
4200 -moz-image-region: rect(32px, 32px, 48px, 16px);
4205 font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
4211 background-color: #9C9CFF;
4218 -moz-padding-start: 6px;
4220 border-bottom: 1px solid #008484;
4224 .chat-titlebar > .notification-anchor-icon {
4229 .chat-titlebar[minimized="true"] {
4230 border-bottom: none;
4233 .chat-titlebar[selected] {
4234 background-color: #008484;
4237 .chat-titlebar[activity] {
4238 background-color: #E7ADE7;
4248 list-style-image: url("chrome://browser/skin/social/services-16.png");
4249 background-color: #000000;
4255 border-top: 1px solid #008484;
4256 -moz-border-end: 1px solid #008484;
4259 @media (min-resolution: 2dppx) {
4261 list-style-image: url("chrome://browser/skin/social/services-16@2x.png");
4265 .chatbar-button > .toolbarbutton-icon {
4269 .chatbar-button > menupopup > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon {
4276 .chatbar-button > .toolbarbutton-icon {
4280 .chatbar-button:hover > .toolbarbutton-icon,
4281 .chatbar-button[open="true"] > .toolbarbutton-icon {
4285 .chatbar-button:hover,
4286 .chatbar-button[open="true"] {
4289 .chatbar-button > .toolbarbutton-text,
4290 .chatbar-button > .toolbarbutton-menu-dropmarker {
4294 .chatbar-button[activity]:not([open="true"]) {
4295 background-color: #E7ADE7;
4298 .chatbar-button > menupopup > menuitem[activity] {
4303 background: transparent;
4309 -moz-margin-end: 20px;
4315 -moz-margin-start: 4px;
4316 background-color: #000000;
4317 border: 1px solid #9C9CFF;
4318 border-bottom: none;
4319 border-top-left-radius: 2.5px;
4320 border-top-right-radius: 2.5px;
4323 chatbox[minimized="true"] {
4329 -moz-margin-start: 0px;
4335 /* === END chat.inc.css === */
4337 /* === BEGIN plugin-doorhanger.inc.css === */
4340 * Plugin Doorhanger Styles
4343 #notification-popup[popupid="click-to-play-plugins"] > .panel-arrowcontainer > .panel-arrowcontent {
4344 padding: 6px 1px 2px;
4347 .click-to-play-plugins-notification-center-box {
4350 .plugin-popupnotification-centeritem:nth-child(odd) {
4351 /* background-color: rgba(0,0,0,0.1);*/
4354 .center-item-label {
4356 text-overflow: ellipsis;
4359 .center-item-warning-icon {
4360 background-image: url("chrome://mozapps/skin/extensions/alerticon-info-negative.png");
4361 background-repeat: no-repeat;
4364 -moz-margin-start: 6px;
4367 .click-to-play-plugins-notification-button-container {
4370 .click-to-play-popup-button {
4374 .click-to-play-plugins-notification-description-box {
4378 padding-bottom: 3px;
4381 .click-to-play-plugins-outer-description {
4385 .click-to-play-plugins-notification-link,
4390 .messageImage[value="plugin-hidden"] {
4391 list-style-image: url("chrome://browser/skin/notification-pluginNormal.png");
4394 /* Keep any changes to this style in sync with pluginProblem.css */
4395 notification.pluginVulnerable {
4398 notification.pluginVulnerable .messageImage {
4399 list-style-image: url("chrome://browser/skin/notification-pluginBlocked.png");
4402 /* === END plugin-doorhanger.inc.css === */
4404 #main-window[privatebrowsingmode=temporary] #toolbar-menubar {
4405 background-image: url("chrome://browser/skin/privatebrowsing-dark.png");
4406 background-position: top right;
4407 background-repeat: no-repeat;
4410 #main-window[privatebrowsingmode=temporary] #toolbar-menubar:-moz-locale-dir(rtl) {
4411 background-position: top left;
4414 #main-window[privatebrowsingmode=temporary] #appmenu-button > .button-box > .box-inherit > .button-icon {
4415 list-style-image: url("chrome://browser/skin/privatebrowsing-light.png");
4420 /* === BEGIN customizeMode.inc.css === */
4422 /* Customization mode */
4424 #main-window:-moz-any([customize-entering],[customize-entered]) #content-deck {
4428 #main-window:-moz-any([customize-entering],[customize-entered]) #navigator-toolbox {
4433 #main-window:-moz-any([customize-entering],[customize-exiting]) #tab-view-deck {
4434 pointer-events: none;
4437 #main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar))::before,
4438 #PanelUI-contents > .panel-customization-placeholder {
4439 -moz-outline-radius: 2.5px;
4440 outline: 1px dashed transparent;
4443 #main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar))::before {
4444 /* Prevent jumping of tabs when switching a window between inactive and active (bug 853415). */
4445 -moz-box-ordinal-group: 0;
4450 outline-offset: -2px;
4451 pointer-events: none;
4457 /* Shift the TabsToolbar outline up 2px since the #nav-bar is shifted up by 1px and the
4458 #TabsToolbar::after is a pixel higher to draw the bottom border of the tabstrip so this makes the
4459 offset from the bottom effectively the same as other targets (-2px). */
4460 #main-window[customize-entered] #TabsToolbar.customization-target::before {
4464 /* The parents of the outline pseudo-elements need to be positioned so that the outline is positioned relative to it. */
4465 #main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar)):hover,
4466 #main-window[customize-entered] .customization-target[customizing-dragovertarget]:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar)),
4467 #main-window[customize-entered] #nav-bar-customization-target.customization-target {
4471 /* Most target outlines are shown on hover and drag over but the panel menu uses
4472 placeholders instead. */
4473 #main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar)):hover::before,
4474 #main-window[customize-entered] .customization-target[customizing-dragovertarget]:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar))::before,
4475 /* nav-bar and panel outlines are always shown */
4476 #nav-bar[showoutline=true] > #nav-bar-customization-target.customization-target::before {
4477 outline-color: #A09090;
4480 #nav-bar[showoutline=true] > #nav-bar-customization-target.customization-target::before {
4481 transition: outline-color 250ms linear;
4484 #PanelUI-contents[showoutline=true] > .panel-customization-placeholder {
4485 transition: outline-color 250ms linear;
4486 outline-color: #9C9CFF;
4489 #PanelUI-contents > .panel-customization-placeholder {
4491 outline-offset: -5px;
4494 #main-window[customizing] .customization-target:not(#PanelUI-contents) {
4497 padding-right: 10px;
4500 #customization-container {
4501 background-color: #000000;
4504 #customization-palette,
4505 #customization-empty {
4506 padding: 0 15px 15px;
4509 #customization-header {
4513 font-weight: lighter;
4515 padding: 15px 15px 0;
4518 #customization-panel-container {
4519 padding: 10px 10px 0px;
4522 #customization-footer {
4523 /*background-color: rgb(236,236,236);*/
4524 border-top: 1px solid #9C9CFF;
4528 .customizationmode-button {
4532 .customizationmode-button:hover {
4535 .customizationmode-button[disabled="true"] {
4538 #customization-titlebar-visibility-button {
4539 list-style-image: url("chrome://browser/skin/customizableui/customize-titleBar-toggle.png");
4540 -moz-image-region: rect(0, 24px, 24px, 0);
4542 -moz-margin-end: 10px;
4545 #customization-titlebar-visibility-button > .button-box > .button-text {
4546 /* Sadly, button.css thinks its margins are perfect for everyone. */
4547 -moz-margin-start: 6px !important;
4550 #customization-titlebar-visibility-button[checked] {
4551 -moz-image-region: rect(0, 48px, 24px, 24px);
4552 background-color: #008484;
4555 #customization-undo-reset-button {
4556 -moz-margin-end: 10px;
4559 #main-window[customize-entered] #customization-panel-container {
4560 background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png");
4561 background-position: left top;
4562 background-repeat: repeat;
4563 background-size: auto;
4564 background-attachment: fixed;
4567 toolbarpaletteitem[place="toolbar"] {
4568 transition: border-width 250ms ease-in-out;
4571 toolbarpaletteitem[mousedown] {
4572 outline: 1px solid #008484;
4573 cursor: -moz-grabbing;
4577 .panel-customization-placeholder,
4578 toolbarpaletteitem[place="palette"],
4579 toolbarpaletteitem[place="panel"] {
4580 transition: transform .3s ease-in-out;
4583 #customization-palette {
4584 transition: opacity .3s ease-in-out;
4588 #customization-palette[showing="true"] {
4592 toolbarpaletteitem[notransition].panel-customization-placeholder,
4593 toolbarpaletteitem[notransition][place="toolbar"],
4594 toolbarpaletteitem[notransition][place="palette"],
4595 toolbarpaletteitem[notransition][place="panel"] {
4599 toolbarpaletteitem > toolbarbutton > .toolbarbutton-icon,
4600 toolbarpaletteitem > toolbaritem.panel-wide-item,
4601 toolbarpaletteitem > toolbarbutton[type="menu-button"] {
4602 transition: transform .3s cubic-bezier(.6, 2, .75, 1.5) !important;
4605 toolbarpaletteitem[mousedown] > toolbarbutton > .toolbarbutton-icon {
4606 transform: scale(1.3);
4609 toolbarpaletteitem[mousedown] > toolbaritem.panel-wide-item,
4610 toolbarpaletteitem[mousedown] > toolbarbutton[type="menu-button"] {
4611 transform: scale(1.1);
4614 /* Override the toolkit styling for items being dragged over. */
4615 toolbarpaletteitem[place="toolbar"] {
4616 border-left-width: 0;
4617 border-right-width: 0;
4622 #customization-palette:not([hidden]) {
4623 margin-bottom: 25px;
4626 #wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton,
4627 #wrapper-edit-controls[place="palette"] > #edit-controls > separator,
4628 #wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton,
4629 #wrapper-zoom-controls[place="palette"] > #zoom-controls > separator {
4633 /* Remove |:-moz-any(#customization-palette, #panelUI-contents)| selector when Australis lands - this makes it only apply post-Australis as those elements only exist there */
4634 #wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton,
4635 :-moz-any(#customization-palette, #panelUI-contents) > #wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton {
4645 #wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton > .toolbarbutton-icon,
4646 #wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton > .toolbarbutton-icon {
4650 #wrapper-edit-controls > #edit-controls > toolbarbutton > .toolbarbutton-icon {
4651 opacity: 1; /* To ensure these buttons always look enabled in customize mode */
4654 :-moz-any(#customization-palette, #panelUI-contents) > #wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-reset-button,
4655 :-moz-any(#customization-palette, #panelUI-contents) > #wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-reset-button + separator {
4659 #wrapper-personal-bookmarks:not([place="toolbar"]) > #personal-bookmarks {
4660 -moz-box-pack: center;
4664 #customization-palette > toolbarpaletteitem > label {
4670 /* === END customizeMode.inc.css === */
4672 /* === BEGIN customizeTip.inc.css === */
4674 #customization-tipPanel > .panel-arrowcontainer > .panel-arrowcontent {
4681 /* background-image: linear-gradient(90deg, #a0dfff 0%, #ceeeff 100%);*/
4682 border: 1px solid #9C9CFF;
4685 #customization-tipPanel > .panel-arrowcontainer > .panel-arrowcontent:-moz-locale-dir(rtl) {
4686 /* background-image: linear-gradient(90deg, #ceeeff 0%, #a0dfff 100%);*/
4689 .customization-tipPanel-infoBox {
4690 margin: 20px 25px 25px;
4692 background-image: url("chrome://browser/skin/customizableui/info-icon-customizeTip.png");
4693 background-repeat: no-repeat;
4696 .customization-tipPanel-content {
4702 .customization-tipPanel-em {
4707 .customization-tipPanel-contentImage {
4709 list-style-image: url("chrome://browser/skin/customizableui/customize-illustration.png");
4717 .customization-tipPanel-contentImage:-moz-locale-dir(rtl) {
4718 list-style-image: url("chrome://browser/skin/customizableui/customize-illustration-rtl.png");
4721 .customization-tipPanel-link {
4722 -moz-appearance: none;
4723 background: transparent;
4731 .customization-tipPanel-link > .button-box > .button-text {
4732 margin: 0 !important;
4735 .customization-tipPanel-closeBox > .close-icon {
4736 -moz-appearance: none;
4738 -moz-margin-end: -25px;
4741 #customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="left"],
4742 #customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="right"] {
4743 list-style-image: url("chrome://browser/skin/customizableui/panelarrow-customizeTip.png");
4746 /* === END customizeTip.inc.css === */
4748 #main-window[customizing] {
4749 background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png");
4750 background-attachment: fixed;
4753 #main-window:-moz-any([customize-entering],[customize-entered]) #tab-view-deck {
4757 #customization-container {
4758 border-left: 1px solid #9C9CFF;
4759 border-right: 1px solid #9C9CFF;
4760 background-clip: padding-box;
4763 #main-window[privatebrowsingmode=temporary] #TabsToolbar::after {
4767 background: url("chrome://browser/skin/privatebrowsing-indicator.png") no-repeat center center;
4770 /* === BEGIN UITour.inc.css === */
4774 html|div#UITourHighlight {
4775 border-radius: 20px;
4776 border: 2px #9C9CFF solid;
4779 /* HACK for pre-Australis */
4783 html|div#UITourHighlight[active] {
4784 /* HACK for pre-Australis */
4792 #UITourTooltipTitle {
4798 #UITourTooltipDescription {
4802 /* === END UITour.inc.css === */