make up/down buttons have black arrows to fit new design
[themes.git] / LCARStrek / browser / browser.css
... / ...
CommitLineData
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/. */
4
5@import url("chrome://global/skin/");
6
7@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
8@namespace html url("http://www.w3.org/1999/xhtml");
9
10toolbar {
11 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar");
12}
13
14toolbar[type="menubar"][autohide="true"] {
15 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide");
16}
17
18menubar {
19 -moz-binding: url("chrome://global/skin/globalBindings.xml#menubar");
20}
21
22#menubar-items {
23 -moz-box-orient: vertical; /* for flex hack */
24}
25
26#main-menubar {
27 -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
28}
29
30/* ::::: primary toolbar ::::: */
31
32.toolbar-primary > .toolbar-box > .toolbar-holder {
33 background-color: #A09090;
34}
35
36.toolbar-primary > .toolbar-box > .toolbar-startcap,
37.toolbar-primary > .toolbar-box > .toolbar-endcap {
38 background-color: #9C9CFF;
39}
40
41
42#navigator-toolbox {
43}
44
45#navigator-toolbox::after {
46 content: "";
47 display: -moz-box;
48 -moz-box-ordinal-group: 101; /* tabs toolbar is 100 */
49 height: 1px;
50}
51#navigator-toolbox[tabsontop=false]::after,
52#main-window[disablechrome] #navigator-toolbox::after {
53 visibility: collapse;
54}
55
56#navigator-toolbox > toolbar:not(:-moz-lwtheme) {
57}
58
59#main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[inactive] ~ #TabsToolbar:not(:-moz-lwtheme) {
60 /* like menubar */
61 background-color: #6000CF;
62 color: #FF9F00;
63}
64#main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[inactive] ~ #TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive {
65 background-color: #8050B0;
66 color: #FF9F00;
67}
68
69#main-window[tabsintitlebar] #titlebar:-moz-lwtheme {
70 visibility: hidden;
71}
72#main-window[tabsintitlebar] #titlebar-content:-moz-lwtheme {
73 -moz-binding: url("chrome://global/content/bindings/general.xml#windowdragbox");
74 visibility: visible;
75}
76
77#nav-bar[tabsontop="true"],
78#nav-bar[tabsontop="true"][collapsed="true"]:not([customizing]) + toolbar,
79#nav-bar[tabsontop="true"][collapsed="true"]:not([customizing]) + #customToolbars + #PersonalToolbar {
80 /* background-image: linear-gradient(@toolbarHighlight@, rgba(255,255,255,0)); */
81}
82
83#personal-bookmarks {
84/* min-height: 24px; */
85}
86
87#print-preview-toolbar:not(:-moz-lwtheme) {
88 /* -moz-appearance: toolbox; */
89}
90
91/* ::::: app menu button ::::: */
92
93#appmenu-button {
94 background-color: #FF9F00;
95 background-clip: padding-box;
96 border-radius: 0;
97 border: none;
98 border-right: 3px solid #000000;
99 color: #000000;
100 font-weight: bold;
101 padding: 1px 1.5em;
102 margin: 0;
103}
104
105#appmenu-button:-moz-locale-dir(rtl) {
106 border-left: 3px solid #000000;
107 border-right: none;
108}
109
110#main-window[privatebrowsingmode=temporary] #appmenu-button {
111 background-color: #6000CF;
112 color: #FFCF00;
113}
114
115#appmenu-button:hover:not(:active):not([open]) {
116}
117
118#main-window[privatebrowsingmode=temporary] #appmenu-button:hover:not(:active):not([open]) {
119}
120
121#appmenu-button:hover,
122#appmenu-button:hover:active,
123#appmenu-button[open] {
124 background-color: #FFCF00;
125 color: #000000;
126}
127
128#appmenu-button > .button-box > .button-menu-dropmarker {
129 list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
130 width: auto;
131 height: auto;
132 padding: 0;
133 margin: 0;
134 border: none;
135 background-color: transparent;
136 -moz-margin-start: .5em;
137}
138
139#main-window[privatebrowsingmode=temporary] #appmenu-button > .button-box > .button-menu-dropmarker {
140 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
141}
142
143#appmenuPrimaryPane > menuitem,
144#appmenuSecondaryPane > menuitem,
145#appmenuPrimaryPane > menu {
146 padding: 2px;
147}
148
149.splitmenu-menuitem {
150 -moz-padding-start: 2px;
151 padding-top: 2px;
152 padding-bottom: 2px;
153 -moz-margin-end: 1px;
154}
155
156.splitmenu-menu {
157 padding-top: 2px;
158 padding-bottom: 2px;
159 -moz-box-pack: end;
160}
161
162.appmenu-edit-button {
163}
164
165.appmenu-edit-button[disabled="true"] {
166}
167
168#appmenuPrimaryPane {
169 -moz-border-end: 1px solid #9C9CFF;
170}
171/*
172 #appmenu-popup {
173 }
174 #appmenuPrimaryPane {
175 }
176 #appmenuSecondaryPane {
177 }
178 #appmenuSecondaryPane:-moz-locale-dir(rtl) {
179 }
180
181 #appmenuSecondaryPane menupopup {
182 }
183
184 .appmenu-menuseparator {
185 }
186
187 .appmenu-edit-button:not([disabled]):hover {
188 }
189*/
190#appmenuSecondaryPane-spacer {
191 min-height: 1em;
192}
193
194#appmenu-editmenu {
195 -moz-box-pack: end;
196}
197
198#appmenu_print,
199#appmenu_print_popup,
200.appmenu-edit-button,
201#appmenu-editmenu-cut,
202#appmenu-editmenu-copy,
203#appmenu-editmenu-paste,
204#appmenu-quit {
205 list-style-image: url("appmenu-icons.png");
206}
207
208#appmenu-cut,
209#appmenu-editmenu-cut {
210 -moz-image-region: rect(0 16px 16px 0);
211}
212
213#appmenu-cut:hover:not([disabled="true"]),
214#appmenu-editmenu-cut:hover:not([disabled="true"]) {
215 -moz-image-region: rect(16px 16px 32px 0);
216}
217
218#appmenu-cut[disabled="true"],
219#appmenu-editmenu-cut[disabled="true"] {
220 -moz-image-region: rect(32px 16px 48px 0);
221}
222
223#appmenu-copy,
224#appmenu-editmenu-copy {
225 -moz-image-region: rect(0 32px 16px 16px);
226}
227
228#appmenu-copy:hover:not([disabled="true"]),
229#appmenu-editmenu-copy:hover:not([disabled="true"]) {
230 -moz-image-region: rect(16px 32px 32px 16px);
231}
232
233#appmenu-copy[disabled="true"],
234#appmenu-editmenu-copy[disabled="true"] {
235 -moz-image-region: rect(32px 32px 48px 16px);
236}
237
238#appmenu-paste,
239#appmenu-editmenu-paste {
240 -moz-image-region: rect(0 48px 16px 32px);
241}
242
243#appmenu-paste:hover:not([disabled="true"]),
244#appmenu-editmenu-paste:hover:not([disabled="true"]) {
245 -moz-image-region: rect(16px 48px 32px 32px);
246}
247
248#appmenu-paste[disabled="true"],
249#appmenu-editmenu-paste[disabled="true"] {
250 -moz-image-region: rect(32px 48px 48px 32px);
251}
252
253#appmenu_print,
254#appmenu_print_popup {
255 -moz-image-region: rect(0 64px 16px 48px);
256}
257
258#appmenu_print:hover:not([disabled="true"]),
259#appmenu_print[open="true"],
260#appmenu_print_popup:hover:not([disabled="true"]) {
261 -moz-image-region: rect(16px 64px 32px 48px);
262}
263
264#appmenu-print[disabled="true"],
265#appmenu_print_popup[disabled="true"] {
266 -moz-image-region: rect(32px 64px 48px 48px);
267}
268
269#appmenu-quit {
270 -moz-image-region: rect(0 80px 16px 64px);
271}
272
273#appmenu-quit:hover {
274 -moz-image-region: rect(16px 80px 32px 64px);
275}
276
277#appmenu-edit-label {
278 -moz-appearance: none;
279 background: transparent;
280 font-style: italic;
281}
282
283#appmenu_bookmarks {
284 list-style-image: url("chrome://browser/skin/places/bookmark.png");
285 -moz-image-region: rect(0px 48px 16px 32px);
286}
287
288#appmenu_privateBrowsing,
289#appmenu_newPrivateWindow {
290 list-style-image: url("chrome://browser/skin/Privacy-16.png");
291}
292
293#appmenu_addons {
294 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
295}
296
297#BMB_bookmarkThisPage,
298#appmenu_bookmarkThisPage {
299 list-style-image: url("chrome://browser/skin/places/bookmark.png");
300 -moz-image-region: rect(0 16px 16px 0);
301}
302
303/* ::::: titlebar ::::: */
304
305#titlebar {
306 /* like menubar */
307 background-color: #6000CF;
308 color: #FF9F00;
309}
310#titlebar:-moz-window-inactive {
311 background-color: #8050B0;
312 color: #FF9F00;
313}
314
315#main-window[sizemode="normal"] > #titlebar {
316 margin-top: -3px;
317 margin-bottom: 3px;
318}
319
320#main-window[sizemode="maximized"] > #titlebar {
321 margin-top: 4px;
322}
323
324#titlebar-buttonbox {
325 margin-top: 5px;
326 -moz-margin-end: 3px;
327}
328
329#main-window[sizemode="maximized"] #titlebar-buttonbox {
330}
331
332.titlebar-placeholder[type="appmenu-button"] {
333 margin-left: 4px;
334}
335
336.titlebar-placeholder[type="caption-buttons"] {
337 margin-left: 10px;
338}
339
340/* titlebar command buttons */
341
342#titlebar-min {
343 list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
344}
345
346#titlebar-min:hover {
347 list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
348}
349
350#titlebar-max {
351 list-style-image: url("chrome://browser/skin/win-maximize.gif");
352}
353
354#titlebar-max:hover {
355 list-style-image: url("chrome://browser/skin/win-maximize-hover.gif");
356}
357
358#main-window[sizemode="maximized"] #titlebar-max {
359 list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
360}
361
362#main-window[sizemode="maximized"] #titlebar-max:hover {
363 list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
364}
365
366#titlebar-close {
367 list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
368}
369
370#titlebar-close:hover {
371 list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
372}
373
374/* ::::: bookmark buttons ::::: */
375
376/*.bookmark-item:not(#bookmarks-menu-button) > .toolbarbutton-icon */
377.bookmark-item > .toolbarbutton-icon {
378 width: 16px;
379 height: 16px;
380}
381
382/* Prevent [mode="icons"] from hiding the label */
383.bookmark-item > .toolbarbutton-text {
384 display: -moz-box !important;
385}
386
387.bookmark-item > .toolbarbutton-menu-dropmarker {
388 display: none;
389}
390
391#wrapper-personal-bookmarks[place="palette"] > .toolbarpaletteitem-box {
392 background: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") no-repeat center;
393}
394
395.bookmarks-toolbar-customize {
396 max-width: 15em !important;
397 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") !important;
398}
399
400/* ::::: bookmark menus ::::: */
401
402menu.bookmark-item,
403menuitem.bookmark-item {
404 min-width: 0;
405 max-width: 32em;
406}
407
408.bookmark-item > .menu-iconic-left {
409 margin-top: 0;
410 margin-bottom: 0;
411}
412
413.bookmark-item > .menu-iconic-left > .menu-iconic-icon {
414 -moz-padding-start: 0px;
415}
416
417/* ::::: bookmark items ::::: */
418
419.bookmark-item {
420 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
421 -moz-image-region: auto;
422}
423
424.bookmark-item[container] {
425 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
426 -moz-image-region: auto;
427}
428
429.bookmark-item[container][open] {
430 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
431 -moz-image-region: auto;
432}
433
434.bookmark-item[container][livemark] {
435 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-folder.png");
436 -moz-image-region: auto;
437}
438
439.bookmark-item[container][livemark] .bookmark-item {
440 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-item.png");
441 -moz-image-region: rect(0px, 16px, 16px, 0px);
442}
443
444.bookmark-item[container][livemark] .bookmark-item[visited] {
445 -moz-image-region: rect(0px, 32px, 16px, 16px);
446}
447
448.bookmark-item[container][query] {
449 list-style-image: url("chrome://communicator/skin/bookmarks/query.png");
450 -moz-image-region: auto;
451}
452
453.bookmark-item[query][tagContainer] {
454 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
455 -moz-image-region: auto;
456}
457
458.bookmark-item[query][dayContainer] {
459 list-style-image: url("chrome://communicator/skin/history/calendar.png");
460 -moz-image-region: auto;
461}
462
463.bookmark-item[query][hostContainer] {
464 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
465 -moz-image-region: auto;
466}
467
468.bookmark-item[query][hostContainer][open] {
469 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
470 -moz-image-region: auto;
471}
472
473.bookmark-item[cutting] > .toolbarbutton-icon,
474.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-icon {
475 opacity: 0.5;
476}
477
478.bookmark-item[cutting] > .toolbarbutton-text,
479.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-text {
480 opacity: 0.7;
481}
482
483/* ::::: primary toolbar buttons ::::: */
484
485.toolbarbutton-1 {
486 list-style-image: url("chrome://browser/skin/FxToolbar.png");
487}
488
489.toolbarbutton-1:not([type="menu-button"]) {
490 -moz-box-orient: vertical;
491}
492
493.toolbarbutton-1,
494.toolbarbutton-1 > .toolbarbutton-menubutton-button {
495 min-width: 36px;
496 min-height: 36px;
497}
498
499.toolbarbutton-1:not([type="menu-button"]) {
500 -moz-box-orient: vertical;
501}
502
503.toolbarbutton-1,
504.toolbarbutton-1 > .toolbarbutton-menubutton-button,
505.toolbarbutton-1[disabled="true"]:hover:active,
506.toolbarbutton-1[disabled="true"]:hover:active > .toolbarbutton-menubutton-button {
507 padding: 1px 2px;
508}
509
510.toolbarbutton-1:hover:active,
511.toolbarbutton-1[open="true"],
512.toolbarbutton-1:hover:active > .toolbarbutton-menubutton-button {
513 padding-top: 2px;
514 padding-bottom: 0px;
515 -moz-padding-start: 3px;
516 -moz-padding-end: 1px;
517}
518
519/* ::::: small primary toolbar buttons ::::: */
520
521#nav-bar {
522 /* force iconsize="small" on this toolbar */
523 counter-reset: smallicons;
524}
525
526toolbar[mode="text"] .toolbarbutton-1,
527toolbar[mode="icons"] .toolbarbutton-1,
528toolbar[iconsize="small"] .toolbarbutton-1,
529:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1,
530toolbar[mode="text"] .toolbarbutton-menubutton-button,
531toolbar[mode="icons"] .toolbarbutton-menubutton-button,
532toolbar[iconsize="small"] .toolbarbutton-menubutton-button,
533:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-button {
534 min-width: 0px;
535 min-height: 0px;
536}
537
538toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker {
539 padding-top: 4px;
540 padding-bottom: 8px;
541 -moz-padding-start: 1px;
542 -moz-padding-end: 1px;
543}
544
545toolbar[mode="icons"] .toolbarbutton-menubutton-dropmarker,
546toolbar[iconsize="small"] .toolbarbutton-menubutton-dropmarker,
547:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
548 padding-top: 0px;
549 padding-bottom: 13px;
550 -moz-padding-start: 1px;
551 -moz-padding-end: 1px;
552}
553
554toolbar[mode="text"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
555toolbar[mode="text"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker {
556 padding-top: 5px;
557 padding-bottom: 7px;
558 -moz-padding-start: 0px;
559 -moz-padding-end: 2px;
560}
561
562toolbar[mode="icons"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
563toolbar[mode="icons"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker,
564toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
565toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker,
566:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
567:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker {
568 padding-top: 1px;
569 padding-bottom: 12px;
570 -moz-padding-start: 0px;
571 -moz-padding-end: 2px;
572}
573
574toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker[disabled="true"] {
575 padding-top: 4px !important;
576 padding-bottom: 8px !important;
577 -moz-padding-start: 1px !important;
578 -moz-padding-end: 1px !important;
579}
580
581toolbar[mode="icons"] .toolbarbutton-menubutton-dropmarker[disabled="true"],
582toolbar[iconsize="small"] > .toolbarbutton-menubutton-dropmarker[disabled="true"] {
583 padding-top: 0px !important;
584 padding-bottom: 13px !important;
585 -moz-padding-start: 1px !important;
586 -moz-padding-end: 1px !important;
587}
588
589toolbar[mode="icons"] .toolbarbutton-text,
590toolbar[mode="text"] .toolbarbutton-icon {
591 display: none;
592}
593
594toolbar[mode="text"] .toolbarbutton-text {
595 padding: 4px 0;
596}
597
598toolbar[mode="text"] .toolbarbutton-1,
599toolbar[mode="text"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
600 -moz-box-orient: horizontal;
601}
602
603toolbar[mode="full"] .toolbarbutton-1,
604toolbar[mode="full"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
605 min-width: 30px;
606}
607
608#navigator-toolbox[iconsize=small] > #nav-bar {
609}
610
611#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar {
612}
613
614
615/* unified back/forward button */
616
617#back-button {
618 -moz-image-region: rect(0, 18px, 18px, 0);
619 -moz-margin-end: 0;
620}
621
622#back-button:not([disabled="true"]):hover {
623 -moz-image-region: rect(18px, 18px, 36px, 0);
624}
625
626#back-button[disabled="true"] {
627 -moz-image-region: rect(36px, 18px, 54px, 0);
628}
629
630#forward-button {
631 -moz-image-region: rect(0, 36px, 18px, 18px);
632 border-left: none;
633 -moz-margin-start: 0;
634}
635
636#forward-button:not([disabled="true"]):hover {
637 -moz-image-region: rect(18px, 36px, 36px, 18px);
638}
639
640#forward-button[disabled="true"] {
641 -moz-image-region: rect(36px, 36px, 54px, 18px);
642}
643
644#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
645#forward-button:-moz-locale-dir(rtl),
646#forward-button:-moz-locale-dir(rtl) > .toolbarbutton-text {
647 transform: scaleX(-1);
648}
649
650#nav-bar #back-button {
651 -moz-margin-end: 0 !important;
652}
653
654#nav-bar #forward-button {
655 border-left-style: none;
656 -moz-margin-start: 0 !important;
657}
658
659#nav-bar #back-button:-moz-locale-dir(ltr) {
660 border-top-right-radius: 0;
661 border-bottom-right-radius: 0;
662}
663
664#nav-bar #back-button:-moz-locale-dir(rtl),
665#nav-bar #forward-button {
666 border-top-left-radius: 0;
667 border-bottom-left-radius: 0;
668}
669
670window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
671 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
672 #unified-back-forward-button > #back-button {
673 border-radius: 10000px;
674 width: 30px;
675 height: 30px;
676 position: relative;
677 z-index: 1;
678 margin-top: -2px;
679 margin-bottom: -2px;
680 border: none;
681 -moz-image-region: rect(54px, 20px, 74px, 0);
682}
683
684window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
685 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
686 #unified-back-forward-button > #back-button:not([disabled="true"]):hover,
687window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
688 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
689 #unified-back-forward-button > #back-button[open="true"] {
690 -moz-image-region: rect(54px, 40px, 74px, 20px);
691}
692
693window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
694 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
695 #unified-back-forward-button > #back-button[disabled="true"] {
696 -moz-image-region: rect(54px, 60px, 74px, 40px);
697}
698
699window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
700 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
701 #unified-back-forward-button > #back-button:not([disabled="true"]):not([open="true"]):not(:active):hover {
702}
703
704window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
705 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
706 #unified-back-forward-button > #back-button:not([disabled="true"]):hover:active,
707window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
708 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
709 #unified-back-forward-button > #back-button[open="true"] {
710}
711
712#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar[currentset*="unified-back-forward-button"],
713#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar:not([currentset]) {
714/* padding-top: 3px;
715 padding-bottom: 5px; */
716}
717
718#navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar[currentset*="unified-back-forward-button"],
719#navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar:not([currentset]) {
720/* padding-top: 5px; */
721}
722
723window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
724 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
725 #unified-back-forward-button > #forward-button {
726 /*mask: url(keyhole-forward-mask.svg#mask); XXX: this regresses twinopen */
727 /*clip-path: url("chrome://browser/content/browser.xul#winstripe-keyhole-forward-clip-path"); */
728 -moz-margin-start: -6px !important;
729 padding-left: 7px;
730 padding-right: 3px;
731 margin-top: 2px;
732 margin-bottom: 2px;
733}
734
735window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
736 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
737 #unified-back-forward-button > #forward-button:-moz-locale-dir(ltr) {
738 border-top-right-radius: 11px;
739 border-bottom-right-radius: 11px;
740}
741
742window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
743 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
744 #unified-back-forward-button > #forward-button:-moz-locale-dir(rtl) {
745 border-top-left-radius: 11px;
746 border-bottom-left-radius: 11px;
747}
748
749.unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
750.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
751 list-style-image: url("chrome://global/skin/arrow/arrow-left.gif") !important;
752}
753
754.unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr):hover,
755.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl):hover {
756 list-style-image: url("chrome://global/skin/arrow/arrow-left-hover.gif") !important;
757}
758
759.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr),
760.unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl) {
761 list-style-image: url("chrome://global/skin/arrow/arrow-right.gif") !important;
762}
763
764.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr):hover,
765.unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl):hover {
766 list-style-image: url("chrome://global/skin/arrow/arrow-right.gif") !important;
767}
768
769window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
770 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
771 #unified-back-forward-button > #forward-button {
772/* border-top-right-radius: 0;
773 border-bottom-right-radius: 0;
774 -moz-margin-end: 0; */
775}
776
777window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
778 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
779 #unified-back-forward-button:not([switchingtabs]) > #forward-button {
780 transition: opacity 150ms ease-out;
781}
782
783window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
784 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
785 #unified-back-forward-button:not(:hover) > #forward-button[disabled] {
786 opacity: 0;
787}
788
789window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
790 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
791 #unified-back-forward-button:hover > #forward-button[disabled] {
792 background-color: transparent;
793}
794
795/* stop button */
796
797#stop-button {
798 -moz-image-region: rect(0, 54px, 18px, 36px);
799}
800
801#stop-button:not([disabled="true"]):hover {
802 -moz-image-region: rect(18px, 54px, 36px, 36px);
803}
804
805#stop-button[disabled="true"] {
806 -moz-image-region: rect(36px, 54px, 54px, 36px);
807}
808
809/* reload button */
810
811#reload-button {
812 -moz-image-region: rect(0, 72px, 18px, 54px);
813}
814
815#reload-button:not([disabled="true"]):hover {
816 -moz-image-region: rect(18px, 72px, 36px, 54px);
817}
818
819#reload-button[disabled="true"] {
820 -moz-image-region: rect(36px, 72px, 54px, 54px);
821}
822
823/* home button */
824
825#home-button.bookmark-item {
826 list-style-image: url("chrome://browser/skin/FxToolbar.png");
827}
828#home-button {
829 -moz-image-region: rect(0, 90px, 18px, 72px);
830}
831
832#home-button:not([disabled="true"]):hover {
833 -moz-image-region: rect(18px, 90px, 36px, 72px);
834}
835
836#home-button[disabled="true"] {
837 -moz-image-region: rect(36px, 90px, 54px, 72px);
838}
839
840/* tabview button */
841
842#tabview-button,
843#menu_tabview {
844 list-style-image: url("chrome://browser/skin/tabview/tabview.png");
845}
846
847#tabview-button {
848 -moz-image-region: rect(0, 90px, 18px, 72px);
849}
850
851#tabview-button[groups="0"] {
852 -moz-image-region: rect(0, 18px, 18px, 0);
853}
854
855#tabview-button[groups="1"] {
856 -moz-image-region: rect(0, 36px, 18px, 18px);
857}
858
859#tabview-button[groups="2"] {
860 -moz-image-region: rect(0, 54px, 18px, 36px);
861}
862
863#tabview-button[groups="3"] {
864 -moz-image-region: rect(0, 72px, 18px, 54px);
865}
866
867#menu_tabview {
868 -moz-image-region: rect(1px, 89px, 17px, 73px);
869}
870
871#menu_tabview[groups="0"] {
872 -moz-image-region: rect(1px, 17px, 17px, 1px);
873}
874
875#menu_tabview[groups="1"] {
876 -moz-image-region: rect(1px, 35px, 17px, 19px);
877}
878
879#menu_tabview[groups="2"] {
880 -moz-image-region: rect(1px, 53px, 17px, 37px);
881}
882
883#menu_tabview[groups="3"] {
884 -moz-image-region: rect(1px, 71px, 17px, 55px);
885}
886
887/* download manager button */
888
889#downloads-button {
890 -moz-image-region: rect(0, 108px, 18px, 90px);
891}
892
893#downloads-button:not([disabled="true"]):hover {
894 -moz-image-region: rect(18px, 108px, 36px, 90px);
895}
896
897#downloads-button[disabled="true"] {
898 -moz-image-region: rect(36px, 108px, 54px, 90px);
899}
900
901#downloads-button > .toolbarbutton-icon {
902 margin: 0;
903}
904
905/* history sidebar button */
906
907#webrtc-status-button /* temporary placeholder (bug 824825) */,
908#history-button {
909 -moz-image-region: rect(0, 126px, 18px, 108px);
910}
911
912#history-button:not([disabled="true"]):hover {
913 -moz-image-region: rect(18px, 126px, 36px, 108px);
914}
915
916#history-button[disabled="true"] {
917 -moz-image-region: rect(36px, 126px, 54px, 108px);
918}
919
920/* bookmark sidebar & menu buttons */
921
922#bookmarks-button,
923#bookmarks-menu-button {
924 list-style-image: url("chrome://browser/skin/FxToolbar.png") !important; /* for making the palette work */
925 -moz-image-region: rect(0, 144px, 18px, 126px);
926}
927
928#bookmarks-menu-button.bookmark-item {
929 /* list-style-image: url("chrome://browser/skin/FxToolbar.png"); */
930}
931
932#bookmarks-menu-button.toolbarbutton-1 {
933 -moz-box-orient: horizontal;
934}
935
936#bookmarks-button:not([disabled="true"]):hover,
937#bookmarks-menu-button[open="true"],
938#bookmarks-menu-button:not([disabled="true"]):hover {
939 -moz-image-region: rect(18px, 144px, 36px, 126px);
940}
941
942#bookmarks-button[disabled="true"],
943#bookmarks-menu-button[disabled="true"] {
944 -moz-image-region: rect(36px, 144px, 54px, 126px);
945}
946
947/* print button */
948
949#print-button {
950 -moz-image-region: rect(0, 162px, 18px, 144px);
951}
952
953#print-button:not([disabled="true"]):hover {
954 -moz-image-region: rect(18px, 162px, 36px, 144px);
955}
956
957#print-button[disabled="true"] {
958 -moz-image-region: rect(36px, 162px, 54px, 144px);
959}
960
961/* toolbar new tab button */
962
963#new-tab-button {
964 -moz-image-region: rect(0, 180px, 18px, 162px);
965}
966
967#new-tab-button:not([disabled="true"]):hover {
968 -moz-image-region: rect(18px, 180px, 36px, 162px);
969}
970
971#new-tab-button[disabled="true"] {
972 -moz-image-region: rect(36px, 180px, 54px, 162px);
973}
974
975/* new window button */
976
977#new-window-button {
978 -moz-image-region: rect(0, 198px, 18px, 180px);
979}
980
981#new-window-button:not([disabled="true"]):hover {
982 -moz-image-region: rect(18px, 198px, 36px, 180px);
983}
984
985#new-window-button[disabled="true"] {
986 -moz-image-region: rect(36px, 198px, 54px, 180px);
987}
988
989/* cut button */
990
991#cut-button {
992 -moz-image-region: rect(0, 216px, 18px, 198px);
993}
994
995#cut-button:not([disabled="true"]):hover {
996 -moz-image-region: rect(18px, 216px, 36px, 198px);
997}
998
999#cut-button[disabled="true"] {
1000 -moz-image-region: rect(36px, 216px, 54px, 198px);
1001}
1002
1003/* copy button */
1004
1005#copy-button {
1006 -moz-image-region: rect(0, 234px, 18px, 216px);
1007}
1008
1009#copy-button:not([disabled="true"]):hover {
1010 -moz-image-region: rect(18px, 234px, 36px, 216px);
1011}
1012
1013#copy-button[disabled="true"] {
1014 -moz-image-region: rect(36px, 234px, 54px, 216px);
1015}
1016
1017/* paste button */
1018
1019#paste-button {
1020 -moz-image-region: rect(0, 252px, 18px, 234px);
1021}
1022
1023#paste-button:not([disabled="true"]):hover {
1024 -moz-image-region: rect(18px, 252px, 36px, 234px);
1025}
1026
1027#paste-button[disabled="true"] {
1028 -moz-image-region: rect(36px, 252px, 54px, 234px);
1029}
1030
1031/* fullscreen button */
1032
1033#fullscreen-button {
1034 -moz-image-region: rect(0, 270px, 18px, 252px);
1035}
1036
1037#fullscreen-button:not([disabled="true"]):hover {
1038 -moz-image-region: rect(18px, 270px, 36px, 252px);
1039}
1040
1041#fullscreen-button[disabled="true"] {
1042 -moz-image-region: rect(36px, 270px, 54px, 252px);
1043}
1044
1045/* zoom controls */
1046
1047#zoom-out-button {
1048 -moz-image-region: rect(0, 288px, 18px, 270px);
1049 -moz-margin-end: 0;
1050}
1051
1052#zoom-in-button {
1053 -moz-image-region: rect(0, 306px, 18px, 288px);
1054}
1055
1056#zoom-out-button:not([disabled="true"]):hover {
1057 -moz-image-region: rect(18px, 288px, 36px, 270px);
1058}
1059
1060#zoom-out-button[disabled="true"] {
1061 -moz-image-region: rect(36px, 288px, 54px, 270px);
1062}
1063
1064#zoom-in-button:not([disabled="true"]):hover {
1065 -moz-image-region: rect(18px, 306px, 36px, 288px);
1066}
1067
1068#zoom-in-button[disabled="true"] {
1069 -moz-image-region: rect(36px, 306px, 54px, 288px);
1070}
1071
1072/* sync button */
1073
1074#sync-button:not([status]) {
1075 list-style-image: url("chrome://browser/skin/FxToolbar.png") !important; /* for making the palette work */
1076 -moz-image-region: rect(0, 324px, 18px, 306px);
1077}
1078
1079#sync-button[status="active"] {
1080 list-style-image: url("chrome://browser/skin/sync-throbber.png");
1081 -moz-image-region: rect(0, 18px, 18px, 0);
1082}
1083
1084#sync-button[disabled="true"] {
1085 -moz-image-region: rect(36px, 324px, 54px, 306px);
1086}
1087
1088/* feed button */
1089
1090#feed-button {
1091 -moz-image-region: rect(0, 342px, 18px, 324px);
1092}
1093
1094#feed-button[disabled="true"] {
1095 -moz-image-region: rect(36px, 342px, 54px, 324px);
1096}
1097
1098/* ::::: fullscreen window controls ::::: */
1099
1100#window-controls {
1101 -moz-margin-start: 4px;
1102}
1103
1104#minimize-button,
1105#restore-button,
1106#close-button {
1107/* padding: 0; */
1108}
1109
1110#minimize-button {
1111 list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
1112}
1113
1114#minimize-button:hover {
1115 list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
1116}
1117
1118#restore-button {
1119 list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
1120}
1121
1122#restore-button:hover {
1123 list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
1124}
1125
1126#close-button {
1127 list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
1128}
1129
1130#close-button:hover {
1131 list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
1132}
1133
1134/* ::::: Location Bar ::::: */
1135
1136#urlbar,
1137.searchbar-textbox {
1138 border-radius: 5px;
1139 margin: 0;
1140 -moz-margin-start: 3px;
1141}
1142
1143#urlbar {
1144 width: 7em;
1145 /* make color as light as possible to deal with dark non-domain parts */
1146 color: #FFBFFF;
1147}
1148
1149#urlbar:-moz-lwtheme,
1150.searchbar-textbox:-moz-lwtheme {
1151 /* background-color: rgba(255,255,255,.8);
1152 @navbarTextboxCustomBorder@
1153 color: black; */
1154}
1155
1156window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1157 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1158 #unified-back-forward-button + #urlbar-container {
1159 padding-left: 22px;
1160 -moz-margin-start: -22px;
1161 position: relative;
1162 pointer-events: none;
1163}
1164
1165window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1166 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1167 #unified-back-forward-button + #urlbar-container > #urlbar {
1168/* -moz-border-start: none;
1169 margin-left: 0; */
1170 pointer-events: all;
1171}
1172
1173window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1174 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1175 #unified-back-forward-button:not([switchingtabs]) + #urlbar-container > #urlbar {
1176 transition: margin-left 150ms ease-out;
1177}
1178
1179window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1180 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1181 #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(ltr) {
1182/* border-top-left-radius: 0;
1183 border-bottom-left-radius: 0; */
1184}
1185
1186window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1187 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1188 #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(rtl) {
1189/* border-top-right-radius: 0;
1190 border-bottom-right-radius: 0; */
1191}
1192
1193window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1194 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1195 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar {
1196 margin-left: -22px;
1197}
1198
1199window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1200 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1201 #unified-back-forward-button[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar {
1202 /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */
1203 transition-delay: 100s;
1204}
1205
1206window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1207 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1208 #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar {
1209 /* when not hovered anymore, trigger a new transition to hide the forward button immediately */
1210 margin-left: -22.01px;
1211}
1212
1213window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1214 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1215 #unified-back-forward-button + #urlbar-container:-moz-locale-dir(rtl),
1216window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1217 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1218 #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(rtl) {
1219 /* let winstripe-urlbar-back-button-clip-path clip the urlbar's right side for RTL */
1220 transform: scaleX(-1);
1221}
1222
1223html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
1224.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
1225 color: #E7ADE7;
1226}
1227
1228#urlbar:-moz-lwtheme[focused="true"],
1229.searchbar-textbox:-moz-lwtheme[focused="true"] {
1230/* background-color: white; */
1231}
1232
1233#urlbar-container {
1234 -moz-box-orient: horizontal;
1235 -moz-box-align: stretch;
1236}
1237
1238.urlbar-textbox-container {
1239 -moz-box-align: stretch;
1240}
1241
1242.urlbar-input-box {
1243 -moz-margin-start: 0;
1244 min-width: 4em;
1245}
1246
1247#urlbar-icons {
1248 -moz-box-align: center;
1249}
1250
1251.urlbar-icon {
1252 padding: 0 2px;
1253}
1254
1255.searchbar-engine-button,
1256.search-go-container {
1257 padding: 2px;
1258}
1259
1260.search-go-container > .search-go-button {
1261 padding: 0;
1262}
1263
1264.urlbar-icon:-moz-system-metric(touch-enabled) {
1265 -moz-margin-end: 1px !important;
1266 padding: 0 3px !important;
1267}
1268
1269.urlbar-icon:hover {
1270}
1271
1272.urlbar-icon[open="true"],
1273.urlbar-icon:hover:active {
1274}
1275
1276#urlbar-search-splitter {
1277 min-width: 6px;
1278 -moz-margin-start: -3px;
1279 border: none;
1280 background: transparent;
1281}
1282
1283#urlbar-search-splitter + #urlbar-container > #urlbar,
1284#urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox {
1285 -moz-margin-start: 0;
1286}
1287
1288#urlbar-display {
1289 -moz-border-end: 1px solid #9C9CFF;
1290 -moz-margin-end: 3px;
1291 margin-top: 0;
1292 margin-bottom: 0;
1293 -moz-margin-start: 0;
1294 color: #8050B0;
1295}
1296
1297/* identity box */
1298
1299#identity-box {
1300 border-radius: 2px;
1301 font-size: .9em;
1302}
1303
1304#notification-popup-box:not([hidden]) + #identity-box {
1305 -moz-padding-start: 10px !important;
1306 border-radius: 0;
1307}
1308
1309window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1310 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1311 #unified-back-forward-button + #urlbar-container > #urlbar > #identity-box {
1312/* border-radius: 0; */
1313 -moz-padding-start: 2px;
1314 -moz-padding-end: 2px;
1315 -moz-margin-end: 1px;
1316}
1317
1318window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1319 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1320 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
1321 padding-left: 2px;
1322 transition: padding-left;
1323}
1324
1325window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1326 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1327 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
1328 padding-right: 2px;
1329 transition: padding-right;
1330}
1331
1332window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1333 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1334 #unified-back-forward-button[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box {
1335 /* forward button hiding is delayed when hovered */
1336 transition-delay: 100s;
1337}
1338
1339window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1340 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1341 #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
1342 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
1343 padding-left: 2.01px;
1344}
1345
1346window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1347 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1348 #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
1349 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
1350 padding-right: 2.01px;
1351}
1352
1353#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
1354 color: #008484;
1355 -moz-border-end: 1px solid #008484;
1356 -moz-margin-end: 3px;
1357}
1358
1359#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(ltr) {
1360 border-top-right-radius: 0;
1361 border-bottom-right-radius: 0;
1362}
1363
1364#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(rtl) {
1365 border-top-left-radius: 0;
1366 border-bottom-left-radius: 0;
1367}
1368
1369#identity-box.verifiedIdentity:not(:-moz-lwtheme) {
1370 background-color: #000000;
1371}
1372
1373#identity-box:-moz-focusring {
1374 outline: 1px dotted #008484;
1375 outline-offset: -1px;
1376}
1377
1378#identity-box.verifiedDomain:-moz-focusring,
1379#identity-box.verifiedIdentity:-moz-focusring {
1380 outline-color: #000000;
1381}
1382
1383#identity-icon-labels {
1384 -moz-margin-start: 1px;
1385 -moz-margin-end: 3px;
1386}
1387
1388/* Location bar dropmarker */
1389
1390.urlbar-history-dropmarker:not(:hover):not([open="true"]) {
1391 background-color: transparent;
1392}
1393
1394#urlbar-container[combined="true"] > #urlbar > .urlbar-history-dropmarker {
1395 border: none;
1396 border-radius: 0px;
1397}
1398
1399.urlbar-history-dropmarker:hover {
1400}
1401
1402.urlbar-history-dropmarker:hover:active,
1403.urlbar-history-dropmarker[open="true"] {
1404}
1405
1406/* page proxy icon */
1407
1408#page-proxy-favicon {
1409 width: 16px;
1410 height: 16px;
1411 list-style-image: url("chrome://browser/skin/identity-icons-generic.png");
1412 -moz-image-region: rect(0, 16px, 16px, 0);
1413}
1414
1415.verifiedDomain > #page-proxy-favicon[pageproxystate="valid"] {
1416 list-style-image: url("chrome://browser/skin/identity-icons-https.png");
1417}
1418
1419.verifiedIdentity > #page-proxy-favicon[pageproxystate="valid"] {
1420 list-style-image: url("chrome://browser/skin/identity-icons-https-ev.png");
1421}
1422
1423#identity-box:hover > #page-proxy-favicon {
1424 -moz-image-region: rect(0, 32px, 16px, 16px);
1425}
1426
1427#identity-box:hover:active > #page-proxy-favicon,
1428#identity-box[open=true] > #page-proxy-favicon {
1429 -moz-image-region: rect(0, 48px, 16px, 32px);
1430}
1431
1432#identity-box:hover {
1433 background-color: #FFCF00;
1434}
1435
1436#identity-box:hover:active,
1437#identity-box[open=true] {
1438 background-color: #FF9F00;
1439}
1440
1441#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover,
1442#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover:active,
1443#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity[open=true] {
1444 background-color: #008484;
1445 color: #000000;
1446}
1447
1448#page-proxy-favicon[pageproxystate="invalid"] {
1449 opacity: 0.3;
1450}
1451
1452/* autocomplete */
1453
1454#treecolAutoCompleteImage {
1455 max-width: 36px;
1456}
1457
1458.ac-result-type-bookmark,
1459.autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
1460 list-style-image: url("chrome://browser/skin/places/bookmark.png");
1461 -moz-image-region: rect(0px 16px 16px 0px);
1462 width: 16px;
1463 height: 16px;
1464}
1465
1466.ac-result-type-keyword,
1467.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) {
1468 list-style-image: url("chrome://global/skin/icons/Search-glass.png");
1469 -moz-image-region: rect(0px 32px 16px 16px);
1470 width: 16px;
1471 height: 16px;
1472}
1473
1474.ac-result-type-tag,
1475.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
1476 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
1477 width: 16px;
1478 height: 16px;
1479}
1480
1481.ac-comment {
1482 font-size: 1.15em;
1483}
1484
1485.ac-extra > .ac-comment {
1486 font-size: inherit;
1487}
1488
1489.ac-url-text,
1490.ac-action-text {
1491 color: #9C9CFF;
1492}
1493
1494richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
1495 list-style-image: url("chrome://browser/skin/actionicon-tab.png");
1496 -moz-image-region: rect(0, 16px, 16px, 0);
1497 padding: 0 3px;
1498}
1499
1500richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
1501 -moz-image-region: rect(16px, 16px, 32px, 0);
1502}
1503
1504.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
1505 color: #8050B0;
1506}
1507
1508.ac-comment[selected="true"],
1509.ac-url-text[selected="true"],
1510.ac-action-text[selected="true"] {
1511 color: inherit !important;
1512}
1513
1514.autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
1515.autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
1516{
1517 color: #8050B0;
1518 font-size: smaller;
1519}
1520
1521.autocomplete-treebody::-moz-tree-cell(suggesthint) {
1522 border-top: 1px solid #9C9CFF;
1523}
1524
1525/* combined go/reload/stop button in location bar */
1526
1527#go-button,
1528#urlbar > toolbarbutton {
1529 list-style-image: url("chrome://browser/skin/reload-stop-go.png");
1530 /* margin: -2px; */
1531 -moz-margin-start: 0;
1532 padding: 0 2px;
1533 background-origin: border-box;
1534 border: none;
1535 -moz-border-start: 1px solid #9C9CFF;
1536}
1537
1538#go-button {
1539 padding: 0 3px;
1540}
1541
1542#urlbar:-moz-locale-dir(ltr) > toolbarbutton {
1543 border-top-left-radius: 0px;
1544 border-bottom-left-radius: 0px;
1545}
1546
1547#urlbar:-moz-locale-dir(rtl) > toolbarbutton {
1548 border-top-right-radius: 0px;
1549 border-bottom-right-radius: 0px;
1550}
1551
1552#urlbar > toolbarbutton:not([disabled]):active:hover,
1553#urlbar-reload-button:not(:hover) {
1554 -moz-border-start-style: none;
1555 -moz-padding-start: 3px;
1556}
1557
1558#urlbar > toolbarbutton:not([disabled]):active:hover {
1559}
1560
1561#urlbar-go-button {
1562 -moz-image-region: rect(0, 42px, 14px, 28px);
1563}
1564
1565#go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
1566#urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
1567 transform: scaleX(-1);
1568}
1569
1570#urlbar-go-button:hover,
1571#go-button:hover {
1572 -moz-image-region: rect(14px, 42px, 28px, 28px);
1573}
1574
1575#urlbar-reload-button {
1576 -moz-image-region: rect(0px, 14px, 14px, 0px);
1577}
1578
1579#urlbar-reload-button[disabled] {
1580 -moz-image-region: rect(28px, 14px, 42px, 0px);
1581}
1582
1583#urlbar-reload-button:not([disabled]):hover {
1584 -moz-image-region: rect(14px, 14px, 28px, 0px);
1585}
1586
1587#urlbar-stop-button {
1588 -moz-image-region: rect(0px, 28px, 14px, 14px);
1589}
1590
1591#urlbar-stop-button:hover {
1592 -moz-image-region: rect(14px, 28px, 28px, 14px);
1593}
1594
1595/* popup blocker button */
1596
1597#page-report-button {
1598 list-style-image: url("chrome://browser/skin/urlbar-popup-blocked.png");
1599 -moz-image-region: rect(0, 16px, 16px, 0);
1600}
1601
1602#page-report-button:hover ,
1603#page-report-button:hover:active,
1604#page-report-button[open="true"] {
1605 -moz-image-region: rect(0, 32px, 16px, 16px);
1606}
1607
1608/* social recommending panel */
1609
1610#share-button {
1611 -moz-image-region: rect(0, 16px, 16px, 0);
1612}
1613
1614#socialUserPortrait {
1615 width: 48px;
1616 height: 48px;
1617}
1618
1619#socialUserDisplayName,
1620#socialUserPortrait {
1621 cursor: pointer;
1622}
1623
1624#socialUserDisplayName {
1625 border: none;
1626 background-color: transparent;
1627 margin-top: 0;
1628 padding-top: 0;
1629 font-size: 130%;
1630 font-weight: bold;
1631}
1632
1633#socialUserDisplayName > .button-box {
1634 -moz-padding-start: 0;
1635 padding-top: 0;
1636 border-top-width: 0;
1637}
1638
1639#socialUserDisplayName:hover {
1640 color: #9C9CFF;
1641 text-decoration: underline;
1642}
1643
1644#unsharePopupText {
1645 height: 48px;
1646}
1647
1648#unsharePopupBottomButtons {
1649 margin-top: 1em;
1650}
1651
1652/* star button */
1653
1654#star-button {
1655 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark.png");
1656 -moz-image-region: rect(16px 16px 32px 0px);
1657}
1658
1659#star-button:hover {
1660 -moz-image-region: rect(16px 32px 32px 16px);
1661}
1662
1663#star-button:hover:active {
1664 -moz-image-region: rect(16px 48px 32px 32px);
1665}
1666
1667#star-button[starred="true"] {
1668 -moz-image-region: rect(0px 16px 16px 0px);
1669}
1670
1671#star-button[starred="true"]:hover {
1672 -moz-image-region: rect(0px 32px 16px 16px);
1673}
1674
1675#star-button[starred="true"]:hover:active {
1676 -moz-image-region: rect(0px 48px 16px 32px);
1677}
1678
1679/* bookmarking panel */
1680#editBookmarkPanelStarIcon {
1681 list-style-image: url("chrome://browser/skin/places/starred48.png");
1682 width: 48px;
1683 height: 48px;
1684}
1685
1686#editBookmarkPanelStarIcon[unstarred] {
1687 list-style-image: url("chrome://browser/skin/places/unstarred48.png");
1688}
1689
1690#editBookmarkPanelTitle {
1691 font-size: 130%;
1692}
1693
1694#editBookmarkPanelHeader,
1695#editBookmarkPanelContent {
1696 margin-bottom: .5em;
1697}
1698
1699/* Implements editBookmarkPanel resizing on folderTree un-collapse. */
1700#editBMPanel_folderTree {
1701 min-width: 27em;
1702}
1703
1704.panel-promo-box {
1705 margin: 5px -6px -6px;
1706 padding: 5px;
1707 border-top: 1px solid #9C9CFF;
1708 border-bottom-left-radius: 5px;
1709 border-bottom-right-radius: 5px;
1710}
1711
1712.panel-promo-icon {
1713 list-style-image: url("chrome://browser/skin/sync-notification-24.png");
1714 -moz-margin-end: 10px;
1715 vertical-align: middle;
1716}
1717
1718.panel-promo-closebutton {
1719 list-style-image: url("chrome://global/skin/icons/close-button.gif");
1720 -moz-margin-end: -3px;
1721 margin-top: -3px;
1722}
1723
1724.panel-promo-closebutton:hover {
1725 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1726}
1727
1728.panel-promo-closebutton:hover:active {
1729 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1730}
1731
1732.panel-promo-closebutton > .toolbarbutton-text {
1733 padding: 0;
1734 margin: 0;
1735}
1736
1737/* ::::: content area ::::: */
1738
1739#sidebar {
1740 background-color: Window;
1741}
1742
1743#sidebar-title {
1744 -moz-padding-start: 0px;
1745}
1746
1747/* ::::: throbber ::::: */
1748
1749#navigator-throbber {
1750 width: 16px;
1751 min-height: 16px;
1752 margin: 0 3px;
1753}
1754
1755#navigator-throbber[busy="true"] {
1756 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
1757}
1758
1759#navigator-throbber,
1760#wrapper-navigator-throbber > #navigator-throbber {
1761 list-style-image: url("chrome://communicator/skin/brand/throbber16-single.png");
1762}
1763
1764/* Tabstrip */
1765
1766#TabsToolbar {
1767 min-height: 0;
1768 padding: 0;
1769 -moz-binding: url("chrome://global/content/bindings/toolbar.xml#toolbar");
1770}
1771
1772#TabsToolbar .toolbar-holder {
1773 background-color: #000000; /* correct effect of being an actual toolbar */
1774}
1775
1776#main-window[disablechrome] #TabsToolbar,
1777#TabsToolbar[tabsontop="false"] {
1778 border-bottom: 1px solid #008484;
1779}
1780
1781.tabbrowser-tab,
1782.tabs-newtab-button {
1783 margin-top: 0px;
1784}
1785
1786.tabbrowser-tab{
1787 padding: 1px 4px 2px;
1788}
1789
1790.tabbrowser-tab:first-of-type {
1791 -moz-margin-start: 2px;
1792}
1793
1794.tabs-newtab-button {
1795 border-radius: 8px 8px 0px 0px;
1796 -moz-margin-start: 0;
1797}
1798
1799.tabs-newtab-button:not(:hover) {
1800 background-color: #C09070;
1801}
1802
1803.tabbrowser-tab:hover,
1804.tabs-newtab-button:hover {
1805}
1806
1807.tabbrowser-tab[selected="true"] {
1808}
1809
1810#main-window[tabsontop=false]:not([disablechrome]) .tabbrowser-tab[selected=true]:not(:-moz-lwtheme) {
1811}
1812
1813.tabbrowser-tab:-moz-lwtheme {
1814}
1815
1816.tabbrowser-tab[selected="true"]:-moz-lwtheme {
1817}
1818
1819.tabbrowser-tab:-moz-lwtheme-brighttext:not([selected="true"]),
1820.tabs-newtab-button:-moz-lwtheme-brighttext {
1821}
1822
1823.tabbrowser-tab:-moz-lwtheme-brighttext:not([selected="true"]):hover,
1824.tabs-newtab-button:-moz-lwtheme-brighttext:hover {
1825}
1826
1827.tabbrowser-tab:-moz-lwtheme-darktext:not([selected="true"]),
1828.tabs-newtab-button:-moz-lwtheme-darktext {
1829}
1830
1831.tabbrowser-tab:-moz-lwtheme-darktext:not([selected="true"]):hover,
1832.tabs-newtab-button:-moz-lwtheme-darktext:hover {
1833}
1834
1835.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) {
1836 background-color: #E7ADE7;
1837}
1838.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]):hover {
1839 background-color: #3333FF;
1840 color: #000000;
1841}
1842
1843.tab-throbber,
1844.tab-icon-image {
1845 width: 16px;
1846 height: 16px;
1847 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
1848 -moz-image-region: auto;
1849 -moz-margin-end: 3px;
1850}
1851
1852.tab-throbber {
1853 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim-connect.png");
1854}
1855
1856.tab-throbber[progress] {
1857 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
1858}
1859
1860.tab-throbber[pinned],
1861.tab-icon-image[pinned] {
1862 -moz-margin-start: 2px;
1863 -moz-margin-end: 2px;
1864}
1865
1866/* tabbrowser-tab focus ring */
1867.tabbrowser-tab:focus > .tab-stack {
1868 outline: 1px dotted;
1869}
1870
1871/* Tab DnD indicator */
1872.tab-drop-indicator {
1873 list-style-image: url("chrome://browser/skin/tabbrowser/tabDragIndicator.png");
1874 margin-bottom: -11px;
1875}
1876
1877/* Tab close button */
1878.tab-close-button {
1879 border: none;
1880 padding: 0px;
1881 margin-top: 1px;
1882 list-style-image: url("chrome://global/skin/icons/close-button.gif");
1883}
1884
1885.tab-close-button:-moz-system-metric(touch-enabled) {
1886 transform: scale(1.2);
1887}
1888
1889.tab-close-button:hover,
1890.tab-close-button:hover[selected="true"] {
1891 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1892}
1893
1894.tab-close-button:hover:active,
1895.tab-close-button:hover:active[selected="true"] {
1896 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
1897}
1898
1899/* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */
1900
1901@media (-moz-touch-enabled) {
1902 .tabbrowser-arrowscrollbox > .scrollbutton-up,
1903 .tabbrowser-arrowscrollbox > .scrollbutton-down,
1904 #TabsToolbar .toolbarbutton-1 {
1905 min-width: 8.1mozmm;
1906 }
1907
1908 .tabs-newtab-button {
1909 min-width: 10mozmm;
1910 }
1911
1912 .tab-content {
1913 min-height: calc(6.8mozmm - 7px); /* subtract borders from the desired height */
1914 }
1915}
1916
1917.tabbrowser-arrowscrollbox > .scrollbutton-up,
1918.tabbrowser-arrowscrollbox > .scrollbutton-down {
1919 margin: 0;
1920 padding-top: 0;
1921 padding-bottom: 0;
1922}
1923
1924.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
1925 background-color: #008484;
1926}
1927
1928.tabs-newtab-button > .toolbarbutton-icon {
1929 margin-top: -1px;
1930 margin-bottom: -1px;
1931}
1932
1933.tabs-newtab-button,
1934#TabsToolbar > #new-tab-button,
1935#TabsToolbar > toolbarpaletteitem > #new-tab-button {
1936 list-style-image: url("chrome://browser/skin/tabbrowser/newtab.png");
1937 -moz-image-region: rect(0, 16px, 18px, 0);
1938}
1939
1940.tabs-newtab-button {
1941 width: 28px;
1942}
1943
1944#TabsToolbar > #new-tab-button {
1945 width: 26px;
1946}
1947
1948.tabs-newtab-button,
1949.tabs-newtab-button:hover,
1950#TabsToolbar > #new-tab-button:hover {
1951 -moz-image-region: rect(0, 32px, 18px, 16px);
1952}
1953
1954#alltabs-button {
1955 list-style-image: url("chrome://browser/skin/tabbrowser/alltabs.png");
1956 -moz-image-region: rect(0, 14px, 16px, 0);
1957}
1958
1959#alltabs-button:hover,
1960#alltabs-button:hover:active {
1961 -moz-image-region: rect(0, 28px, 16px, 14px);
1962}
1963
1964#alltabs-button[type="menu"] {
1965 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
1966 -moz-image-region: auto;
1967}
1968
1969#alltabs-button[type="menu"] > .toolbarbutton-menu-dropmarker {
1970 display: none;
1971}
1972
1973#alltabs-button[type="menu"]:hover,
1974#alltabs-button[type="menu"]:hover:active,
1975#alltabs-button[type="menu"][open="true"] {
1976 list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
1977 -moz-image-region: auto;
1978}
1979
1980/* All tabs menupopup */
1981.alltabs-item > .menu-iconic-left > .menu-iconic-icon {
1982 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
1983 -moz-image-region: auto;
1984}
1985
1986.alltabs-item[selected="true"] {
1987 font-weight: bold;
1988}
1989
1990.alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon {
1991 list-style-image: url("chrome://global/skin/icons/loading.gif");
1992}
1993
1994.alltabs-item[tabIsVisible]:not([_moz-menuactive="true"]) {
1995 background-color: #402800;
1996}
1997
1998/* Tabstrip close button */
1999.tabs-closebutton {
2000 -moz-box-flex: 1;
2001 margin: 0px;
2002 padding: 2px;
2003 list-style-image: url("chrome://global/skin/icons/close-button.gif");
2004}
2005
2006.tabs-closebutton > .toolbarbutton-icon {
2007}
2008
2009.tabs-closebutton > .toolbarbutton-text {
2010 display: none;
2011}
2012
2013.tabs-closebutton:hover,
2014.tabs-closebutton:hover:active {
2015 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2016}
2017
2018toolbarbutton.chevron {
2019 list-style-image: url("chrome://global/skin/toolbar/chevron.gif") !important;
2020}
2021
2022toolbarbutton.chevron:hover {
2023 list-style-image: url("chrome://global/skin/toolbar/chevron-hover.gif") !important;
2024}
2025
2026toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon,
2027toolbarbutton.chevron:-moz-locale-dir(rtl):hover > .toolbarbutton-icon {
2028 transform: scaleX(-1);
2029}
2030
2031toolbarbutton.chevron > .toolbarbutton-text,
2032toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
2033 display: none;
2034}
2035
2036toolbarbutton.chevron > .toolbarbutton-icon {
2037 margin: 0;
2038}
2039
2040toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
2041 display: -moz-box; /* display chevron icon in text mode */
2042}
2043
2044#sidebar-throbber[loading="true"] {
2045 list-style-image: url("chrome://global/skin/icons/loading.gif");
2046 -moz-margin-end: 4px;
2047}
2048
2049/* Bookmarks toolbar */
2050#PlacesToolbarDropIndicator {
2051 list-style-image: url("chrome://communicator/skin/bookmarks/toolbarDropMarker.png");
2052}
2053
2054toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2055 background-color: #008484 !important;
2056 color: #FFCF00 !important;
2057}
2058
2059/* rules for menupopup drop indicators */
2060.menupopup-drop-indicator-bar {
2061 position: relative;
2062 /* these two margins must together compensate the indicator's height */
2063 margin-top: -1px;
2064 margin-bottom: -1px;
2065}
2066
2067.menupopup-drop-indicator {
2068 list-style-image: none;
2069 height: 2px;
2070 -moz-margin-end: -4em;
2071 background-color: #008484;
2072}
2073
2074/* ::::: Identity Indicator Styling ::::: */
2075
2076/* Popup Icons */
2077#identity-popup-icon {
2078 height: 64px;
2079 width: 64px;
2080 padding: 0;
2081 list-style-image: url("chrome://browser/skin/identity.png");
2082 -moz-image-region: rect(0px, 64px, 64px, 0px);
2083}
2084
2085#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
2086 -moz-image-region: rect(64px, 64px, 128px, 0px);
2087}
2088
2089#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
2090 -moz-image-region: rect(128px, 64px, 192px, 0px);
2091}
2092
2093/* Popup Body Text */
2094.identity-popup-description {
2095 white-space: pre-wrap;
2096 -moz-padding-start: 15px;
2097 margin: 2px 0 4px;
2098}
2099
2100.identity-popup-label {
2101 white-space: pre-wrap;
2102 -moz-padding-start: 15px;
2103 margin: 0;
2104}
2105
2106#identity-popup-content-host,
2107#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner {
2108 font-size: 1.2em;
2109}
2110
2111#identity-popup-content-host {
2112 margin-top: 3px;
2113 margin-bottom: 5px;
2114 font-weight: bold;
2115 max-width: 300px;
2116}
2117
2118#identity-popup-content-owner {
2119 margin-top: 4px;
2120 margin-bottom: 0 !important;
2121 font-weight: bold;
2122 max-width: 300px;
2123}
2124
2125.verifiedDomain > #identity-popup-content-owner {
2126 font-weight: normal;
2127}
2128
2129#identity-popup-content-verifier {
2130 margin: 4px 0 2px;
2131}
2132
2133#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
2134#identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
2135 margin-top: 10px;
2136 -moz-margin-start: -24px;
2137}
2138
2139#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
2140#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
2141 list-style-image: url("chrome://browser/skin/Secure24.png");
2142}
2143
2144#identity-popup-more-info-button {
2145 margin-top: 6px;
2146 margin-bottom: 0;
2147 -moz-margin-end: 0;
2148}
2149
2150.popup-notification-icon {
2151 width: 64px;
2152 height: 64px;
2153 -moz-margin-end: 10px;
2154}
2155
2156.popup-notification-icon[popupid="geolocation"] {
2157 list-style-image: url("chrome://browser/skin/Geolocation-64.png");
2158}
2159
2160.popup-notification-icon[popupid="xpinstall-disabled"],
2161.popup-notification-icon[popupid="addon-progress"],
2162.popup-notification-icon[popupid="addon-install-cancelled"],
2163.popup-notification-icon[popupid="addon-install-blocked"],
2164.popup-notification-icon[popupid="addon-install-failed"],
2165.popup-notification-icon[popupid="addon-install-complete"] {
2166 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
2167 width: 32px;
2168 height: 32px;
2169}
2170
2171.popup-notification-icon[popupid="click-to-play-plugins"] {
2172 list-style-image: url("chrome://mozapps/skin/plugins/pluginBlocked-64.png");
2173}
2174
2175.addon-progress-description {
2176 width: 350px;
2177 max-width: 350px;
2178}
2179
2180.popup-progress-label,
2181.popup-progress-meter {
2182 -moz-margin-start: 0;
2183 -moz-margin-end: 0;
2184}
2185
2186.popup-progress-cancel {
2187 -moz-appearance: none;
2188 background: transparent;
2189 border: none;
2190 padding: 0;
2191 margin: 0;
2192 min-height: 0;
2193 min-width: 0;
2194 list-style-image: url("chrome://mozapps/skin/downloads/downloadButtons.png");
2195 -moz-image-region: rect(0px, 32px, 16px, 16px);
2196}
2197
2198.popup-progress-cancel:hover {
2199 -moz-image-region: rect(16px, 32px, 32px, 16px);
2200}
2201
2202.popup-progress-cancel:active {
2203 -moz-image-region: rect(32px, 32px, 48px, 16px);
2204}
2205
2206.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
2207.popup-notification-icon[popupid="indexedDB-quota-prompt"] {
2208 list-style-image: url("chrome://global/skin/icons/alert-question.gif");
2209}
2210
2211.popup-notification-icon[popupid="password-save"],
2212.popup-notification-icon[popupid="password-change"] {
2213 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-64.png");
2214}
2215
2216.popup-notification-icon[popupid="webapps-install"] {
2217 list-style-image: url("chrome://browser/skin/webapps-64.png");
2218}
2219
2220.popup-notification-icon[popupid="webRTC-sharingDevices"],
2221.popup-notification-icon[popupid="webRTC-shareDevices"] {
2222 list-style-image: url("chrome://browser/skin/webRTC-shareDevice-64.png");
2223}
2224
2225/* Notification icon box */
2226#notification-popup-box {
2227 position: relative;
2228 background-color: #000000;
2229 background-clip: padding-box;
2230 padding-left: 3px;
2231 padding-right: 8px;
2232 border-radius: 3px 0 0 3px;
2233 -moz-border-image: url("chrome://browser/skin/urlbar-arrow.png") 0 8 0 0 / 0 8px 0 0;
2234 -moz-margin-end: -8px;
2235 border-right-width: 8px;
2236}
2237
2238window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
2239 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
2240 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box {
2241/* padding-left: 5px; */
2242}
2243
2244#notification-popup-box:-moz-locale-dir(rtl),
2245.notification-anchor-icon:-moz-locale-dir(rtl) {
2246 transform: scaleX(-1);
2247}
2248
2249.notification-anchor-icon {
2250 width: 16px;
2251 height: 16px;
2252 margin: 0 2px;
2253}
2254
2255.notification-anchor-icon:-moz-focusring {
2256 outline: 1px dotted #008484;
2257/* outline-offset: -3px; */
2258}
2259
2260#default-notification-icon {
2261 list-style-image: url("chrome://global/skin/icons/information-16.png");
2262}
2263
2264#identity-notification-icon {
2265 list-style-image: url("chrome://mozapps/skin/profile/profileicon.png");
2266}
2267
2268#geo-notification-icon {
2269 list-style-image: url("chrome://browser/skin/Geolocation-16.png");
2270}
2271
2272#addons-notification-icon {
2273 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
2274}
2275
2276#indexedDB-notification-icon {
2277 list-style-image: url("chrome://global/skin/icons/question-16.png");
2278}
2279
2280#password-notification-icon {
2281 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-16.png");
2282}
2283
2284#webapps-notification-icon {
2285 list-style-image: url("chrome://browser/skin/webapps-16.png");
2286}
2287
2288#plugins-notification-icon {
2289 list-style-image: url("chrome://mozapps/skin/plugins/pluginGeneric-16.png");
2290}
2291
2292#blocked-plugins-notification-icon {
2293 list-style-image: url("chrome://mozapps/skin/plugins/notifyPluginBlocked.png");
2294}
2295
2296#blocked-plugins-notification-icon[showing] {
2297 animation: pluginBlockedNotification 500ms ease 0s 5 alternate both;
2298}
2299
2300@keyframes pluginBlockedNotification {
2301 from {
2302 opacity: 0;
2303 }
2304 to {
2305 opacity: 1;
2306 }
2307}
2308
2309#webRTC-sharingDevices-notification-icon,
2310#webRTC-shareDevices-notification-icon {
2311 list-style-image: url("chrome://browser/skin/webRTC-shareDevice-16.png");
2312}
2313
2314#identity-popup-container {
2315 min-width: 280px;
2316}
2317
2318#download-monitor {
2319 list-style-image: url("chrome://browser/skin/FxToolbar.png");
2320 -moz-image-region: rect(0, 108px, 18px, 90px);
2321}
2322
2323/* Bookmarks roots menu-items */
2324#appmenu_subscribeToPage:not([disabled]),
2325#appmenu_subscribeToPageMenu,
2326#subscribeToPageMenuitem:not([disabled]),
2327#subscribeToPageMenupopup,
2328#BMB_subscribeToPageMenuitem:not([disabled]),
2329#BMB_subscribeToPageMenupopup {
2330 list-style-image: url("chrome://browser/skin/feeds/feedIcon16.png");
2331}
2332
2333#bookmarksToolbarFolderMenu,
2334#appmenu_bookmarksToolbar,
2335#BMB_bookmarksToolbar {
2336 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png");
2337 -moz-image-region: auto;
2338}
2339
2340#appmenu_unsortedBookmarks,
2341#BMB_unsortedBookmarks {
2342 list-style-image: url("chrome://communicator/skin/bookmarks/unsortedBookmarks.png");
2343 -moz-image-region: auto;
2344}
2345
2346/* ::::: Keyboard UI Panel ::::: */
2347
2348.KUI-panel {
2349 color: #FF9F00;
2350 border-style: none;
2351 border-radius: 20px;
2352}
2353
2354.KUI-panel[level="top"] {
2355 /*background-color: rgba(27%,27%,27%,.65);*/
2356}
2357
2358.KUI-panel-closebutton {
2359 list-style-image: url("KUI-close.png");
2360 width: 24px;
2361 height: 24px;
2362}
2363
2364.KUI-panel-closebutton:not(:hover) {
2365}
2366
2367.KUI-panel-closebutton > .toolbarbutton-icon {
2368}
2369
2370/* ::::: Ctrl-Tab and All Tabs Panels ::::: */
2371
2372/* Ctrl-Tab */
2373
2374#ctrlTab-panel {
2375 padding: 20px 10px 10px;
2376 font-weight: bold;
2377}
2378
2379.ctrlTab-favicon[src] {
2380 background-color: #000000;
2381 width: 20px;
2382 height: 20px;
2383 padding: 2px;
2384}
2385
2386.ctrlTab-preview-inner > .tabPreview-canvas {
2387}
2388
2389.ctrlTab-preview:not(#ctrlTab-showAll) > * > .ctrlTab-preview-inner > .tabPreview-canvas {
2390 margin-bottom: 2px;
2391}
2392
2393.ctrlTab-preview-inner {
2394 padding-bottom: 10px;
2395}
2396
2397#ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
2398 padding: 10px;
2399 background-color: #000000;
2400 border-radius: .5em;
2401}
2402
2403.ctrlTab-preview:focus > * > .ctrlTab-preview-inner {
2404 color: white;
2405 background-color: #000000;
2406 text-shadow: none;
2407 padding: 8px;
2408 border: 2px solid #9C9CFF;
2409 border-radius: .5em;
2410}
2411
2412.ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
2413 margin: -10px -10px 0;
2414}
2415
2416#ctrlTab-showAll {
2417 margin-top: .5em;
2418}
2419
2420/* All Tabs */
2421
2422#allTabs-panel {
2423 padding-bottom: 10px;
2424}
2425
2426#allTabs-meta {
2427 margin: 10px;
2428}
2429
2430#allTabs-filter {
2431 -moz-margin-start: 24px;
2432 -moz-margin-end: 0;
2433}
2434
2435#allTabs-tab-close-button > .toolbarbutton-icon {
2436 margin: 0;
2437}
2438
2439.allTabs-favicon[src] {
2440 width: 22px;
2441 height: 22px;
2442 padding-top: 1px;
2443 padding-bottom: 5px;
2444 -moz-padding-start: 1px;
2445 -moz-padding-end: 5px;
2446 margin-top: -2px;
2447 -moz-margin-start: -2px;
2448 border-bottom-right-radius: 4px;
2449}
2450
2451.allTabs-favicon[src]:-moz-locale-dir(rtl) {
2452 border-bottom-right-radius: 0;
2453 border-bottom-left-radius: 4px;
2454}
2455
2456.allTabs-preview-inner > .tabPreview-canvas {
2457 background-color: #E7ADE7;
2458}
2459
2460.allTabs-preview:not(:hover):not([closebuttonhover]) > html|canvas {
2461}
2462
2463.allTabs-preview:focus > * > .allTabs-preview-inner {
2464 outline: 1px dotted #008484;
2465}
2466
2467/* Add-on bar */
2468
2469#addon-bar {
2470 min-height: 20px;
2471 border-top: 3px solid #000000;
2472 border-bottom-width: 0;
2473}
2474
2475#addon-bar .toolbar-holder {
2476 background-color: #8050B0;
2477 color: #FFCF00;
2478}
2479
2480#addon-bar .toolbar-holder {
2481 background-color: #8050B0;
2482 color: #FFCF00;
2483}
2484
2485#addon-bar .toolbar-startcap,
2486#addon-bar .toolbar-endcap{
2487 background-color: #6000CF;
2488}
2489
2490#status-bar {
2491 -moz-binding: url("chrome://global/content/bindings/general.xml#statusbar");
2492 margin-top: .3em;
2493 border-width: 0;
2494}
2495
2496#addon-bar[customizing] > #status-bar {
2497 opacity: .5;
2498/* background-image: -moz-repeating-linear-gradient(-45deg,
2499 rgba(255,255,255,.3), rgba(255,255,255,.3) 5px,
2500 rgba(0,0,0,.3) 5px, rgba(0,0,0,.3) 10px);*/
2501}
2502
2503/* Remove all borders from statusbarpanel children of
2504 the statusbar.
2505#status-bar > statusbarpanel {
2506 border-width: 0;
2507} */
2508
2509#addonbar-closebutton {
2510 border: none;
2511 padding: 3px 5px;
2512 list-style-image: url("chrome://global/skin/icons/close-button.gif");
2513}
2514
2515#addonbar-closebutton:hover,
2516#addonbar-closebutton:hover:active {
2517 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2518}
2519
2520/* Status panel */
2521
2522.statuspanel-label {
2523 margin: 0;
2524 padding: 2px 4px;
2525 background: #404000;
2526 border: 1px none #9C9CFF;
2527 border-top-style: solid;
2528 color: #FF9F00;
2529 text-shadow: none;
2530}
2531
2532.statuspanel-label:-moz-locale-dir(ltr):not([mirror]),
2533.statuspanel-label:-moz-locale-dir(rtl)[mirror] {
2534 border-right-style: solid;
2535 border-top-right-radius: .3em;
2536 margin-right: 1em;
2537}
2538
2539.statuspanel-label:-moz-locale-dir(rtl):not([mirror]),
2540.statuspanel-label:-moz-locale-dir(ltr)[mirror] {
2541 border-left-style: solid;
2542 border-top-left-radius: .3em;
2543 margin-left: 1em;
2544}
2545
2546/* HACK to abolish devily color on main content */
2547
2548#content {
2549 background-color: transparent !important;
2550}
2551
2552/* Highlighter */
2553
2554.highlighter-outline {
2555 box-shadow: 0 0 0 1px black;
2556 outline: 1px dashed white;
2557}
2558
2559.highlighter-outline[locked] {
2560 box-shadow: 0 0 0 1px rgba(0,0,0,0.3);
2561 outline-color: rgba(255,255,255,0.7);
2562}
2563
2564/* Developer toolbar */
2565
2566#developer-toolbar {
2567 border-top: 3px solid #000000;
2568 border-bottom: none;
2569}
2570
2571#developer-toolbar .toolbar-holder {
2572 background-color: #8050B0;
2573 color: #FFCF00;
2574}
2575
2576#developer-toolbar .toolbar-holder {
2577 background-color: #8050B0;
2578 color: #FFCF00;
2579}
2580
2581#developer-toolbar .toolbar-startcap,
2582#developer-toolbar .toolbar-endcap{
2583 background-color: #6000CF;
2584}
2585
2586/* Highlighter - Node Infobar */
2587
2588.highlighter-nodeinfobar {
2589 color: #FF9F00;
2590 border: 1px solid rgba(156, 156, 255, .5);
2591 border-radius: 3px;
2592 background-color: #000000;
2593 background-clip: padding-box;
2594}
2595
2596/* Highlighter - Node Infobar - text */
2597
2598.highlighter-nodeinfobar-text {
2599 /* 100% - size of the buttons and margins */
2600 max-width: calc(100% - 2 * (26px + 6px));
2601 padding-bottom: 1px;
2602}
2603
2604html|*.highlighter-nodeinfobar-tagname {
2605 color: #FFCF00;
2606}
2607
2608html|*.highlighter-nodeinfobar-id {
2609 color: #9C9CFF;
2610}
2611
2612html|*.highlighter-nodeinfobar-pseudo-classes {
2613 color: #FF9F00;
2614}
2615
2616/* Highlighter - Node Infobar - buttons */
2617
2618.highlighter-nodeinfobar-button {
2619 padding: 0;
2620 width: 26px;
2621 min-height: 26px;
2622}
2623
2624.highlighter-nodeinfobar-inspectbutton {
2625 list-style-image: url("chrome://browser/skin/devtools/inspect-button.png");
2626 -moz-image-region: rect(0px 16px 16px 0px);
2627 -moz-margin-start: 0px;
2628 -moz-margin-end: 2px;
2629}
2630
2631.highlighter-nodeinfobar-inspectbutton:-moz-locale-dir(rtl) {
2632}
2633
2634.highlighter-nodeinfobar-inspectbutton:hover,
2635.highlighter-nodeinfobar-inspectbutton:hover:active/*,
2636.highlighter-nodeinfobar-container:not([locked]) > .highlighter-nodeinfobar > .highlighter-nodeinfobar-inspectbutton*/ {
2637 -moz-image-region: rect(0px 32px 16px 16px);
2638}
2639
2640.highlighter-nodeinfobar-menu {
2641}
2642
2643.highlighter-nodeinfobar-menu:-moz-locale-dir(rtl) {
2644}
2645
2646.highlighter-nodeinfobar-menu > .toolbarbutton-menu-dropmarker {
2647 -moz-box-align: center;
2648 -moz-margin-start: -1px;
2649}
2650
2651/* Highlighter - Node Infobar - box & arrow */
2652
2653.highlighter-nodeinfobar-arrow {
2654 width: 14px;
2655 height: 14px;
2656 -moz-margin-start: calc(50% - 7px);
2657 transform: rotate(-45deg);
2658 border: 1px solid transparent;
2659 background-clip: padding-box;
2660 background-repeat: no-repeat;
2661}
2662
2663.highlighter-nodeinfobar-arrow-top {
2664 margin-bottom: -8px;
2665 margin-top: 8px;
2666 border-right-color: rgba(0, 132, 132, .5);
2667 border-top-color: rgba(0, 132, 132, .5);
2668 background-image: linear-gradient(bottom left, transparent 50%, rgb(0, 132, 132) 50%);
2669}
2670
2671.highlighter-nodeinfobar-arrow-bottom {
2672 margin-top: -8px;
2673 margin-bottom: 8px;
2674 border-left-color: rgba(0, 132, 132, .5);
2675 border-bottom-color: rgba(0, 132, 132, .5);
2676 background-image: linear-gradient(top right, transparent 50%, rgb(0, 132, 132) 50%);
2677}
2678
2679.highlighter-nodeinfobar-container[position="top"] > .highlighter-nodeinfobar,
2680.highlighter-nodeinfobar-container[position="overlap"] > .highlighter-nodeinfobar {
2681 box-shadow: 0 1px 0 hsla(0, 0%, 100%, .1) inset;
2682}
2683
2684.highlighter-nodeinfobar-container[hide-arrow] > .highlighter-nodeinfobar {
2685 margin: 7px 0;
2686}
2687
2688#full-screen-warning-message {
2689 background-color: #000000;
2690 color: #FF9F00;
2691 border-radius: 8px;
2692 margin-top: 30px;
2693 padding: 30px 50px;
2694 box-shadow: 0 0 2px #9C9CFF;
2695}
2696
2697#full-screen-warning-container[obscure-browser] {
2698 background-color: rgba(0,0,0,0.3);
2699}
2700
2701.full-screen-description {
2702 font-size: 150%;
2703}
2704
2705#full-screen-domain-text {
2706 font-size: 300%;
2707}
2708
2709.full-screen-approval-button,
2710#full-screen-remember-decision {
2711 font-size: 120%;
2712}
2713
2714html|*#gcli-tooltip-frame,
2715html|*#gcli-output-frame {
2716 padding: 0;
2717 border-width: 0;
2718 background-color: transparent;
2719}
2720
2721#gcli-output,
2722#gcli-tooltip {
2723 border-width: 0;
2724 background-color: transparent;
2725 margin-bottom: -2px;
2726}
2727
2728.gclitoolbar-input-node,
2729.gclitoolbar-complete-node,
2730.gclitoolbar-prompt {
2731 margin: 1px 3px;
2732 -moz-box-align: center;
2733 padding-top: 0;
2734 padding-bottom: 0;
2735 padding-right: 4px;
2736 background-color: transparent;
2737 border-radius: 3px;
2738 text-shadow: none;
2739}
2740
2741.gclitoolbar-input-node {
2742 padding-left: 20px;
2743}
2744
2745.gclitoolbar-input-node:not([focused="true"]) {
2746 border-color: transparent;
2747}
2748
2749.gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection {
2750 background-color: #008484;
2751 color: #000000;
2752 text-shadow: none;
2753}
2754
2755.gclitoolbar-complete-node {
2756 padding-left: 21px;
2757 background-color: transparent;
2758 color: transparent;
2759}
2760
2761.gclitoolbar-prompt {
2762 padding-left: 4px;
2763 padding-bottom: 2px;
2764 font-size: 150%;
2765 font-weight: bold;
2766 color: #E7ADE7;
2767 background-color: #000000;
2768}
2769
2770.gclitoolbar-prompt-label,
2771.gcli-in-incomplete,
2772.gcli-in-error,
2773.gcli-in-ontab,
2774.gcli-in-todo,
2775.gcli-in-closebrace,
2776.gcli-in-param,
2777.gcli-in-valid {
2778 margin: 0;
2779 padding: 0;
2780}
2781
2782.gcli-in-incomplete {
2783 border-bottom: 2px dotted #8050B0;
2784}
2785
2786.gcli-in-error {
2787 border-bottom: 2px dotted #FF0000;
2788}
2789
2790.gcli-in-ontab {
2791 color: #9C9CFF;
2792}
2793
2794.gcli-in-todo {
2795 color: #795900;
2796}
2797
2798.gcli-in-closebrace {
2799 color: #8050B0;
2800}
2801
2802/* Responsive Mode */
2803
2804.browserContainer[responsivemode] {
2805 background: #221500 url("chrome://browser/skin/devtools/responsive-background.png");
2806 padding: 0 20px 20px 20px;
2807}
2808
2809.browserStack[responsivemode] {
2810 box-shadow: 0 0 7px #9C9CFF;
2811}
2812
2813.devtools-responsiveui-toolbar {
2814 background: transparent;
2815 margin: 10px 0;
2816 padding: 0;
2817 box-shadow: none;
2818 border-bottom-width: 0;
2819}
2820
2821.devtools-responsiveui-toolbar > menulist,
2822.devtools-responsiveui-toolbar > toolbarbutton {
2823 min-width: 22px;
2824 border-radius: 0;
2825}
2826
2827.devtools-responsiveui-toolbar:-moz-locale-dir(ltr) > *:first-child,
2828.devtools-responsiveui-toolbar:-moz-locale-dir(rtl) > *:last-child {
2829 margin-left: 0;
2830}
2831
2832.devtools-responsiveui-resizebar {
2833 width: 7px;
2834 height: 24px;
2835 cursor: ew-resize;
2836 transform: translate(12px, -12px);
2837 background-image: url("chrome://browser/skin/devtools/responsive-vertical-resizer.png");
2838}
2839
2840.devtools-responsiveui-resizehandle {
2841 width: 16px;
2842 height: 16px;
2843 cursor: se-resize;
2844 transform: translate(12px, 12px);
2845 background-image: url("chrome://browser/skin/devtools/responsive-se-resizer.png");
2846}
2847
2848/* Web Console */
2849
2850.web-console-frame {
2851 /* border-bottom: 3px solid #000000; */
2852}
2853
2854.web-console-frame[animated] {
2855 transition: height 100ms;
2856}
2857
2858/* Developer Toolbar */
2859
2860#developer-toolbar-toolbox-button {
2861 min-width: 18px;
2862}
2863
2864#developer-toolbar-toolbox-button > .toolbarbutton-text {
2865 display: none;
2866}
2867
2868.developer-toolbar-button {
2869 min-width: 78px;
2870 min-height: 21px;
2871 margin: 0 1px;
2872 list-style-image: url("chrome://browser/skin/devtools/tools-icons-small.png");
2873}
2874
2875.developer-toolbar-button[open=true],
2876.developer-toolbar-button:active:hover,
2877.developer-toolbar-button[checked=true] {
2878}
2879
2880.developer-toolbar-button[checked=true] {
2881}
2882
2883#developer-toolbar-toolbox-button {
2884 -moz-image-region: rect(64px, 16px, 80px, 0);
2885}
2886
2887/* Error counter */
2888
2889#developer-toolbar-toolbox-button[error-count]:before {
2890 color: #000000;
2891 min-width: 16px;
2892 text-shadow: none;
2893 background-color: #FF0000;
2894 border-radius: 1px;
2895 -moz-margin-end: 5px;
2896}
2897
2898/* Social toolbar item */
2899
2900#social-provider-button {
2901 -moz-image-region: rect(0, 16px, 16px, 0);
2902}
2903
2904#social-provider-button > .toolbarbutton-menu-dropmarker {
2905 display: none;
2906}
2907
2908#social-toolbar-item > .toolbarbutton-1 {
2909}
2910
2911#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar > #social-toolbar-item > .toolbarbutton-1 {
2912}
2913
2914#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar > #social-toolbar-item > .toolbarbutton-1:first-child {
2915}
2916
2917#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar > #social-toolbar-item > .toolbarbutton-1:last-child {
2918}
2919
2920.social-notification-icon-hbox {
2921 pointer-events: none;
2922}
2923
2924.social-notification-icon-stack > image {
2925 max-height: 20px;
2926}
2927
2928.social-notification-icon-label {
2929 text-align: end;
2930 font-size: 9px;
2931 font-weight: bold;
2932 padding: 0 1px;
2933 color: #FF9F00;
2934 background-color: #000000;
2935 border: 1px solid #9C9CFF;
2936 border-radius: 2px;
2937}
2938
2939.social-notification-icon-label[value=""] {
2940 display: none;
2941}
2942
2943.social-notification-icon-image {
2944 -moz-image-region: rect(0, 16px, 16px, 0);
2945}
2946
2947#social-notification-icon-mentions {
2948 background-color: #000000;
2949 border-radius: 3px;
2950 -moz-margin-start: 2px;
2951}
2952
2953#social-notification-icon-mentions:hover {
2954 background-color: #FFCF00;
2955}
2956
2957#social-notification-icon-mentions[open="true"] {
2958 background-color: #FF9F00;
2959}
2960
2961#social-sidebar-splitter {
2962 border: 0;
2963}
2964
2965/* social toolbar provider menu */
2966.social-statusarea-popup {
2967 margin-top: 0;
2968 margin-left: -12px;
2969 margin-right: -12px;
2970}
2971
2972.social-statusarea-user {
2973 border-bottom: 1px solid #9C9CFF;
2974 background-color: #000000;
2975 color: #FF9F00;
2976 position: relative;
2977 cursor: pointer;
2978}
2979
2980.social-statusarea-user-portrait {
2981 width: 32px;
2982 height: 32px;
2983 border-radius: 2px;
2984 margin: 10px;
2985}
2986
2987.social-statusarea-loggedInStatus {
2988 background: transparent;
2989 border: none;
2990 color: #3333FF;
2991 min-width: 0;
2992 margin: 0 6px;
2993 list-style-image: none;
2994}
2995
2996#social-statusarea-user[_moz-menuactive] > vbox > .social-statusarea-loggedInStatus {
2997 text-decoration: underline;
2998}
2999
3000.social-panel > .panel-arrowcontainer > .panel-arrowcontent {
3001 padding: 0;
3002}
3003
3004.social-panel-frame {
3005 border-radius: inherit;
3006}
3007
3008.chat-status-icon {
3009 max-height: 16px;
3010 max-width: 16px;
3011 padding: 0;
3012}
3013
3014.chat-toolbarbutton {
3015 -moz-appearance: none;
3016 border: none;
3017 padding: 0;
3018 margin: 0;
3019 background: none;
3020}
3021
3022.chat-toolbarbutton > .toolbarbutton-text {
3023 display: none;
3024}
3025
3026.chat-close-button {
3027 list-style-image: url('chrome://browser/skin/social/chat-close.png');
3028 -moz-image-region: rect(0, 14px, 14px, 0);
3029}
3030
3031.chat-close-button:hover,
3032.chat-close-button:hover:active {
3033 -moz-image-region: rect(14px, 14px, 28px, 0);
3034}
3035
3036.chat-title {
3037 font-weight: bold;
3038 font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
3039 text-shadow: none;
3040 cursor: inherit;
3041}
3042
3043.chat-titlebar {
3044 background-color: #9C9CFF;
3045 color: #000000;
3046 height: 20px;
3047 min-height: 16px;
3048 width: 100%;
3049 margin: 0;
3050 padding: 2px;
3051 -moz-padding-start: 6px;
3052 border: none;
3053 border-bottom: 1px solid #008484;
3054 cursor: pointer;
3055}
3056
3057.chat-titlebar[minimized="true"] {
3058 border-bottom: none;
3059}
3060
3061.chat-titlebar[selected] {
3062 background-color: #008484;
3063}
3064
3065.chat-titlebar[activity] {
3066 background-color: #E7ADE7;
3067}
3068
3069.chat-frame {
3070 padding: 0;
3071 margin: 0;
3072 overflow: hidden;
3073}
3074
3075.chatbar-button {
3076 /* XXX get a real image for this */
3077 list-style-image: url("chrome://browser/skin/social/social.png");
3078 background-color: #000000;
3079 border: none;
3080 margin: 0;
3081 padding: 2px;
3082 height: 21px;
3083 width: 21px;
3084 border-top: 1px solid #008484;
3085 -moz-border-end: 1px solid #008484;
3086}
3087
3088.chatbar-button > menupopup > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon {
3089 width: auto;
3090 height: auto;
3091 max-height: 16px;
3092 max-width: 16px;
3093}
3094
3095.chatbar-button > .toolbarbutton-icon {
3096 opacity: .6;
3097 -moz-margin-end: 0;
3098}
3099.chatbar-button:hover > .toolbarbutton-icon,
3100.chatbar-button[open="true"] > .toolbarbutton-icon {
3101 opacity: 1;
3102}
3103
3104.chatbar-button[open="true"] {
3105}
3106
3107.chatbar-button > .toolbarbutton-text,
3108.chatbar-button > .toolbarbutton-menu-dropmarker {
3109 display: none;
3110}
3111
3112.chatbar-button[activity]:not([open="true"]) {
3113 background-color: #E7ADE7;
3114}
3115
3116.chatbar-button > menupopup > menuitem[activity] {
3117 font-weight: bold;
3118}
3119
3120.chatbar-innerbox {
3121 background: transparent;
3122 margin: -285px 0 0;
3123 overflow: hidden;
3124}
3125
3126chatbar {
3127 -moz-margin-end: 20px;
3128}
3129
3130chatbar > chatbox {
3131 height: 285px;
3132 width: 260px;
3133 -moz-margin-start: 4px;
3134 background-color: #000000;
3135 border: 1px solid #9C9CFF;
3136 border-bottom: none;
3137 border-top-left-radius: 2.5px;
3138 border-top-right-radius: 2.5px;
3139}
3140
3141chatbox[minimized="true"] {
3142 width: 160px;
3143 height: 20px;
3144}
3145
3146.click-to-play-plugins-notification-content {
3147 margin: -10px;
3148 border-radius: 4px;
3149}
3150
3151.click-to-play-plugins-notification-icon-box {
3152 background: #000000;
3153 -moz-border-end: 1px solid #FF9F00;
3154 padding-top: 16px;
3155 -moz-padding-end: 16px;
3156 -moz-padding-start: 24px;
3157 -moz-margin-start: 4px;
3158 margin-top: 4px;
3159 margin-bottom: 4px;
3160}
3161
3162.click-to-play-plugins-notification-icon-box:-moz-locale-dir(ltr) {
3163 border-bottom-left-radius: 4px;
3164 border-top-left-radius: 4px;
3165}
3166
3167.click-to-play-plugins-notification-icon-box:-moz-locale-dir(rtl) {
3168 border-bottom-right-radius: 4px;
3169 border-top-right-radius: 4px;
3170}
3171
3172.click-to-play-plugins-notification-separator {
3173 /*-moz-border-start: 1px solid #9C9CFF;
3174 border-top: 1px solid #9C9CFF;*/
3175}
3176
3177.click-to-play-plugins-notification-description-box {
3178 /*border-bottom: 1px solid #9C9CFF;
3179 -moz-border-start: 1px solid #9C9CFF;*/
3180 padding-top: 12px;
3181 -moz-padding-end: 11px;
3182 padding-bottom: 9px;
3183 -moz-padding-start: 10px;
3184}
3185
3186.click-to-play-plugins-notification-center-box {
3187 border-top: 1px solid #FF9F00;
3188 border-bottom: 1px solid #FF9F00;
3189 /*-moz-border-start: 1px solid #9C9CFF;*/
3190 background-color: #000000;
3191 -moz-margin-end: 4px;
3192}
3193
3194.click-to-play-plugins-notification-button-container {
3195 /*border-top: 1px solid #9C9CFF;
3196 -moz-border-start: 1px solid #9C9CFF;*/
3197 margin: 0px;
3198 padding: 16px;
3199}
3200
3201.center-item-box {
3202 padding: 12px 16px 0px 16px;
3203}
3204
3205.center-item-box[padbottom="true"] {
3206 padding-bottom: 12px;
3207}
3208
3209.center-item-icon {
3210 background-image: url("chrome://mozapps/skin/plugins/pluginGeneric-16.png");
3211 background-repeat: no-repeat;
3212 height: 16px;
3213 width: 16px;
3214 margin-bottom: 4px;
3215}
3216
3217.center-item-box[warn="true"] {
3218 background-color: #FFCF00;
3219 color: #000000;
3220 padding: 8px 16px 6px 16px;
3221}
3222
3223.center-item-box[padbottom="true"][warn="true"] {
3224 padding-bottom: 4px;
3225}
3226
3227.center-item-box[showseparator="true"] {
3228 border-top: 1px solid #9C9CFF;
3229}
3230
3231.center-item-box[warn="false"] > .center-item-warning {
3232 display: none;
3233}
3234
3235.center-item-warning > .text-link {
3236 color: #6868AA;
3237}
3238
3239.center-item-warning > .text-link[href=""] {
3240 display: none;
3241}
3242
3243.center-item-warning-icon {
3244 background-image: url("chrome://mozapps/skin/extensions/alerticon-info-negative.png");
3245 background-repeat: no-repeat;
3246 width: 16px;
3247 height: 15px;
3248 margin-bottom: 4px;
3249}
3250
3251.center-item-warning-description {
3252 color: #828282;
3253}
3254
3255.center-item-button {
3256 min-width: 0;
3257}
3258
3259#main-window[privatebrowsingmode=temporary] #toolbar-menubar {
3260 background-image: url("chrome://browser/skin/privatebrowsing-dark.png");
3261 background-position: top right;
3262 background-repeat: no-repeat;
3263}
3264
3265#main-window[privatebrowsingmode=temporary] #toolbar-menubar:-moz-locale-dir(rtl) {
3266 background-position: top left;
3267}
3268
3269#main-window[privatebrowsingmode=temporary] #appmenu-button {
3270 list-style-image: url("chrome://browser/skin/privatebrowsing-light.png");
3271}