pre-Australis support removal part 1
[themes.git] / LCARStrek / browser / browser.css
CommitLineData
9099c61d
RK
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/. */
acb0e9b8 4
5@import url("chrome://global/skin/");
fcaeefc2 6@import url("downloads/indicator.css");
acb0e9b8 7
8@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
319c6529
RK
9@namespace html url("http://www.w3.org/1999/xhtml");
10
11toolbar {
12 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar");
13}
acb0e9b8 14
7d3f7f14 15toolbar[customizable="true"] {
43cc2806
RK
16 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-browsercustom");
17}
18
41279e76
RK
19toolbar[type="menubar"][autohide="true"] {
20 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide");
21}
22
7d3f7f14 23#toolbar-menubar[autohide="true"] {
43cc2806
RK
24 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide-browsercustom");
25}
26
acb0e9b8 27menubar {
319c6529 28 -moz-binding: url("chrome://global/skin/globalBindings.xml#menubar");
acb0e9b8 29}
30
319c6529
RK
31#menubar-items {
32 -moz-box-orient: vertical; /* for flex hack */
acb0e9b8 33}
34
319c6529
RK
35#main-menubar {
36 -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
37}
38
63ada306
RK
39/* ::::: primary toolbar ::::: */
40
41.toolbar-primary > .toolbar-box > .toolbar-holder {
270cbf0c 42 background-color: #A09090;
63ada306
RK
43}
44
45.toolbar-primary > .toolbar-box > .toolbar-startcap,
46.toolbar-primary > .toolbar-box > .toolbar-endcap {
47 background-color: #9C9CFF;
48}
49
e20c83c3
RK
50/* Hides the titlebar-placeholder underneath the window caption buttons when we
51 are not autohiding the menubar. */
52#toolbar-menubar:not([autohide="true"]) + #TabsToolbar > .titlebar-placeholder[type="caption-buttons"] {
53 display: none;
54}
55
43cc2806
RK
56/* We want a 4px gap between the TabsToolbar and the toolbar-menubar when the
57 toolbar-menu is displayed, and a 16px gap when it is not. 1px is taken care
58 of by the (light) outer shadow of the tab, the remaining 3/15 are these margins. */
e20c83c3
RK
59#toolbar-menubar:not([moz-collapsed=true]):not([autohide="true"]) ~ #TabsToolbar,
60#toolbar-menubar:not([moz-collapsed=true])[autohide="true"]:not([inactive]) ~ #TabsToolbar {
43cc2806
RK
61/* margin-top: 3px;*/
62}
63
64#main-window[tabsintitlebar][sizemode="normal"][chromehidden~="menubar"] #toolbar-menubar ~ #TabsToolbar,
65#main-window[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="true"][inactive] ~ #TabsToolbar {
66/* margin-top: 15px;*/
67}
68
7d3f7f14 69#toolbar-menubar:not([autohide="true"]) {
43cc2806
RK
70 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-drag-browsercustom");
71}
72
018d70fb
RK
73#main-window[tabsintitlebar] #toolbar-menubar .toolbar-endcap {
74 /* 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 */
75 display: none;
43cc2806 76}
63ada306 77
e20c83c3
RK
78#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[customizing-dragovertarget].customization-target::before,
79#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #TabsToolbar[customizing-dragovertarget].customization-target::before,
80#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #toolbar-menubar.customization-target:hover::before,
81#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #TabsToolbar.customization-target:hover::before {
82 outline-color: #A09090;
83}
84
319c6529
RK
85#navigator-toolbox {
86}
87
9abeb12c
RK
88#navigator-toolbox::after {
89 content: "";
90 display: -moz-box;
91 -moz-box-ordinal-group: 101; /* tabs toolbar is 100 */
92 height: 1px;
93}
94#navigator-toolbox[tabsontop=false]::after,
95#main-window[disablechrome] #navigator-toolbox::after {
96 visibility: collapse;
97}
98
319c6529
RK
99#navigator-toolbox > toolbar:not(:-moz-lwtheme) {
100}
101
6dc70335 102#main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[inactive] ~ #TabsToolbar:not(:-moz-lwtheme) {
319c6529
RK
103 /* like menubar */
104 background-color: #6000CF;
105 color: #FF9F00;
106}
6dc70335 107#main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[inactive] ~ #TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive {
319c6529
RK
108 background-color: #8050B0;
109 color: #FF9F00;
110}
6dc70335 111#main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[inactive] ~ #TabsToolbar > .tabbrowser-tabs > .tabbrowser-tab {
2caba1a9
RK
112 padding-top: 3px;
113}
319c6529
RK
114
115#main-window[tabsintitlebar] #titlebar:-moz-lwtheme {
116 visibility: hidden;
117}
118#main-window[tabsintitlebar] #titlebar-content:-moz-lwtheme {
119 -moz-binding: url("chrome://global/content/bindings/general.xml#windowdragbox");
120 visibility: visible;
121}
122
676f0091
RK
123#nav-bar[tabsontop="true"],
124#nav-bar[tabsontop="true"][collapsed="true"]:not([customizing]) + toolbar,
125#nav-bar[tabsontop="true"][collapsed="true"]:not([customizing]) + #customToolbars + #PersonalToolbar {
0142a07b 126 /* background-image: linear-gradient(@toolbarHighlight@, rgba(255,255,255,0)); */
6dc70335
RK
127 /* Position the toolbar above the bottom of background tabs */
128 position: relative;
129 z-index: 1;
319c6529
RK
130}
131
319c6529 132#personal-bookmarks {
38cfeb47 133/* min-height: 24px; */
319c6529
RK
134}
135
136#print-preview-toolbar:not(:-moz-lwtheme) {
137 /* -moz-appearance: toolbox; */
acb0e9b8 138}
139
319c6529
RK
140/* ::::: app menu button ::::: */
141
6dc70335
RK
142/* The app menu button must appear on top of the navigator-toolbox in order
143 * for click and hover mouse events to work properly for the button in the
144 * restored window state. Otherwise, elements in the navigator-toolbox, like the
145 * menubar can swallow these events. It will also place the button above the
146 * fog on themes with Aero Glass.
147 */
148#main-window[tabsintitlebar] #appmenu-button-container {
149 z-index: 1;
150}
151
319c6529 152#appmenu-button {
acb0e9b8 153 background-color: #FF9F00;
319c6529
RK
154 background-clip: padding-box;
155 border-radius: 0;
156 border: none;
319c6529
RK
157 border-right: 3px solid #000000;
158 color: #000000;
159 font-weight: bold;
5305ef8d
RK
160 padding: 1px 1.5em;
161 margin: 0;
162}
163
164#appmenu-button:-moz-locale-dir(rtl) {
165 border-left: 3px solid #000000;
166 border-right: none;
acb0e9b8 167}
168
319c6529
RK
169#main-window[privatebrowsingmode=temporary] #appmenu-button {
170 background-color: #6000CF;
171 color: #FFCF00;
172}
173
b36fc72e
RK
174#appmenu-button:hover:not(:active):not([open]) {
175}
176
177#main-window[privatebrowsingmode=temporary] #appmenu-button:hover:not(:active):not([open]) {
178}
179
319c6529
RK
180#appmenu-button:hover,
181#appmenu-button:hover:active,
182#appmenu-button[open] {
183 background-color: #FFCF00;
184 color: #000000;
185}
186
187#appmenu-button > .button-box > .button-menu-dropmarker {
db6435b4 188 list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
319c6529
RK
189 width: auto;
190 height: auto;
191 padding: 0;
192 margin: 0;
5305ef8d
RK
193 border: none;
194 background-color: transparent;
319c6529
RK
195 -moz-margin-start: .5em;
196}
197
db6435b4
RK
198#main-window[privatebrowsingmode=temporary] #appmenu-button > .button-box > .button-menu-dropmarker {
199 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
200}
201
38cfeb47
RK
202#appmenuPrimaryPane > menuitem,
203#appmenuSecondaryPane > menuitem,
204#appmenuPrimaryPane > menu {
205 padding: 2px;
206}
207
d54f5b23 208.splitmenu-menuitem {
38cfeb47
RK
209 -moz-padding-start: 2px;
210 padding-top: 2px;
211 padding-bottom: 2px;
d54f5b23
RK
212 -moz-margin-end: 1px;
213}
214
ab799a7a 215.splitmenu-menu {
38cfeb47
RK
216 padding-top: 2px;
217 padding-bottom: 2px;
319c6529
RK
218 -moz-box-pack: end;
219}
220
221.appmenu-edit-button {
222}
223
224.appmenu-edit-button[disabled="true"] {
225}
226
227#appmenuPrimaryPane {
228 -moz-border-end: 1px solid #9C9CFF;
229}
230/*
231 #appmenu-popup {
232 }
233 #appmenuPrimaryPane {
234 }
235 #appmenuSecondaryPane {
236 }
237 #appmenuSecondaryPane:-moz-locale-dir(rtl) {
238 }
239
240 #appmenuSecondaryPane menupopup {
241 }
242
243 .appmenu-menuseparator {
244 }
245
246 .appmenu-edit-button:not([disabled]):hover {
247 }
248*/
249#appmenuSecondaryPane-spacer {
250 min-height: 1em;
251}
252
9abeb12c
RK
253#appmenu-editmenu {
254 -moz-box-pack: end;
255}
256
319c6529
RK
257#appmenu_print,
258#appmenu_print_popup,
259.appmenu-edit-button,
9abeb12c
RK
260#appmenu-editmenu-cut,
261#appmenu-editmenu-copy,
262#appmenu-editmenu-paste,
319c6529
RK
263#appmenu-quit {
264 list-style-image: url("appmenu-icons.png");
265}
266
9abeb12c
RK
267#appmenu-cut,
268#appmenu-editmenu-cut {
319c6529 269 -moz-image-region: rect(0 16px 16px 0);
acb0e9b8 270}
271
143c5409
RK
272#appmenu-cut:hover:not([disabled="true"]),
273#appmenu-editmenu-cut:hover:not([disabled="true"]) {
274 -moz-image-region: rect(16px 16px 32px 0);
275}
276
277#appmenu-cut[disabled="true"],
278#appmenu-editmenu-cut[disabled="true"] {
279 -moz-image-region: rect(32px 16px 48px 0);
280}
281
9abeb12c
RK
282#appmenu-copy,
283#appmenu-editmenu-copy {
319c6529
RK
284 -moz-image-region: rect(0 32px 16px 16px);
285}
286
143c5409
RK
287#appmenu-copy:hover:not([disabled="true"]),
288#appmenu-editmenu-copy:hover:not([disabled="true"]) {
289 -moz-image-region: rect(16px 32px 32px 16px);
290}
291
292#appmenu-copy[disabled="true"],
293#appmenu-editmenu-copy[disabled="true"] {
294 -moz-image-region: rect(32px 32px 48px 16px);
295}
296
9abeb12c
RK
297#appmenu-paste,
298#appmenu-editmenu-paste {
319c6529
RK
299 -moz-image-region: rect(0 48px 16px 32px);
300}
301
143c5409
RK
302#appmenu-paste:hover:not([disabled="true"]),
303#appmenu-editmenu-paste:hover:not([disabled="true"]) {
304 -moz-image-region: rect(16px 48px 32px 32px);
305}
306
307#appmenu-paste[disabled="true"],
308#appmenu-editmenu-paste[disabled="true"] {
309 -moz-image-region: rect(32px 48px 48px 32px);
310}
311
319c6529
RK
312#appmenu_print,
313#appmenu_print_popup {
314 -moz-image-region: rect(0 64px 16px 48px);
315}
316
143c5409
RK
317#appmenu_print:hover:not([disabled="true"]),
318#appmenu_print[open="true"],
319#appmenu_print_popup:hover:not([disabled="true"]) {
320 -moz-image-region: rect(16px 64px 32px 48px);
321}
322
323#appmenu-print[disabled="true"],
324#appmenu_print_popup[disabled="true"] {
325 -moz-image-region: rect(32px 64px 48px 48px);
326}
327
319c6529
RK
328#appmenu-quit {
329 -moz-image-region: rect(0 80px 16px 64px);
330}
331
143c5409
RK
332#appmenu-quit:hover {
333 -moz-image-region: rect(16px 80px 32px 64px);
334}
335
319c6529
RK
336#appmenu-edit-label {
337 -moz-appearance: none;
338 background: transparent;
339 font-style: italic;
340}
341
342#appmenu_bookmarks {
343 list-style-image: url("chrome://browser/skin/places/bookmark.png");
344 -moz-image-region: rect(0px 48px 16px 32px);
345}
346
0142a07b
RK
347#appmenu_privateBrowsing,
348#appmenu_newPrivateWindow {
319c6529
RK
349 list-style-image: url("chrome://browser/skin/Privacy-16.png");
350}
351
82b4252f
RK
352@media (min-resolution: 1.25dppx) {
353 #appmenu_privateBrowsing,
354 #appmenu_newPrivateWindow {
355 list-style-image: url("chrome://browser/skin/Privacy-32.png");
356 }
357}
358
319c6529
RK
359#appmenu_addons {
360 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
361}
362
82b4252f
RK
363@media (min-resolution: 1.25dppx) {
364 #appmenu_addons {
365 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
366 }
367}
368
319c6529
RK
369#BMB_bookmarkThisPage,
370#appmenu_bookmarkThisPage {
371 list-style-image: url("chrome://browser/skin/places/bookmark.png");
372 -moz-image-region: rect(0 16px 16px 0);
373}
374
375/* ::::: titlebar ::::: */
376
5305ef8d
RK
377#titlebar {
378 /* like menubar */
379 background-color: #6000CF;
380 color: #FF9F00;
381}
382#titlebar:-moz-window-inactive {
383 background-color: #8050B0;
384 color: #FF9F00;
385}
386
319c6529 387#main-window[sizemode="normal"] > #titlebar {
5305ef8d
RK
388 margin-top: -3px;
389 margin-bottom: 3px;
319c6529
RK
390}
391
392#main-window[sizemode="maximized"] > #titlebar {
5305ef8d 393 margin-top: 4px;
319c6529
RK
394}
395
43cc2806
RK
396/* The button box must appear on top of the navigator-toolbox in order for
397 * click and hover mouse events to work properly for the button in the restored
398 * window state. Otherwise, elements in the navigator-toolbox, like the menubar,
399 * can swallow those events. It will also place the buttons above the fog on
400 * themes with Aero Glass.
401 */
319c6529 402#titlebar-buttonbox {
5305ef8d
RK
403 margin-top: 5px;
404 -moz-margin-end: 3px;
43cc2806 405 z-index: 1;
319c6529
RK
406}
407
408#main-window[sizemode="maximized"] #titlebar-buttonbox {
409}
410
411.titlebar-placeholder[type="appmenu-button"] {
412 margin-left: 4px;
413}
414
415.titlebar-placeholder[type="caption-buttons"] {
416 margin-left: 10px;
417}
418
419/* titlebar command buttons */
420
421#titlebar-min {
5305ef8d
RK
422 list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
423}
424
425#titlebar-min:hover {
426 list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
319c6529
RK
427}
428
429#titlebar-max {
5305ef8d
RK
430 list-style-image: url("chrome://browser/skin/win-maximize.gif");
431}
432
433#titlebar-max:hover {
434 list-style-image: url("chrome://browser/skin/win-maximize-hover.gif");
319c6529
RK
435}
436
437#main-window[sizemode="maximized"] #titlebar-max {
5305ef8d
RK
438 list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
439}
440
441#main-window[sizemode="maximized"] #titlebar-max:hover {
442 list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
319c6529
RK
443}
444
445#titlebar-close {
5305ef8d
RK
446 list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
447}
448
449#titlebar-close:hover {
450 list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
acb0e9b8 451}
452
453/* ::::: bookmark buttons ::::: */
454
26125509
RK
455.bookmark-item > .toolbarbutton-icon,
456#personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
acb0e9b8 457 width: 16px;
458 height: 16px;
459}
460
26125509
RK
461/* Force the display of the label for bookmarks */
462.bookmark-item > .toolbarbutton-text,
463#personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-text {
acb0e9b8 464 display: -moz-box !important;
465}
466
319c6529
RK
467.bookmark-item > .toolbarbutton-menu-dropmarker {
468 display: none;
469}
470
471#wrapper-personal-bookmarks[place="palette"] > .toolbarpaletteitem-box {
c5772fdf 472 background: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") no-repeat center;
319c6529
RK
473}
474
26125509 475#bookmarks-toolbar-placeholder {
8da9da4e 476 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") !important;
319c6529
RK
477}
478
e20c83c3
RK
479toolbarpaletteitem[place="palette"] > #personal-bookmarks > #bookmarks-toolbar-placeholder,
480#personal-bookmarks[cui-areatype="menu-panel"] > #bookmarks-toolbar-placeholder {
481 list-style-image: url("chrome://browser/skin/places/bookmarksToolbar-menuPanel.png") !important;
482}
483
484/* ----- BOOKMARK STAR ANIMATION ----- */
485
486@keyframes animation-bookmarkAdded {
487 from { transform: rotate(0deg) translateX(-16px) rotate(0deg) scale(1); opacity: 0; }
488 60% { transform: rotate(180deg) translateX(-16px) rotate(-180deg) scale(2.2); opacity: 1; }
489 80% { opacity: 1; }
490 to { transform: rotate(180deg) translateX(-16px) rotate(-180deg) scale(1); opacity: 0; }
491}
492
493@keyframes animation-bookmarkPulse {
494 from { transform: scale(1); }
495 50% { transform: scale(1.3); }
496 to { transform: scale(1); }
497}
498
499#bookmarked-notification-container {
500 min-height: 1px;
501 min-width: 1px;
502 height: 1px;
503 margin-bottom: -1px;
504 z-index: 5;
505 position: relative;
506}
507
508#bookmarked-notification {
509 background-size: 16px;
510 background-position: center;
511 background-repeat: no-repeat;
512 width: 16px;
513 height: 16px;
514 opacity: 0;
515}
516
517#bookmarked-notification-anchor[notification="finish"] > #bookmarked-notification {
518 background-image: url("chrome://browser/skin/places/bookmarks-notification-finish.png");
519 animation: animation-bookmarkAdded 800ms;
520 animation-timing-function: ease, ease, ease;
521}
522
523#bookmarks-menu-button[notification="finish"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
524 animation: animation-bookmarkPulse 300ms;
525 animation-delay: 600ms;
526 animation-timing-function: ease-out;
527}
528
319c6529
RK
529/* ::::: bookmark menus ::::: */
530
531menu.bookmark-item,
532menuitem.bookmark-item {
533 min-width: 0;
ab799a7a 534 max-width: 32em;
319c6529
RK
535}
536
e20c83c3 537.bookmark-item:not(.subviewbutton) > .menu-iconic-left {
319c6529
RK
538 margin-top: 0;
539 margin-bottom: 0;
540}
541
542.bookmark-item > .menu-iconic-left > .menu-iconic-icon {
543 -moz-padding-start: 0px;
544}
545
546/* ::::: bookmark items ::::: */
547
548.bookmark-item {
dce90fef 549 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
8da9da4e 550 -moz-image-region: auto;
319c6529
RK
551}
552
553.bookmark-item[container] {
554 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
8da9da4e 555 -moz-image-region: auto;
319c6529
RK
556}
557
558.bookmark-item[container][open] {
559 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
8da9da4e 560 -moz-image-region: auto;
319c6529
RK
561}
562
8da9da4e
RK
563.bookmark-item[container][livemark] {
564 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-folder.png");
319c6529
RK
565 -moz-image-region: auto;
566}
567
568.bookmark-item[container][livemark] .bookmark-item {
8da9da4e 569 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-item.png");
719b06bc 570 -moz-image-region: rect(0px, 16px, 16px, 0px);
319c6529
RK
571}
572
eec397be 573.bookmark-item[container][livemark] .bookmark-item[visited] {
719b06bc 574 -moz-image-region: rect(0px, 32px, 16px, 16px);
eec397be
RK
575}
576
319c6529 577.bookmark-item[container][query] {
8da9da4e 578 list-style-image: url("chrome://communicator/skin/bookmarks/query.png");
319c6529
RK
579 -moz-image-region: auto;
580}
581
582.bookmark-item[query][tagContainer] {
583 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
584 -moz-image-region: auto;
585}
586
587.bookmark-item[query][dayContainer] {
8da9da4e 588 list-style-image: url("chrome://communicator/skin/history/calendar.png");
319c6529
RK
589 -moz-image-region: auto;
590}
591
592.bookmark-item[query][hostContainer] {
593 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
8da9da4e 594 -moz-image-region: auto;
319c6529
RK
595}
596
597.bookmark-item[query][hostContainer][open] {
598 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
8da9da4e 599 -moz-image-region: auto;
319c6529
RK
600}
601
b1234db8
RK
602.bookmark-item[cutting] > .toolbarbutton-icon,
603.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-icon {
604 opacity: 0.5;
605}
606
607.bookmark-item[cutting] > .toolbarbutton-text,
608.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-text {
609 opacity: 0.7;
610}
611
319c6529
RK
612/* ::::: primary toolbar buttons ::::: */
613
43cc2806
RK
614/* === BEGIN toolbarbuttons.inc.css === */
615
616/* Whole section of this included file: */
7d3f7f14 617:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button,
43cc2806
RK
618 #cut-button, #copy-button, #paste-button, #fullscreen-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #sync-button, #feed-button,
619 #tabview-button, #webrtc-status-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button,
620 #privatebrowsing-button, #save-page-button, #switch-to-metro-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button,
621 #PanelUI-menu-button, #characterencoding-button, #email-link-button),
7d3f7f14 622#bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK
623 list-style-image: url("chrome://browser/skin/ToolbarFx.png");
624}
625
7d3f7f14 626#back-button {
43cc2806
RK
627 -moz-image-region: rect(0, 36px, 18px, 18px);
628}
629
7d3f7f14 630#back-button:hover:not([disabled="true"]) {
43cc2806
RK
631 -moz-image-region: rect(18px, 36px, 36px, 18px);
632}
633
7d3f7f14 634#back-button[disabled="true"] {
43cc2806
RK
635 -moz-image-region: rect(36px, 36px, 54px, 18px);
636}
637
7d3f7f14 638#forward-button {
43cc2806
RK
639 -moz-image-region: rect(0, 72px, 18px, 54px);
640}
641
7d3f7f14 642#forward-button:hover:not([disabled="true"]) {
43cc2806
RK
643 -moz-image-region: rect(18px, 72px, 36px, 54px);
644}
645
7d3f7f14 646#forward-button[disabled="true"] {
43cc2806
RK
647 -moz-image-region: rect(36px, 72px, 54px, 54px);
648}
649
7d3f7f14
RK
650#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
651#forward-button:-moz-locale-dir(rtl) {
43cc2806
RK
652 transform: scaleX(-1);
653}
654
7d3f7f14 655#home-button[cui-areatype="toolbar"] {
43cc2806
RK
656 -moz-image-region: rect(0, 126px, 18px, 108px);
657}
658
7d3f7f14 659#home-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
660 -moz-image-region: rect(18px, 126px, 36px, 108px);
661}
662
7d3f7f14 663#bookmarks-menu-button[cui-areatype="toolbar"] {
43cc2806
RK
664 -moz-image-region: rect(0, 144px, 18px, 126px);
665}
666
7d3f7f14
RK
667#bookmarks-menu-button[cui-areatype="toolbar"]:hover,
668#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
669 -moz-image-region: rect(18px, 144px, 36px, 126px);
670}
671
43ee1307 672/* When "new tab" page shows up, the menubutton-button (star button) is disabled */
7d3f7f14 673#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-button[disabled="true"] {
43ee1307
RK
674 -moz-image-region: rect(36px, 144px, 54px, 126px) !important;
675 background-color: transparent !important;
676}
677
7d3f7f14 678#bookmarks-menu-button[cui-areatype="toolbar"][starred] {
43cc2806
RK
679 -moz-image-region: rect(0, 162px, 18px, 144px);
680}
681
7d3f7f14
RK
682#bookmarks-menu-button[cui-areatype="toolbar"][starred]:hover,
683#bookmarks-menu-button[cui-areatype="toolbar"][starred][open="true"] {
43cc2806
RK
684 -moz-image-region: rect(18px, 162px, 36px, 144px);
685}
686
7d3f7f14 687#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK
688 -moz-image-region: rect(0, 630px, 18px, 612px);
689}
690
7d3f7f14 691#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker {
43cc2806
RK
692 padding: 1px;
693 -moz-box-align: center;
694}
695
7d3f7f14
RK
696#bookmarks-menu-button[cui-areatype="toolbar"]:hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
697#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK
698 -moz-image-region: rect(18px, 630px, 36px, 612px);
699}
700
7d3f7f14
RK
701#bookmarks-menu-button[cui-areatype="toolbar"]:hover:active > .toolbarbutton-menubutton-dropmarker,
702#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] > .toolbarbutton-menubutton-dropmarker {
43cc2806
RK
703 padding-top: 2px;
704 padding-bottom: 0px;
705 -moz-padding-start: 2px;
706 -moz-padding-end: 0px;
707}
708
7d3f7f14 709#history-panelmenu[cui-areatype="toolbar"] {
43cc2806
RK
710 -moz-image-region: rect(0, 180px, 18px, 162px);
711}
712
7d3f7f14
RK
713#history-panelmenu[cui-areatype="toolbar"]:hover,
714#history-panelmenu[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
715 -moz-image-region: rect(18px, 180px, 36px, 162px);
716}
717
7d3f7f14 718#downloads-button[cui-areatype="toolbar"] {
43cc2806
RK
719 -moz-image-region: rect(0, 198px, 18px, 180px);
720}
721
7d3f7f14
RK
722#downloads-button[cui-areatype="toolbar"]:hover,
723#downloads-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
724 -moz-image-region: rect(18px, 198px, 36px, 180px);
725}
726
7d3f7f14 727#add-ons-button[cui-areatype="toolbar"] {
43cc2806
RK
728 -moz-image-region: rect(0, 216px, 18px, 198px);
729}
730
7d3f7f14 731#add-ons-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
732 -moz-image-region: rect(18px, 216px, 36px, 198px);
733}
734
7d3f7f14 735#switch-to-metro-button[cui-areatype="toolbar"] {
43cc2806
RK
736 -moz-image-region: rect(0, 648px, 18px, 630px);
737}
738
7d3f7f14 739#switch-to-metro-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
740 -moz-image-region: rect(18px, 648px, 36px, 630px);
741}
742
7d3f7f14 743#open-file-button[cui-areatype="toolbar"] {
43cc2806
RK
744 -moz-image-region: rect(0, 234px, 18px, 216px);
745}
746
7d3f7f14 747#open-file-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
748 -moz-image-region: rect(18px, 234px, 36px, 216px);
749}
750
7d3f7f14 751#save-page-button[cui-areatype="toolbar"] {
43cc2806
RK
752 -moz-image-region: rect(0, 252px, 18px, 234px);
753}
754
7d3f7f14 755#save-page-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
756 -moz-image-region: rect(18px, 252px, 36px, 234px);
757}
758
7d3f7f14 759#sync-button[cui-areatype="toolbar"] {
43cc2806
RK
760 -moz-image-region: rect(0, 270px, 18px, 252px);
761}
762
7d3f7f14 763#sync-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
764 -moz-image-region: rect(18px, 270px, 36px, 252px);
765}
766
7d3f7f14 767#feed-button[cui-areatype="toolbar"] {
43cc2806
RK
768 -moz-image-region: rect(0, 288px, 18px, 270px);
769}
770
7d3f7f14 771#feed-button[cui-areatype="toolbar"]:hover:not([disabled="true"]) {
43cc2806
RK
772 -moz-image-region: rect(18px, 288px, 36px, 270px);
773}
774
7d3f7f14 775#feed-button[cui-areatype="toolbar"][disabled="true"] {
cc4b0b0d
RK
776 -moz-image-region: rect(36px, 288px, 54px, 270px);
777}
778
7d3f7f14 779#social-share-button[cui-areatype="toolbar"] {
43cc2806
RK
780 -moz-image-region: rect(0px, 306px, 18px, 288px);
781}
782
7d3f7f14 783#social-share-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
784 -moz-image-region: rect(18px, 306px, 36px, 288px);
785}
786
7d3f7f14 787#email-link-button[cui-areatype="toolbar"] {
43cc2806
RK
788 -moz-image-region: rect(0, 306px, 18px, 288px);
789 /* This is temporary until we have an email-link icon (Bug 932235) */
790 transform: scale(-1, -1);
791}
792
7d3f7f14 793#email-link-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
794 -moz-image-region: rect(18px, 306px, 36px, 288px);
795}
796
7d3f7f14 797#characterencoding-button[cui-areatype="toolbar"] {
43cc2806
RK
798 -moz-image-region: rect(0, 324px, 18px, 306px);
799}
800
7d3f7f14
RK
801#characterencoding-button[cui-areatype="toolbar"]:hover:not([disabled="true"]),
802#characterencoding-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
803 -moz-image-region: rect(18px, 324px, 36px, 306px);
804}
805
7d3f7f14 806#characterencoding-button[cui-areatype="toolbar"][disabled="true"] {
cc4b0b0d
RK
807 -moz-image-region: rect(36px, 324px, 54px, 306px);
808}
809
7d3f7f14 810#new-window-button[cui-areatype="toolbar"] {
43cc2806
RK
811 -moz-image-region: rect(0, 342px, 18px, 324px);
812}
813
7d3f7f14 814#new-window-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
815 -moz-image-region: rect(18px, 342px, 36px, 324px);
816}
817
7d3f7f14 818#new-tab-button[cui-areatype="toolbar"] {
43cc2806
RK
819 -moz-image-region: rect(0, 360px, 18px, 342px);
820}
821
7d3f7f14 822#new-tab-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
823 -moz-image-region: rect(18px, 360px, 36px, 342px);
824}
825
7d3f7f14 826#privatebrowsing-button[cui-areatype="toolbar"] {
43cc2806
RK
827 -moz-image-region: rect(0, 378px, 18px, 360px);
828}
829
7d3f7f14 830#privatebrowsing-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
831 -moz-image-region: rect(18px, 378px, 36px, 360px);
832}
833
7d3f7f14 834#find-button[cui-areatype="toolbar"] {
43cc2806
RK
835 -moz-image-region: rect(0, 396px, 18px, 378px);
836}
837
7d3f7f14 838#find-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
839 -moz-image-region: rect(18px, 396px, 36px, 378px);
840}
841
7d3f7f14 842#print-button[cui-areatype="toolbar"] {
43cc2806
RK
843 -moz-image-region: rect(0, 414px, 18px, 396px);
844}
845
7d3f7f14 846#print-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
847 -moz-image-region: rect(18px, 414px, 36px, 396px);
848}
849
7d3f7f14 850#fullscreen-button[cui-areatype="toolbar"] {
43cc2806
RK
851 -moz-image-region: rect(0, 432px, 18px, 414px);
852}
853
7d3f7f14 854#fullscreen-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
855 -moz-image-region: rect(18px, 432px, 36px, 414px);
856}
857
7d3f7f14 858#developer-button[cui-areatype="toolbar"] {
43cc2806
RK
859 -moz-image-region: rect(0, 450px, 18px, 432px);
860}
861
7d3f7f14
RK
862#developer-button[cui-areatype="toolbar"]:hover,
863#developer-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
864 -moz-image-region: rect(18px, 450px, 36px, 432px);
865}
866
7d3f7f14 867#preferences-button[cui-areatype="toolbar"] {
43cc2806
RK
868 -moz-image-region: rect(0, 468px, 18px, 450px);
869}
870
7d3f7f14 871#preferences-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
872 -moz-image-region: rect(18px, 468px, 36px, 450px);
873}
874
7d3f7f14 875#PanelUI-menu-button {
43cc2806
RK
876 -moz-image-region: rect(0, 486px, 18px, 468px);
877}
878
7d3f7f14
RK
879#PanelUI-menu-button:hover,
880#PanelUI-menu-button[open="true"] {
43cc2806
RK
881 -moz-image-region: rect(18px, 486px, 36px, 468px);
882}
883
7d3f7f14 884#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #cut-button {
43cc2806
RK
885 -moz-image-region: rect(0, 504px, 18px, 486px);
886}
887
7d3f7f14 888#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #cut-button:hover:not([disabled="true"]) {
43cc2806
RK
889 -moz-image-region: rect(18px, 504px, 36px, 486px);
890}
891
7d3f7f14 892#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #cut-button[disabled="true"] {
cc4b0b0d
RK
893 -moz-image-region: rect(36px, 504px, 54px, 486px);
894}
895
7d3f7f14 896#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #copy-button {
43cc2806
RK
897 -moz-image-region: rect(0, 522px, 18px, 504px);
898}
899
7d3f7f14 900#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #copy-button:hover:not([disabled="true"]) {
43cc2806
RK
901 -moz-image-region: rect(18px, 522px, 36px, 504px);
902}
903
7d3f7f14 904#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #copy-button[disabled="true"] {
cc4b0b0d
RK
905 -moz-image-region: rect(36px, 522px, 54px, 504px);
906}
907
7d3f7f14 908#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #paste-button {
43cc2806
RK
909 -moz-image-region: rect(0, 540px, 18px, 522px);
910}
911
7d3f7f14 912#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #paste-button:hover:not([disabled="true"]) {
43cc2806
RK
913 -moz-image-region: rect(18px, 540px, 36px, 522px);
914}
915
7d3f7f14 916#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #paste-button[disabled="true"] {
cc4b0b0d
RK
917 -moz-image-region: rect(36px, 540px, 54px, 522px);
918}
919
7d3f7f14 920#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-out-button {
43cc2806
RK
921 -moz-image-region: rect(0, 558px, 18px, 540px);
922}
923
7d3f7f14 924#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-out-button:hover:not([disabled="true"]) {
43cc2806
RK
925 -moz-image-region: rect(18px, 558px, 36px, 540px);
926}
927
7d3f7f14 928#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-out-button[disabled="true"] {
cc4b0b0d
RK
929 -moz-image-region: rect(36px, 558px, 54px, 540px);
930}
931
7d3f7f14 932#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-in-button {
43cc2806
RK
933 -moz-image-region: rect(0, 576px, 18px, 558px);
934}
935
7d3f7f14 936#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-in-button:hover:not([disabled="true"]) {
43cc2806
RK
937 -moz-image-region: rect(18px, 576px, 36px, 558px);
938}
939
7d3f7f14 940#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) > #zoom-in-button[disabled="true"] {
cc4b0b0d
RK
941 -moz-image-region: rect(36px, 576px, 54px, 558px);
942}
943
7d3f7f14 944#webrtc-status-button:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)) {
43cc2806
RK
945 -moz-image-region: rect(0, 594px, 18px, 576px);
946}
947
7d3f7f14
RK
948#webrtc-status-button:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem)):hover,
949#webrtc-status-button:not(:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem))[open="true"] {
43cc2806
RK
950 -moz-image-region: rect(18px, 594px, 36px, 576px);
951}
952
7d3f7f14 953#nav-bar-overflow-button {
43cc2806
RK
954 -moz-image-region: rect(0, 612px, 18px, 594px);
955}
956
7d3f7f14
RK
957#nav-bar-overflow-button:hover,
958#nav-bar-overflow-button[open="true"] {
43cc2806
RK
959 -moz-image-region: rect(18px, 612px, 36px, 594px);
960}
961
962/* === END toolbarbuttons.inc.css === */
963
964/* === BEGIN menupanel.inc.css === */
965
966/* Menu panel and palette styles */
967
43cc2806
RK
968:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button,
969 #cut-button, #copy-button, #paste-button, #fullscreen-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #sync-button, #feed-button,
970 #tabview-button, #webrtc-status-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button,
971 #privatebrowsing-button, #save-page-button, #switch-to-metro-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button,
972 #PanelUI-menu-button, #characterencoding-button, #email-link-button)[cui-areatype="menu-panel"],
7d3f7f14 973toolbarpaletteitem[place="palette"] > :-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button,
43cc2806
RK
974 #cut-button, #copy-button, #paste-button, #fullscreen-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #sync-button, #feed-button,
975 #tabview-button, #webrtc-status-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button,
976 #privatebrowsing-button, #save-page-button, #switch-to-metro-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button,
977 #PanelUI-menu-button, #characterencoding-button, #email-link-button) {
978 list-style-image: url("chrome://browser/skin/menuPanel.png");
979}
980
981#home-button[cui-areatype="menu-panel"],
7d3f7f14 982toolbarpaletteitem[place="palette"] > #home-button {
43cc2806
RK
983 -moz-image-region: rect(0px, 128px, 32px, 96px);
984}
985
cc4b0b0d 986#home-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 987toolbarpaletteitem[place="palette"] > #home-button:hover {
cc4b0b0d
RK
988 -moz-image-region: rect(32px, 128px, 64px, 96px);
989}
990
43cc2806 991#bookmarks-menu-button[cui-areatype="menu-panel"],
7d3f7f14 992toolbarpaletteitem[place="palette"] > #bookmarks-menu-button {
43cc2806
RK
993 -moz-image-region: rect(0px, 160px, 32px, 128px);
994}
995
cc4b0b0d 996#bookmarks-menu-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 997toolbarpaletteitem[place="palette"] > #bookmarks-menu-button:hover {
cc4b0b0d
RK
998 -moz-image-region: rect(32px, 160px, 64px, 128px);
999}
1000
43cc2806
RK
1001#bookmarks-menu-button[starred][cui-areatype="menu-panel"] {
1002 -moz-image-region: rect(0px, 192px, 32px, 160px);
1003}
1004
cc4b0b0d
RK
1005#bookmarks-menu-button[starred][cui-areatype="menu-panel"]:hover {
1006 -moz-image-region: rect(32px, 192px, 64px, 160px);
1007}
1008
43cc2806 1009#history-panelmenu[cui-areatype="menu-panel"],
7d3f7f14 1010toolbarpaletteitem[place="palette"] > #history-panelmenu {
43cc2806
RK
1011 -moz-image-region: rect(0px, 224px, 32px, 192px);
1012}
1013
cc4b0b0d 1014#history-panelmenu[cui-areatype="menu-panel"]:hover,
7d3f7f14 1015toolbarpaletteitem[place="palette"] > #history-panelmenu:hover {
cc4b0b0d
RK
1016 -moz-image-region: rect(32px, 224px, 64px, 192px);
1017}
1018
43cc2806 1019#downloads-button[cui-areatype="menu-panel"],
7d3f7f14 1020toolbarpaletteitem[place="palette"] > #downloads-button {
43cc2806
RK
1021 -moz-image-region: rect(0px, 256px, 32px, 224px);
1022}
1023
cc4b0b0d 1024#downloads-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1025toolbarpaletteitem[place="palette"] > #downloads-button:hover {
cc4b0b0d
RK
1026 -moz-image-region: rect(32px, 256px, 64px, 224px);
1027}
1028
43cc2806 1029#switch-to-metro-button[cui-areatype="menu-panel"],
7d3f7f14 1030toolbarpaletteitem[place="palette"] > #switch-to-metro-button {
43cc2806
RK
1031 -moz-image-region: rect(0px, 800px, 32px, 768px);
1032}
1033
cc4b0b0d 1034#switch-to-metro-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1035toolbarpaletteitem[place="palette"] > #switch-to-metro-button:hover {
cc4b0b0d
RK
1036 -moz-image-region: rect(32px, 800px, 64px, 768px);
1037}
1038
43cc2806 1039#add-ons-button[cui-areatype="menu-panel"],
7d3f7f14 1040toolbarpaletteitem[place="palette"] > #add-ons-button {
43cc2806
RK
1041 -moz-image-region: rect(0px, 288px, 32px, 256px);
1042}
1043
cc4b0b0d 1044#add-ons-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1045toolbarpaletteitem[place="palette"] > #add-ons-button:hover {
cc4b0b0d
RK
1046 -moz-image-region: rect(32px, 288px, 64px, 256px);
1047}
1048
43cc2806 1049#open-file-button[cui-areatype="menu-panel"],
7d3f7f14 1050toolbarpaletteitem[place="palette"] > #open-file-button {
43cc2806
RK
1051 -moz-image-region: rect(0px, 320px, 32px, 288px);
1052}
1053
cc4b0b0d 1054#open-file-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1055toolbarpaletteitem[place="palette"] > #open-file-button:hover {
cc4b0b0d
RK
1056 -moz-image-region: rect(32px, 320px, 64px, 288px);
1057}
1058
43cc2806 1059#save-page-button[cui-areatype="menu-panel"],
7d3f7f14 1060toolbarpaletteitem[place="palette"] > #save-page-button {
43cc2806
RK
1061 -moz-image-region: rect(0px, 352px, 32px, 320px);
1062}
1063
cc4b0b0d 1064#save-page-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1065toolbarpaletteitem[place="palette"] > #save-page-button:hover {
cc4b0b0d
RK
1066 -moz-image-region: rect(32px, 352px, 64px, 320px);
1067}
1068
43cc2806 1069#sync-button[cui-areatype="menu-panel"],
7d3f7f14 1070toolbarpaletteitem[place="palette"] > #sync-button {
43cc2806
RK
1071 -moz-image-region: rect(0px, 384px, 32px, 352px);
1072}
1073
cc4b0b0d 1074#sync-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1075toolbarpaletteitem[place="palette"] > #sync-button:hover {
cc4b0b0d
RK
1076 -moz-image-region: rect(32px, 384px, 64px, 352px);
1077}
1078
43cc2806 1079#feed-button[cui-areatype="menu-panel"],
7d3f7f14 1080toolbarpaletteitem[place="palette"] > #feed-button {
43cc2806
RK
1081 -moz-image-region: rect(0px, 416px, 32px, 384px);
1082}
1083
cc4b0b0d 1084#feed-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
7d3f7f14 1085toolbarpaletteitem[place="palette"] > #feed-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1086 -moz-image-region: rect(32px, 416px, 64px, 384px);
1087}
1088
1089#feed-button[cui-areatype="menu-panel"][disabled="true"],
7d3f7f14 1090toolbarpaletteitem[place="palette"] > #feed-button[disabled="true"] {
cc4b0b0d
RK
1091 -moz-image-region: rect(64px, 416px, 96px, 384px);
1092}
1093
43cc2806 1094#social-share-button[cui-areatype="menu-panel"],
7d3f7f14 1095toolbarpaletteitem[place="palette"] > #social-share-button {
43cc2806
RK
1096 -moz-image-region: rect(0px, 448px, 32px, 416px);
1097}
1098
cc4b0b0d 1099#social-share-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1100toolbarpaletteitem[place="palette"] > #social-share-button:hover {
cc4b0b0d
RK
1101 -moz-image-region: rect(32px, 448px, 64px, 416px);
1102}
1103
43cc2806 1104#email-link-button[cui-areatype="menu-panel"],
7d3f7f14 1105toolbarpaletteitem[place="palette"] > #email-link-button {
43cc2806
RK
1106 -moz-image-region: rect(0, 448px, 32px, 416px);
1107}
1108
cc4b0b0d 1109#email-link-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1110toolbarpaletteitem[place="palette"] > #email-link-button:hover {
fd291cce 1111 -moz-image-region: rect(32px, 448px, 64px, 416px);
cc4b0b0d
RK
1112}
1113
43cc2806
RK
1114/* This is temporary until we have an email-link icon (Bug 932235) */
1115#email-link-button[cui-areatype="menu-panel"] > image,
7d3f7f14 1116toolbarpaletteitem[place="palette"] > #email-link-button > image {
43cc2806
RK
1117 transform: scale(-1, -1);
1118}
1119
1120#characterencoding-button[cui-areatype="menu-panel"],
7d3f7f14 1121toolbarpaletteitem[place="palette"] > #characterencoding-button {
43cc2806
RK
1122 -moz-image-region: rect(0px, 480px, 32px, 448px);
1123}
1124
cc4b0b0d 1125#characterencoding-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
7d3f7f14 1126toolbarpaletteitem[place="palette"] > #characterencoding-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1127 -moz-image-region: rect(32px, 480px, 64px, 448px);
1128}
1129
1130#characterencoding-button[cui-areatype="menu-panel"][disabled="true"],
7d3f7f14 1131toolbarpaletteitem[place="palette"] > #characterencoding-button[disabled="true"] {
cc4b0b0d
RK
1132 -moz-image-region: rect(64px, 480px, 96px, 448px);
1133}
1134
43cc2806 1135#new-window-button[cui-areatype="menu-panel"],
7d3f7f14 1136toolbarpaletteitem[place="palette"] > #new-window-button {
43cc2806
RK
1137 -moz-image-region: rect(0px, 512px, 32px, 480px);
1138}
1139
cc4b0b0d 1140#new-window-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1141toolbarpaletteitem[place="palette"] > #new-window-button:hover {
cc4b0b0d
RK
1142 -moz-image-region: rect(32px, 512px, 64px, 480px);
1143}
1144
43cc2806 1145#new-tab-button[cui-areatype="menu-panel"],
7d3f7f14 1146toolbarpaletteitem[place="palette"] > #new-tab-button {
43cc2806
RK
1147 -moz-image-region: rect(0px, 544px, 32px, 512px);
1148}
1149
cc4b0b0d 1150#new-tab-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1151toolbarpaletteitem[place="palette"] > #new-tab-button:hover {
cc4b0b0d
RK
1152 -moz-image-region: rect(32px, 544px, 64px, 512px);
1153}
1154
43cc2806 1155#privatebrowsing-button[cui-areatype="menu-panel"],
7d3f7f14 1156toolbarpaletteitem[place="palette"] > #privatebrowsing-button {
43cc2806
RK
1157 -moz-image-region: rect(0px, 576px, 32px, 544px);
1158}
1159
cc4b0b0d 1160#privatebrowsing-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1161toolbarpaletteitem[place="palette"] > #privatebrowsing-button:hover {
cc4b0b0d
RK
1162 -moz-image-region: rect(32px, 576px, 64px, 544px);
1163}
1164
43cc2806 1165#find-button[cui-areatype="menu-panel"],
7d3f7f14 1166toolbarpaletteitem[place="palette"] > #find-button {
43cc2806
RK
1167 -moz-image-region: rect(0px, 640px, 32px, 608px);
1168}
1169
cc4b0b0d 1170#find-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1171toolbarpaletteitem[place="palette"] > #find-button:hover {
cc4b0b0d
RK
1172 -moz-image-region: rect(32px, 640px, 64px, 608px);
1173}
1174
43cc2806 1175#print-button[cui-areatype="menu-panel"],
7d3f7f14 1176toolbarpaletteitem[place="palette"] > #print-button {
43cc2806
RK
1177 -moz-image-region: rect(0px, 672px, 32px, 640px);
1178}
1179
cc4b0b0d 1180#print-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1181toolbarpaletteitem[place="palette"] > #print-button:hover {
cc4b0b0d
RK
1182 -moz-image-region: rect(32px, 672px, 64px, 640px);
1183}
1184
43cc2806 1185#fullscreen-button[cui-areatype="menu-panel"],
7d3f7f14 1186toolbarpaletteitem[place="palette"] > #fullscreen-button {
43cc2806
RK
1187 -moz-image-region: rect(0px, 704px, 32px, 672px);
1188}
1189
cc4b0b0d 1190#fullscreen-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1191toolbarpaletteitem[place="palette"] > #fullscreen-button:hover {
cc4b0b0d
RK
1192 -moz-image-region: rect(32px, 704px, 64px, 672px);
1193}
1194
43cc2806 1195#developer-button[cui-areatype="menu-panel"],
7d3f7f14 1196toolbarpaletteitem[place="palette"] > #developer-button {
43cc2806
RK
1197 -moz-image-region: rect(0px, 736px, 32px, 704px);
1198}
1199
cc4b0b0d 1200#developer-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1201toolbarpaletteitem[place="palette"] > #developer-button:hover {
cc4b0b0d
RK
1202 -moz-image-region: rect(32px, 736px, 64px, 704px);
1203}
1204
43cc2806 1205#preferences-button[cui-areatype="menu-panel"],
7d3f7f14 1206toolbarpaletteitem[place="palette"] > #preferences-button {
43cc2806
RK
1207 -moz-image-region: rect(0px, 768px, 32px, 736px);
1208}
1209
cc4b0b0d 1210#preferences-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1211toolbarpaletteitem[place="palette"] > #preferences-button:hover {
cc4b0b0d
RK
1212 -moz-image-region: rect(32px, 768px, 64px, 736px);
1213}
1214
43cc2806
RK
1215/* Wide panel control icons */
1216
1217#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
1218#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
7d3f7f14
RK
1219toolbarpaletteitem[place="palette"] > #edit-controls > toolbarbutton,
1220toolbarpaletteitem[place="palette"] > #zoom-controls > toolbarbutton {
43cc2806
RK
1221 list-style-image: url("chrome://browser/skin/menuPanel-small.png");
1222}
1223
1224#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button,
7d3f7f14 1225toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button {
43cc2806
RK
1226 -moz-image-region: rect(0px, 32px, 16px, 16px);
1227}
1228
cc4b0b0d 1229#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button:hover:not([disabled="true"]),
7d3f7f14 1230toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1231 -moz-image-region: rect(16px, 32px, 32px, 16px);
1232}
1233
1234#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button[disabled="true"],
7d3f7f14 1235toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button[disabled="true"] {
cc4b0b0d
RK
1236 -moz-image-region: rect(32px, 32px, 48px, 16px);
1237}
1238
43cc2806 1239#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button,
7d3f7f14 1240toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button {
43cc2806
RK
1241 -moz-image-region: rect(0px, 48px, 16px, 32px);
1242}
1243
cc4b0b0d 1244#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button:hover:not([disabled="true"]),
7d3f7f14 1245toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1246 -moz-image-region: rect(16px, 48px, 32px, 32px);
1247}
1248
1249#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button[disabled="true"],
7d3f7f14 1250toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button[disabled="true"] {
cc4b0b0d
RK
1251 -moz-image-region: rect(32px, 48px, 48px, 32px);
1252}
1253
43cc2806 1254#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button,
7d3f7f14 1255toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button {
43cc2806
RK
1256 -moz-image-region: rect(0px, 64px, 16px, 48px);
1257}
1258
cc4b0b0d 1259#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button:hover:not([disabled="true"]),
7d3f7f14 1260toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1261 -moz-image-region: rect(16px, 64px, 32px, 48px);
1262}
1263
1264#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button[disabled="true"],
7d3f7f14 1265toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button[disabled="true"] {
cc4b0b0d
RK
1266 -moz-image-region: rect(32px, 64px, 48px, 48px);
1267}
1268
43cc2806 1269#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button,
7d3f7f14 1270toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button {
43cc2806
RK
1271 -moz-image-region: rect(0px, 80px, 16px, 64px);
1272}
1273
cc4b0b0d 1274#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button:hover:not([disabled="true"]),
7d3f7f14 1275toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1276 -moz-image-region: rect(16px, 80px, 32px, 64px);
1277}
1278
1279#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button[disabled="true"],
7d3f7f14 1280toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button[disabled="true"] {
cc4b0b0d
RK
1281 -moz-image-region: rect(32px, 80px, 48px, 64px);
1282}
1283
43cc2806 1284#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button,
7d3f7f14 1285toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button {
43cc2806
RK
1286 -moz-image-region: rect(0px, 96px, 16px, 80px);
1287}
1288
cc4b0b0d 1289#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button:hover:not([disabled="true"]),
7d3f7f14 1290toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1291 -moz-image-region: rect(16px, 96px, 32px, 80px);
1292}
1293
1294#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button[disabled="true"],
7d3f7f14 1295toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button[disabled="true"] {
cc4b0b0d
RK
1296 -moz-image-region: rect(32px, 96px, 48px, 80px);
1297}
1298
43cc2806
RK
1299/* === END menupanel.inc.css === */
1300
63ada306
RK
1301.toolbarbutton-1:not([type="menu-button"]) {
1302 -moz-box-orient: vertical;
1303}
1304
319c6529
RK
1305.toolbarbutton-1,
1306.toolbarbutton-1 > .toolbarbutton-menubutton-button {
1307 min-width: 36px;
1308 min-height: 36px;
319c6529
RK
1309}
1310
ab799a7a
RK
1311.toolbarbutton-1:not([type="menu-button"]) {
1312 -moz-box-orient: vertical;
319c6529
RK
1313}
1314
1315.toolbarbutton-1,
1316.toolbarbutton-1 > .toolbarbutton-menubutton-button,
1317.toolbarbutton-1[disabled="true"]:hover:active,
1318.toolbarbutton-1[disabled="true"]:hover:active > .toolbarbutton-menubutton-button {
1319 padding: 1px 2px;
1320}
1321
1322.toolbarbutton-1:hover:active,
1323.toolbarbutton-1[open="true"],
1324.toolbarbutton-1:hover:active > .toolbarbutton-menubutton-button {
1325 padding-top: 2px;
1326 padding-bottom: 0px;
1327 -moz-padding-start: 3px;
1328 -moz-padding-end: 1px;
1329}
1330
e20c83c3
RK
1331/* Help SDK icons fit: */
1332toolbarbutton[sdk-button="true"][cui-areatype="toolbar"] > .toolbarbutton-icon {
1333 width: 16px;
1334}
1335
1336#nav-bar toolbarbutton[sdk-button="true"][cui-areatype="toolbar"] > .toolbarbutton-icon {
1337 /* XXXgijs box models strike again: this is 16px + 2 * 7px padding + 2 * 1px border (from the rules above) */
1338 width: 32px;
1339}
1340
319c6529
RK
1341/* ::::: small primary toolbar buttons ::::: */
1342
9abeb12c
RK
1343#nav-bar {
1344 /* force iconsize="small" on this toolbar */
1345 counter-reset: smallicons;
1346}
1347
319c6529
RK
1348toolbar[mode="text"] .toolbarbutton-1,
1349toolbar[mode="icons"] .toolbarbutton-1,
1350toolbar[iconsize="small"] .toolbarbutton-1,
1351:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1,
1352toolbar[mode="text"] .toolbarbutton-menubutton-button,
1353toolbar[mode="icons"] .toolbarbutton-menubutton-button,
1354toolbar[iconsize="small"] .toolbarbutton-menubutton-button,
1355:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1356 min-width: 0px;
1357 min-height: 0px;
1358}
1359
1360toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker {
1361 padding-top: 4px;
1362 padding-bottom: 8px;
1363 -moz-padding-start: 1px;
1364 -moz-padding-end: 1px;
1365}
1366
1367toolbar[mode="icons"] .toolbarbutton-menubutton-dropmarker,
1368toolbar[iconsize="small"] .toolbarbutton-menubutton-dropmarker,
1369:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1370 padding-top: 0px;
1371 padding-bottom: 13px;
1372 -moz-padding-start: 1px;
1373 -moz-padding-end: 1px;
1374}
1375
1376toolbar[mode="text"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
1377toolbar[mode="text"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker {
1378 padding-top: 5px;
1379 padding-bottom: 7px;
43cc2806
RK
1380 -moz-padding-start: 2px;
1381 -moz-padding-end: 0px;
319c6529
RK
1382}
1383
1384toolbar[mode="icons"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
1385toolbar[mode="icons"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker,
1386toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
1387toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker,
1388:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1[type="menu-button"]:hover:active > .toolbarbutton-menubutton-dropmarker,
1389:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1[type="menu-button"][open="true"] > .toolbarbutton-menubutton-dropmarker {
1390 padding-top: 1px;
1391 padding-bottom: 12px;
43cc2806
RK
1392 -moz-padding-start: 2px;
1393 -moz-padding-end: 0px;
319c6529
RK
1394}
1395
1396toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker[disabled="true"] {
1397 padding-top: 4px !important;
1398 padding-bottom: 8px !important;
1399 -moz-padding-start: 1px !important;
1400 -moz-padding-end: 1px !important;
1401}
1402
1403toolbar[mode="icons"] .toolbarbutton-menubutton-dropmarker[disabled="true"],
1404toolbar[iconsize="small"] > .toolbarbutton-menubutton-dropmarker[disabled="true"] {
1405 padding-top: 0px !important;
1406 padding-bottom: 13px !important;
1407 -moz-padding-start: 1px !important;
1408 -moz-padding-end: 1px !important;
1409}
1410
1411toolbar[mode="icons"] .toolbarbutton-text,
1412toolbar[mode="text"] .toolbarbutton-icon {
1413 display: none;
1414}
1415
1416toolbar[mode="text"] .toolbarbutton-text {
1417 padding: 4px 0;
1418}
1419
1420toolbar[mode="text"] .toolbarbutton-1,
1421toolbar[mode="text"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1422 -moz-box-orient: horizontal;
1423}
1424
1425toolbar[mode="full"] .toolbarbutton-1,
1426toolbar[mode="full"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1427 min-width: 30px;
1428}
1429
d54f5b23 1430#navigator-toolbox[iconsize=small] > #nav-bar {
d54f5b23
RK
1431}
1432
1433#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar {
d54f5b23
RK
1434}
1435
1436
319c6529
RK
1437/* unified back/forward button */
1438
26125509
RK
1439/* Australis?
1440#forward-button {
1441 padding: 0 !important;
1442}
1443
1444#forward-button > menupopup {
1445 margin-top: 1px !important;
1446}
1447*/
1448
319c6529 1449#back-button {
319c6529
RK
1450 -moz-margin-end: 0;
1451}
1452
1453#forward-button {
319c6529
RK
1454 -moz-margin-start: 0;
1455}
1456
1457#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
1458#forward-button:-moz-locale-dir(rtl),
1459#forward-button:-moz-locale-dir(rtl) > .toolbarbutton-text {
71a617ff 1460 transform: scaleX(-1);
319c6529 1461}
26125509 1462/*
b36fc72e 1463#nav-bar #back-button:-moz-locale-dir(ltr) {
319c6529
RK
1464 border-top-right-radius: 0;
1465 border-bottom-right-radius: 0;
1466}
1467
b36fc72e
RK
1468#nav-bar #back-button:-moz-locale-dir(rtl),
1469#nav-bar #forward-button {
319c6529
RK
1470 border-top-left-radius: 0;
1471 border-bottom-left-radius: 0;
1472}
26125509 1473*/
7d3f7f14 1474#back-button,
676f0091
RK
1475window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1476 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1477 #unified-back-forward-button > #back-button {
319c6529
RK
1478 border-radius: 10000px;
1479 width: 30px;
1480 height: 30px;
1481 position: relative;
1482 z-index: 1;
1483 margin-top: -2px;
1484 margin-bottom: -2px;
1485 border: none;
38cfeb47
RK
1486 -moz-image-region: rect(54px, 20px, 74px, 0);
1487}
1488
7d3f7f14 1489#back-button[open="true"],
676f0091
RK
1490window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1491 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1492 #unified-back-forward-button > #back-button:not([disabled="true"]):hover,
1493window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1494 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1495 #unified-back-forward-button > #back-button[open="true"] {
38cfeb47
RK
1496 -moz-image-region: rect(54px, 40px, 74px, 20px);
1497}
1498
7d3f7f14 1499#back-button[disabled="true"],
676f0091
RK
1500window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1501 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1502 #unified-back-forward-button > #back-button[disabled="true"] {
38cfeb47 1503 -moz-image-region: rect(54px, 60px, 74px, 40px);
319c6529
RK
1504}
1505
676f0091
RK
1506window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1507 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1508 #unified-back-forward-button > #back-button:not([disabled="true"]):not([open="true"]):not(:active):hover {
319c6529
RK
1509}
1510
676f0091
RK
1511window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1512 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1513 #unified-back-forward-button > #back-button:not([disabled="true"]):hover:active,
1514window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1515 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1516 #unified-back-forward-button > #back-button[open="true"] {
319c6529
RK
1517}
1518
9abeb12c
RK
1519#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar[currentset*="unified-back-forward-button"],
1520#navigator-toolbox[iconsize="large"][mode="icons"] > #nav-bar:not([currentset]) {
319c6529
RK
1521/* padding-top: 3px;
1522 padding-bottom: 5px; */
1523}
1524
9abeb12c
RK
1525#navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar[currentset*="unified-back-forward-button"],
1526#navigator-toolbox[iconsize="large"][mode="icons"][tabsontop="true"] > #nav-bar:not([currentset]) {
319c6529
RK
1527/* padding-top: 5px; */
1528}
1529
7d3f7f14 1530#forward-button,
676f0091
RK
1531window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1532 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1533 #unified-back-forward-button > #forward-button {
319c6529 1534 /*mask: url(keyhole-forward-mask.svg#mask); XXX: this regresses twinopen */
2a5b7882 1535 /*clip-path: url("chrome://browser/content/browser.xul#winstripe-keyhole-forward-clip-path"); */
9abeb12c 1536 -moz-margin-start: -6px !important;
319c6529
RK
1537 padding-left: 7px;
1538 padding-right: 3px;
e8519ae0
RK
1539 margin-top: 2px;
1540 margin-bottom: 2px;
1541}
1542
7d3f7f14 1543#forward-button:-moz-locale-dir(ltr),
676f0091
RK
1544window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1545 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1546 #unified-back-forward-button > #forward-button:-moz-locale-dir(ltr) {
e8519ae0
RK
1547 border-top-right-radius: 11px;
1548 border-bottom-right-radius: 11px;
1549}
1550
7d3f7f14 1551#forward-button:-moz-locale-dir(rtl),
676f0091
RK
1552window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1553 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1554 #unified-back-forward-button > #forward-button:-moz-locale-dir(rtl) {
e8519ae0
RK
1555 border-top-left-radius: 11px;
1556 border-bottom-left-radius: 11px;
319c6529
RK
1557}
1558
319c6529
RK
1559.unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
1560.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
71bac478
RK
1561 list-style-image: url("chrome://global/skin/arrow/arrow-left.gif") !important;
1562}
1563
1564.unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr):hover,
1565.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl):hover {
1566 list-style-image: url("chrome://global/skin/arrow/arrow-left-hover.gif") !important;
319c6529
RK
1567}
1568
1569.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr),
1570.unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl) {
71bac478
RK
1571 list-style-image: url("chrome://global/skin/arrow/arrow-right.gif") !important;
1572}
1573
1574.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr):hover,
1575.unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl):hover {
1576 list-style-image: url("chrome://global/skin/arrow/arrow-right.gif") !important;
319c6529
RK
1577}
1578
8ad8bf83
RK
1579window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1580 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
1581 #unified-back-forward-button > #forward-button {
e8519ae0 1582/* border-top-right-radius: 0;
8ad8bf83 1583 border-bottom-right-radius: 0;
e8519ae0 1584 -moz-margin-end: 0; */
8ad8bf83
RK
1585}
1586
1587window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1588 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1589 #unified-back-forward-button:not([switchingtabs]) > #forward-button,
1590window:not([chromehidden~="toolbar"]) #urlbar-container:not([switchingtabs]) > #forward-button {
71a617ff 1591 transition: opacity 150ms ease-out;
8ad8bf83
RK
1592}
1593
1594window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1595 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1596 #unified-back-forward-button:not(:hover) > #forward-button[disabled],
1597window:not([chromehidden~="toolbar"]) #urlbar-container:not(:hover) > #forward-button[disabled] {
8ad8bf83
RK
1598 opacity: 0;
1599}
1600
e8519ae0
RK
1601window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1602 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1603 #unified-back-forward-button:hover > #forward-button[disabled],
1604window:not([chromehidden~="toolbar"]) #urlbar-container:hover > #forward-button[disabled] {
e8519ae0
RK
1605 background-color: transparent;
1606}
1607
36759a51
RK
1608#downloads-button > .toolbarbutton-icon {
1609 margin: 0;
1610}
1611
319c6529
RK
1612#cut-button {
1613 -moz-image-region: rect(0, 216px, 18px, 198px);
1614}
1615
143c5409
RK
1616#cut-button:not([disabled="true"]):hover {
1617 -moz-image-region: rect(18px, 216px, 36px, 198px);
1618}
1619
1620#cut-button[disabled="true"] {
1621 -moz-image-region: rect(36px, 216px, 54px, 198px);
1622}
1623
319c6529
RK
1624#copy-button {
1625 -moz-image-region: rect(0, 234px, 18px, 216px);
1626}
1627
143c5409
RK
1628#copy-button:not([disabled="true"]):hover {
1629 -moz-image-region: rect(18px, 234px, 36px, 216px);
1630}
1631
1632#copy-button[disabled="true"] {
1633 -moz-image-region: rect(36px, 234px, 54px, 216px);
1634}
1635
319c6529
RK
1636#paste-button {
1637 -moz-image-region: rect(0, 252px, 18px, 234px);
1638}
1639
143c5409
RK
1640#paste-button:not([disabled="true"]):hover {
1641 -moz-image-region: rect(18px, 252px, 36px, 234px);
1642}
1643
1644#paste-button[disabled="true"] {
1645 -moz-image-region: rect(36px, 252px, 54px, 234px);
1646}
1647
319c6529
RK
1648#zoom-out-button {
1649 -moz-image-region: rect(0, 288px, 18px, 270px);
1650 -moz-margin-end: 0;
1651}
1652
1653#zoom-in-button {
1654 -moz-image-region: rect(0, 306px, 18px, 288px);
b36fc72e
RK
1655}
1656
143c5409
RK
1657#zoom-out-button:not([disabled="true"]):hover {
1658 -moz-image-region: rect(18px, 288px, 36px, 270px);
1659}
1660
1661#zoom-out-button[disabled="true"] {
1662 -moz-image-region: rect(36px, 288px, 54px, 270px);
1663}
1664
1665#zoom-in-button:not([disabled="true"]):hover {
1666 -moz-image-region: rect(18px, 306px, 36px, 288px);
1667}
1668
1669#zoom-in-button[disabled="true"] {
1670 -moz-image-region: rect(36px, 306px, 54px, 288px);
1671}
1672
6adbc9a6
RK
1673/* tabview button & menu item */
1674
1675#tabview-button,
1676#menu_tabview {
fd291cce 1677 list-style-image: url("chrome://browser/skin/tabview/tabview.png") !important;
6adbc9a6
RK
1678}
1679
1680#tabview-button {
1681 -moz-image-region: rect(0, 90px, 18px, 72px);
1682}
1683
1684#tabview-button[groups="0"] {
1685 -moz-image-region: rect(0, 18px, 18px, 0);
1686}
1687
1688#tabview-button[groups="1"] {
1689 -moz-image-region: rect(0, 36px, 18px, 18px);
1690}
1691
1692#tabview-button[groups="2"] {
1693 -moz-image-region: rect(0, 54px, 18px, 36px);
1694}
1695
1696#tabview-button[groups="3"] {
1697 -moz-image-region: rect(0, 72px, 18px, 54px);
1698}
1699
1700#menu_tabview {
1701 -moz-image-region: rect(1px, 89px, 17px, 73px);
1702}
1703
1704#menu_tabview[groups="0"] {
1705 -moz-image-region: rect(1px, 17px, 17px, 1px);
1706}
1707
1708#menu_tabview[groups="1"] {
1709 -moz-image-region: rect(1px, 35px, 17px, 19px);
1710}
1711
1712#menu_tabview[groups="2"] {
1713 -moz-image-region: rect(1px, 53px, 17px, 37px);
1714}
1715
1716#menu_tabview[groups="3"] {
1717 -moz-image-region: rect(1px, 71px, 17px, 55px);
1718}
1719
319c6529
RK
1720/* ::::: fullscreen window controls ::::: */
1721
8d7ef0d9 1722#window-controls {
ab799a7a
RK
1723 -moz-margin-start: 4px;
1724}
1725
319c6529
RK
1726#minimize-button,
1727#restore-button,
1728#close-button {
1729/* padding: 0; */
1730}
1731
1732#minimize-button {
1733 list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
1734}
1735
1736#minimize-button:hover {
1737 list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
1738}
1739
1740#restore-button {
1741 list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
1742}
1743
1744#restore-button:hover {
1745 list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
1746}
1747
1748#close-button {
1749 list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
1750}
1751
1752#close-button:hover {
1753 list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
1754}
1755
1756/* ::::: Location Bar ::::: */
1757
319c6529
RK
1758#urlbar,
1759.searchbar-textbox {
1760 border-radius: 5px;
1761 margin: 0;
1762 -moz-margin-start: 3px;
1763}
1764
ffce2402
RK
1765#urlbar {
1766 width: 7em;
f0071a71
RK
1767 /* make color as light as possible to deal with dark non-domain parts */
1768 color: #FFBFFF;
ffce2402
RK
1769}
1770
319c6529
RK
1771#urlbar:-moz-lwtheme,
1772.searchbar-textbox:-moz-lwtheme {
1773 /* background-color: rgba(255,255,255,.8);
1774 @navbarTextboxCustomBorder@
1775 color: black; */
1776}
1777
8ad8bf83
RK
1778window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1779 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1780 #unified-back-forward-button + #urlbar-container,
1781window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper {
e8519ae0
RK
1782 padding-left: 22px;
1783 -moz-margin-start: -22px;
8ad8bf83
RK
1784 position: relative;
1785 pointer-events: none;
1786}
1787
1788window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1789 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1790 #unified-back-forward-button + #urlbar-container > #urlbar,
1791window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar {
e8519ae0
RK
1792/* -moz-border-start: none;
1793 margin-left: 0; */
8ad8bf83
RK
1794 pointer-events: all;
1795}
1796
1797window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1798 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1799 #unified-back-forward-button:not([switchingtabs]) + #urlbar-container > #urlbar,
1800window:not([chromehidden~="toolbar"]) #urlbar-container:not([switchingtabs]) > #urlbar-wrapper > #urlbar {
71a617ff 1801 transition: margin-left 150ms ease-out;
8ad8bf83
RK
1802}
1803
1804window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1805 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1806 #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(ltr),
1807window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(ltr) {
e8519ae0
RK
1808/* border-top-left-radius: 0;
1809 border-bottom-left-radius: 0; */
8ad8bf83
RK
1810}
1811
1812window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1813 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1814 #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(rtl),
1815window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) {
e8519ae0
RK
1816/* border-top-right-radius: 0;
1817 border-bottom-right-radius: 0; */
8ad8bf83
RK
1818}
1819
8ad8bf83
RK
1820window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1821 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1822 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar,
1823window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar {
e8519ae0 1824 margin-left: -22px;
8ad8bf83
RK
1825}
1826
1827window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1828 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1829 #unified-back-forward-button[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar,
1830window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:hover:not([switchingtabs]) > #urlbar-wrapper > #urlbar {
8ad8bf83 1831 /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */
71a617ff 1832 transition-delay: 100s;
8ad8bf83
RK
1833}
1834
1835window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1836 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1837 #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar,
1838window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar {
8ad8bf83 1839 /* when not hovered anymore, trigger a new transition to hide the forward button immediately */
e8519ae0 1840 margin-left: -22.01px;
8ad8bf83
RK
1841}
1842
1843window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1844 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
e8519ae0 1845 #unified-back-forward-button + #urlbar-container:-moz-locale-dir(rtl),
8ad8bf83
RK
1846window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1847 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1848 #unified-back-forward-button + #urlbar-container > #urlbar:-moz-locale-dir(rtl),
1849window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper:-moz-locale-dir(rtl),
1850window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) {
85cfb236 1851 /* let winstripe-urlbar-back-button-clip-path clip the urlbar's right side for RTL */
71a617ff 1852 transform: scaleX(-1);
8ad8bf83
RK
1853}
1854
a7145e95
RK
1855html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
1856.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
319c6529
RK
1857 color: #E7ADE7;
1858}
1859
1860#urlbar:-moz-lwtheme[focused="true"],
1861.searchbar-textbox:-moz-lwtheme[focused="true"] {
1862/* background-color: white; */
1863}
1864
1865#urlbar-container {
1866 -moz-box-orient: horizontal;
1867 -moz-box-align: stretch;
1868}
1869
9abeb12c
RK
1870.urlbar-textbox-container {
1871 -moz-box-align: stretch;
1872}
1873
a40f6a79
RK
1874.urlbar-input-box {
1875 -moz-margin-start: 0;
fcfb76ce 1876 min-width: 4em;
a40f6a79
RK
1877}
1878
319c6529 1879#urlbar-icons {
319c6529
RK
1880 -moz-box-align: center;
1881}
1882
1883.urlbar-icon {
b8384c33 1884 padding: 0 2px;
ffce2402
RK
1885}
1886
1887.searchbar-engine-button,
1888.search-go-container {
4b686546
RK
1889 padding: 2px;
1890}
1891
1892.search-go-container > .search-go-button {
1893 padding: 0;
319c6529
RK
1894}
1895
ffce2402
RK
1896.urlbar-icon:hover {
1897}
1898
1899.urlbar-icon[open="true"],
1900.urlbar-icon:hover:active {
1901}
1902
319c6529
RK
1903#urlbar-search-splitter {
1904 min-width: 6px;
1905 -moz-margin-start: -3px;
1906 border: none;
1907 background: transparent;
1908}
1909
f0071a71 1910#urlbar-search-splitter + #urlbar-container > #urlbar,
319c6529
RK
1911#urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox {
1912 -moz-margin-start: 0;
1913}
1914
e20c83c3
RK
1915#urlbar-display-box {
1916}
1917
319c6529 1918#urlbar-display {
319c6529
RK
1919 -moz-border-end: 1px solid #9C9CFF;
1920 -moz-margin-end: 3px;
ab799a7a
RK
1921 margin-top: 0;
1922 margin-bottom: 0;
a40f6a79 1923 -moz-margin-start: 0;
ab799a7a
RK
1924 color: #8050B0;
1925}
1926
26125509
RK
1927#search-container {
1928 min-width: calc(54px + 11ch);
1929}
1930
319c6529
RK
1931/* identity box */
1932
1933#identity-box {
319c6529 1934 border-radius: 2px;
85cfb236 1935 font-size: .9em;
319c6529
RK
1936}
1937
e20c83c3
RK
1938#identity-box:-moz-locale-dir(ltr) {
1939/* border-top-left-radius: 1.5px;
1940 border-bottom-left-radius: 1.5px;*/
1941}
1942
1943#identity-box:-moz-locale-dir(rtl) {
1944/* border-top-right-radius: 1.5px;
1945 border-bottom-right-radius: 1.5px;*/
1946}
1947
8ad8bf83 1948#notification-popup-box:not([hidden]) + #identity-box {
5517da5a 1949 -moz-padding-start: 10px !important;
8ad8bf83
RK
1950 border-radius: 0;
1951}
1952
1953window: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])) >
26125509
RK
1955 #unified-back-forward-button + #urlbar-container > #urlbar > #identity-box,
1956window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar > #identity-box {
d15d08bf 1957/* border-radius: 0; */
2a5b7882
RK
1958 -moz-padding-start: 2px;
1959 -moz-padding-end: 2px;
1960 -moz-margin-end: 1px;
8ad8bf83
RK
1961}
1962
1963window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1964 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1965 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar >
1966 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr),
1967window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar >
1968 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
2a5b7882 1969 padding-left: 2px;
71a617ff 1970 transition: padding-left;
8ad8bf83
RK
1971}
1972
1973window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1974 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1975 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar >
1976 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl),
1977window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar >
1978 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
2a5b7882 1979 padding-right: 2px;
71a617ff 1980 transition: padding-right;
8ad8bf83
RK
1981}
1982
1983window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1984 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1985 #unified-back-forward-button[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar >
1986 #notification-popup-box[hidden] + #identity-box,
1987window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:hover:not([switchingtabs]) > #urlbar-wrapper > #urlbar >
1988 #notification-popup-box[hidden] + #identity-box {
8ad8bf83 1989 /* forward button hiding is delayed when hovered */
71a617ff 1990 transition-delay: 100s;
8ad8bf83
RK
1991}
1992
1993window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
1994 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
1995 #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar >
1996 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr),
1997window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar >
1998 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
8ad8bf83 1999 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
2a5b7882 2000 padding-left: 2.01px;
8ad8bf83
RK
2001}
2002
2003window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
2004 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
26125509
RK
2005 #unified-back-forward-button[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar >
2006 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl),
2007window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar >
2008 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
8ad8bf83 2009 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
2a5b7882 2010 padding-right: 2.01px;
8ad8bf83
RK
2011}
2012
56859d76
RK
2013#urlbar[pageproxystate="valid"] > #identity-box.chromeUI,
2014#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
a40f6a79 2015 -moz-margin-end: 3px;
319c6529
RK
2016}
2017
56859d76 2018#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:-moz-locale-dir(ltr),
37953ab4 2019#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(ltr) {
a40f6a79
RK
2020 border-top-right-radius: 0;
2021 border-bottom-right-radius: 0;
319c6529
RK
2022}
2023
56859d76 2024#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:-moz-locale-dir(rtl),
37953ab4 2025#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(rtl) {
a40f6a79
RK
2026 border-top-left-radius: 0;
2027 border-bottom-left-radius: 0;
319c6529
RK
2028}
2029
a40f6a79
RK
2030#identity-box.verifiedIdentity:not(:-moz-lwtheme) {
2031 background-color: #000000;
319c6529
RK
2032}
2033
2034#identity-box:-moz-focusring {
2035 outline: 1px dotted #008484;
f993773d 2036 outline-offset: -1px;
319c6529
RK
2037}
2038
2039#identity-box.verifiedDomain:-moz-focusring,
2040#identity-box.verifiedIdentity:-moz-focusring {
2041 outline-color: #000000;
2042}
2043
2044#identity-icon-labels {
2045 -moz-margin-start: 1px;
2046 -moz-margin-end: 3px;
319c6529
RK
2047}
2048
2049/* Location bar dropmarker */
2050
38cfeb47 2051.urlbar-history-dropmarker:not(:hover):not([open="true"]) {
319c6529 2052 background-color: transparent;
319c6529
RK
2053}
2054
00f971bc
RK
2055#urlbar-container[combined="true"] > #urlbar > .urlbar-history-dropmarker,
2056#urlbar-wrapper > #urlbar > .urlbar-history-dropmarker {
38cfeb47
RK
2057 border: none;
2058 border-radius: 0px;
319c6529
RK
2059}
2060
ffce2402
RK
2061.urlbar-history-dropmarker:hover {
2062}
2063
2064.urlbar-history-dropmarker:hover:active,
2065.urlbar-history-dropmarker[open="true"] {
2066}
2067
319c6529
RK
2068/* page proxy icon */
2069
e7c8bab1
RK
2070/* === BEGIN identity-block.inc.css === */
2071
2072#urlbar[pageproxystate="valid"] > #identity-box.chromeUI {
2073 /* Default theme does different color per channel, we can't as they do it build-time. */
2074 color: #9C9CFF;
2075 -moz-border-end: 1px solid #9C9CFF;
2076}
2077
2078#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
2079 color: #008484;
2080 -moz-border-end: 1px solid #008484;
2081}
2082
2083#urlbar[pageproxystate="valid"] > #identity-box.chromeUI,
2084#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
2085 background-position: right;
2086 background-size: 1px;
2087 background-repeat: no-repeat;
2088}
2089
2090/* page proxy icon */
2091
4d58ff64 2092#page-proxy-favicon {
319c6529
RK
2093 width: 16px;
2094 height: 16px;
a40f6a79 2095 list-style-image: url("chrome://browser/skin/identity-icons-generic.png");
00f971bc 2096 margin: 2px;
e7c8bab1
RK
2097}
2098
2099.chromeUI > #page-proxy-favicon[pageproxystate="valid"] {
2100 list-style-image: url("chrome://branding/content/identity-icons-brand.png");
319c6529
RK
2101}
2102
2a5b7882 2103.verifiedDomain > #page-proxy-favicon[pageproxystate="valid"] {
a40f6a79
RK
2104 list-style-image: url("chrome://browser/skin/identity-icons-https.png");
2105}
2106
2a5b7882 2107.verifiedIdentity > #page-proxy-favicon[pageproxystate="valid"] {
a40f6a79
RK
2108 list-style-image: url("chrome://browser/skin/identity-icons-https-ev.png");
2109}
2110
56ab361a
RK
2111.mixedActiveContent > #page-proxy-favicon[pageproxystate="valid"] {
2112 list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-active.png");
2113}
2114
e7c8bab1
RK
2115.mixedDisplayContent > #page-proxy-favicon[pageproxystate="valid"] {
2116 list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-display.png");
2117}
2118
2119.mixedDisplayContentLoadedActiveBlocked > #page-proxy-favicon[pageproxystate="valid"] {
2120 list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-display.png");
2121}
2122
2123#page-proxy-favicon[pageproxystate="invalid"] {
2124 opacity: 0.3;
2125}
2126
2127#identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon {
2128 list-style-image: url("chrome://branding/content/icon64.png");
2129}
2130
2131#identity-popup-brandName {
2132 font-weight: bold;
2133 font-size: 1.25em;
2134 margin-top: .5em;
2135 margin-bottom: .5em;
2136}
2137
2138#identity-popup-content-box {
2139 max-width: 50ch;
2140}
2141
2142/* === END identity-block.inc.css === */
2143
2144#page-proxy-favicon {
2145 -moz-image-region: rect(0, 16px, 16px, 0);
2146}
2147
2a5b7882 2148#identity-box:hover > #page-proxy-favicon {
a40f6a79
RK
2149 -moz-image-region: rect(0, 32px, 16px, 16px);
2150}
2151
2a5b7882
RK
2152#identity-box:hover:active > #page-proxy-favicon,
2153#identity-box[open=true] > #page-proxy-favicon {
a40f6a79 2154 -moz-image-region: rect(0, 48px, 16px, 32px);
acb0e9b8 2155}
2156
2a5b7882
RK
2157#identity-box:hover {
2158 background-color: #FFCF00;
7092015d 2159 color: #000000;
2a5b7882
RK
2160}
2161
2162#identity-box:hover:active,
2163#identity-box[open=true] {
2164 background-color: #FF9F00;
7092015d 2165 color: #000000;
2a5b7882
RK
2166}
2167
56859d76
RK
2168#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:hover,
2169#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:hover:active,
2170#urlbar[pageproxystate="valid"] > #identity-box.chromeUI[open=true] {
2171 background-color: #9C9CFF;
2172 color: #000000;
2173}
2174
387e6560
RK
2175#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover,
2176#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover:active,
2177#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity[open=true] {
2a5b7882
RK
2178 background-color: #008484;
2179 color: #000000;
2180}
2181
319c6529
RK
2182/* autocomplete */
2183
319c6529
RK
2184#treecolAutoCompleteImage {
2185 max-width: 36px;
2186}
acb0e9b8 2187
319c6529
RK
2188.ac-result-type-bookmark,
2189.autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
71bac478 2190 list-style-image: url("chrome://browser/skin/places/bookmark.png");
319c6529 2191 -moz-image-region: rect(0px 16px 16px 0px);
c1f7cc84 2192 width: 16px;
319c6529 2193 height: 16px;
acb0e9b8 2194}
2195
319c6529
RK
2196.ac-result-type-keyword,
2197.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) {
2198 list-style-image: url("chrome://global/skin/icons/Search-glass.png");
2199 -moz-image-region: rect(0px 32px 16px 16px);
acb0e9b8 2200 width: 16px;
2201 height: 16px;
2202}
2203
319c6529
RK
2204.ac-result-type-tag,
2205.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
8da9da4e 2206 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
c1f7cc84 2207 width: 16px;
319c6529
RK
2208 height: 16px;
2209}
acb0e9b8 2210
319c6529
RK
2211.ac-comment {
2212 font-size: 1.15em;
acb0e9b8 2213}
319c6529
RK
2214
2215.ac-extra > .ac-comment {
2216 font-size: inherit;
acb0e9b8 2217}
319c6529
RK
2218
2219.ac-url-text,
2220.ac-action-text {
2221 color: #9C9CFF;
acb0e9b8 2222}
319c6529
RK
2223
2224richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
2225 list-style-image: url("chrome://browser/skin/actionicon-tab.png");
85cfb236
RK
2226 -moz-image-region: rect(0, 16px, 16px, 0);
2227 padding: 0 3px;
2228}
2229
2230richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
2231 -moz-image-region: rect(16px, 16px, 32px, 0);
acb0e9b8 2232}
2233
319c6529
RK
2234.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
2235 color: #8050B0;
2236}
acb0e9b8 2237
319c6529
RK
2238.ac-comment[selected="true"],
2239.ac-url-text[selected="true"],
2240.ac-action-text[selected="true"] {
2241 color: inherit !important;
acb0e9b8 2242}
2243
c1f7cc84
RK
2244.autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
2245.autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
319c6529
RK
2246{
2247 color: #8050B0;
2248 font-size: smaller;
acb0e9b8 2249}
319c6529
RK
2250
2251.autocomplete-treebody::-moz-tree-cell(suggesthint) {
2252 border-top: 1px solid #9C9CFF;
acb0e9b8 2253}
2254
319c6529
RK
2255/* combined go/reload/stop button in location bar */
2256
ffce2402 2257#go-button,
319c6529
RK
2258#urlbar > toolbarbutton {
2259 list-style-image: url("chrome://browser/skin/reload-stop-go.png");
38cfeb47 2260 /* margin: -2px; */
9abeb12c 2261 -moz-margin-start: 0;
ffce2402 2262 padding: 0 2px;
319c6529
RK
2263 background-origin: border-box;
2264 border: none;
9abeb12c
RK
2265 -moz-border-start: 1px solid #9C9CFF;
2266}
2267
ffce2402
RK
2268#go-button {
2269 padding: 0 3px;
2270}
2271
9abeb12c 2272#urlbar:-moz-locale-dir(ltr) > toolbarbutton {
38cfeb47
RK
2273 border-top-left-radius: 0px;
2274 border-bottom-left-radius: 0px;
acb0e9b8 2275}
acb0e9b8 2276
9abeb12c 2277#urlbar:-moz-locale-dir(rtl) > toolbarbutton {
38cfeb47
RK
2278 border-top-right-radius: 0px;
2279 border-bottom-right-radius: 0px;
9abeb12c
RK
2280}
2281
dce90fef
RK
2282#urlbar > toolbarbutton:not([disabled]):active:hover,
2283#urlbar-reload-button:not(:hover) {
2284 -moz-border-start-style: none;
714b11f6 2285 -moz-padding-start: 3px;
dce90fef
RK
2286}
2287
2288#urlbar > toolbarbutton:not([disabled]):active:hover {
acb0e9b8 2289}
2290
319c6529 2291#urlbar-go-button {
ffce2402 2292 -moz-image-region: rect(0, 42px, 14px, 28px);
acb0e9b8 2293}
2294
ffce2402
RK
2295#go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
2296#urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
71a617ff 2297 transform: scaleX(-1);
ffce2402
RK
2298}
2299
2300#urlbar-go-button:hover,
2301#go-button:hover {
2302 -moz-image-region: rect(14px, 42px, 28px, 28px);
acb0e9b8 2303}
2304
319c6529 2305#urlbar-reload-button {
ffce2402 2306 -moz-image-region: rect(0px, 14px, 14px, 0px);
38cfeb47
RK
2307}
2308
2309#urlbar-reload-button[disabled] {
ffce2402 2310 -moz-image-region: rect(28px, 14px, 42px, 0px);
acb0e9b8 2311}
2312
319c6529 2313#urlbar-reload-button:not([disabled]):hover {
ffce2402 2314 -moz-image-region: rect(14px, 14px, 28px, 0px);
acb0e9b8 2315}
319c6529
RK
2316
2317#urlbar-stop-button {
ffce2402 2318 -moz-image-region: rect(0px, 28px, 14px, 14px);
acb0e9b8 2319}
319c6529
RK
2320
2321#urlbar-stop-button:hover {
ffce2402 2322 -moz-image-region: rect(14px, 28px, 28px, 14px);
acb0e9b8 2323}
2324
319c6529
RK
2325/* popup blocker button */
2326
2327#page-report-button {
2328 list-style-image: url("chrome://browser/skin/urlbar-popup-blocked.png");
2329 -moz-image-region: rect(0, 16px, 16px, 0);
acb0e9b8 2330}
319c6529 2331
71bac478 2332#page-report-button:hover ,
319c6529
RK
2333#page-report-button:hover:active,
2334#page-report-button[open="true"] {
71bac478 2335 -moz-image-region: rect(0, 32px, 16px, 16px);
acb0e9b8 2336}
2337
c4460289
RK
2338/* social share panel */
2339
2340#social-share-panel > iframe {
2341/* background: linear-gradient(to bottom, #f0f4f7, #fafbfc);*/
2342 width: 300px;
2343 height: 150px;
2344}
2345
2346#social-share-button {
2347 list-style-image: url("chrome://browser/skin/social/share-button.png");
2348 -moz-image-region: rect(0, 16px, 16px, 0);
2349}
2350
2351.social-share-toolbar {
2352 border-right: 1px solid #9C9CFF;
2353/* background-color: #000000; */
2354}
2355
2356#social-share-provider-buttons {
2357 padding: 6px;
2358}
2359
2360#social-share-provider-buttons > .share-provider-button {
2361 -moz-appearance: none;
2362 padding: 5px;
2363 margin: 1px;
2364 border: none;
2365 background: none;
2366 border-radius: 2px;
2367}
2368
2369#social-share-provider-buttons > .share-provider-button[checked="true"]:not([disabled="true"]),
2370#social-share-provider-buttons > .share-provider-button:hover,
2371#social-share-provider-buttons > .share-provider-button:active {
2372 padding: 4px;
2373}
2374
2375#social-share-provider-buttons > .share-provider-button[checked="true"]:not([disabled="true"]) {
2376}
2377
2378#social-share-provider-buttons > .share-provider-button > .toolbarbutton-text {
2379 display: none;
2380}
2381#social-share-provider-buttons > .share-provider-button > .toolbarbutton-icon {
2382 width: 16px;
2383 min-height: 16px;
2384 max-height: 16px;
2385}
2386
5a199ba1
RK
2387toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
2388 width: auto;
2389 height: auto;
2390 max-width: 32px;
2391 max-height: 24px;
2392}
2393
c4460289
RK
2394/* fixup corners for share panel */
2395.social-panel > .social-panel-frame {
2396 border-radius: inherit;
2397}
2398
2399#social-share-panel {
2400 max-height: 600px;
2401 min-height: 100px;
2402 max-width: 800px;
2403 min-width: 300px;
2404}
2405
2406.social-share-frame {
2407/* background: linear-gradient(to bottom, #f0f4f7, #fafbfc); */
2408 width: 330px;
2409 height: 150px;
c4460289
RK
2410 /* we resize our panels dynamically, make it look nice */
2411 transition: height 100ms ease-out, width 100ms ease-out;
2412}
2413
e2734cc7
RK
2414.social-share-frame:-moz-locale-dir(ltr) {
2415 border-top-left-radius: 0;
2416 border-bottom-left-radius: 0;
2417 border-top-right-radius: inherit;
2418 border-bottom-right-radius: inherit;
2419}
2420
2421.social-share-frame:-moz-locale-dir(rtl) {
c4460289
RK
2422 border-top-left-radius: inherit;
2423 border-bottom-left-radius: inherit;
e2734cc7
RK
2424 border-top-right-radius: 0;
2425 border-bottom-right-radius: 0;
c4460289
RK
2426}
2427
e2734cc7
RK
2428#social-share-panel > .social-share-toolbar:-moz-locale-dir(ltr) {
2429 border-top-left-radius: inherit;
2430 border-bottom-left-radius: inherit;
2431}
2432
2433#social-share-panel > .social-share-toolbar:-moz-locale-dir(rtl) {
2434 border-top-right-radius: inherit;
2435 border-bottom-right-radius: inherit;
2436}
2437
2438#social-share-provider-buttons:-moz-locale-dir(ltr) {
c4460289
RK
2439 border-top-left-radius: inherit;
2440 border-bottom-left-radius: inherit;
2441}
2442
e2734cc7
RK
2443#social-share-provider-buttons:-moz-locale-dir(rtl) {
2444 border-top-right-radius: inherit;
2445 border-bottom-right-radius: inherit;
2446}
2447
889649fd
RK
2448/* social recommending panel */
2449
a6757852 2450#social-mark-button {
d7cfd768 2451 -moz-image-region: rect(0, 16px, 16px, 0);
889649fd
RK
2452}
2453
319c6529
RK
2454/* star button */
2455
00f971bc
RK
2456/* #urlbar-container only directly contains the urlbar pre-Australis, don't assign an icon in Australis */
2457#urlbar-container > #urlbar > #urlbar-icons > #star-button {
71bac478
RK
2458 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark.png");
2459 -moz-image-region: rect(16px 16px 32px 0px);
acb0e9b8 2460}
319c6529 2461
00f971bc 2462#urlbar-container > #urlbar > #urlbar-icons > #star-button:hover {
71bac478 2463 -moz-image-region: rect(16px 32px 32px 16px);
acb0e9b8 2464}
319c6529 2465
00f971bc 2466#urlbar-container > #urlbar > #urlbar-icons > #star-button:hover:active {
71bac478 2467 -moz-image-region: rect(16px 48px 32px 32px);
acb0e9b8 2468}
2469
00f971bc 2470#urlbar-container > #urlbar > #urlbar-icons > #star-button[starred="true"] {
71bac478
RK
2471 -moz-image-region: rect(0px 16px 16px 0px);
2472}
2473
00f971bc 2474#urlbar-container > #urlbar > #urlbar-icons > #star-button[starred="true"]:hover {
71bac478
RK
2475 -moz-image-region: rect(0px 32px 16px 16px);
2476}
2477
00f971bc 2478#urlbar-container > #urlbar > #urlbar-icons > #star-button[starred="true"]:hover:active {
71bac478 2479 -moz-image-region: rect(0px 48px 16px 32px);
acb0e9b8 2480}
319c6529
RK
2481
2482/* bookmarking panel */
2483#editBookmarkPanelStarIcon {
2484 list-style-image: url("chrome://browser/skin/places/starred48.png");
2485 width: 48px;
2486 height: 48px;
acb0e9b8 2487}
319c6529
RK
2488
2489#editBookmarkPanelStarIcon[unstarred] {
2490 list-style-image: url("chrome://browser/skin/places/unstarred48.png");
acb0e9b8 2491}
2492
319c6529
RK
2493#editBookmarkPanelTitle {
2494 font-size: 130%;
acb0e9b8 2495}
319c6529
RK
2496
2497#editBookmarkPanelHeader,
2498#editBookmarkPanelContent {
2499 margin-bottom: .5em;
acb0e9b8 2500}
319c6529
RK
2501
2502/* Implements editBookmarkPanel resizing on folderTree un-collapse. */
2503#editBMPanel_folderTree {
2504 min-width: 27em;
acb0e9b8 2505}
2506
f993773d 2507.panel-promo-box {
5a3cfc14 2508 margin: 5px -6px -6px;
f0eab82c 2509 padding: 5px;
889649fd 2510 border-top: 1px solid #9C9CFF;
f0eab82c
RK
2511 border-bottom-left-radius: 5px;
2512 border-bottom-right-radius: 5px;
f993773d
RK
2513}
2514
2515.panel-promo-icon {
2516 list-style-image: url("chrome://browser/skin/sync-notification-24.png");
2517 -moz-margin-end: 10px;
2518 vertical-align: middle;
2519}
2520
2521.panel-promo-closebutton {
2522 list-style-image: url("chrome://global/skin/icons/close-button.gif");
f0eab82c
RK
2523 -moz-margin-end: -3px;
2524 margin-top: -3px;
f993773d
RK
2525}
2526
2527.panel-promo-closebutton:hover {
2528 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2529}
2530
2531.panel-promo-closebutton:hover:active {
2532 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2533}
2534
2535.panel-promo-closebutton > .toolbarbutton-text {
2536 padding: 0;
2537 margin: 0;
2538}
2539
319c6529
RK
2540/* ::::: content area ::::: */
2541
2542#sidebar {
2543 background-color: Window;
acb0e9b8 2544}
319c6529
RK
2545
2546#sidebar-title {
2547 -moz-padding-start: 0px;
acb0e9b8 2548}
319c6529 2549
fe524e0c
RK
2550.browserContainer > findbar {
2551/*
2552 background-color: -moz-dialog;
2553 color: -moz-DialogText;
2554*/
2555}
2556
319c6529
RK
2557/* ::::: throbber ::::: */
2558
2559#navigator-throbber {
2560 width: 16px;
2561 min-height: 16px;
2562 margin: 0 3px;
acb0e9b8 2563}
2564
319c6529 2565#navigator-throbber[busy="true"] {
95f333af 2566 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
acb0e9b8 2567}
319c6529
RK
2568
2569#navigator-throbber,
2570#wrapper-navigator-throbber > #navigator-throbber {
95f333af 2571 list-style-image: url("chrome://communicator/skin/brand/throbber16-single.png");
acb0e9b8 2572}
319c6529
RK
2573
2574/* Tabstrip */
b36fc72e 2575
e20c83c3
RK
2576/* Remove selector when Australis lands - this makes it only apply pre-Australis as iconsize only exists there */
2577#navigator-toolbox[iconsize] > #TabsToolbar {
319c6529
RK
2578 min-height: 0;
2579 padding: 0;
b36fc72e
RK
2580 -moz-binding: url("chrome://global/content/bindings/toolbar.xml#toolbar");
2581}
2582
e20c83c3
RK
2583/* Remove selector when Australis lands - this makes it only apply post-Australis as iconsize doesn't exist there */
2584#navigator-toolbox:not([iconsize]) > #TabsToolbar {
2585 min-height: 0;
2586 padding: 0;
2587 -moz-binding: url("chrome://browser/content/customizableui/toolbar.xml#toolbar");
2588}
2589
b36fc72e 2590#TabsToolbar .toolbar-holder {
c1f7cc84 2591 background-color: #000000; /* correct effect of being an actual toolbar */
acb0e9b8 2592}
2593
b36fc72e 2594#main-window[disablechrome] #TabsToolbar,
319c6529 2595#TabsToolbar[tabsontop="false"] {
8b5fc82e 2596 border-bottom: 1px solid #008484;
acb0e9b8 2597}
319c6529 2598
6dc70335
RK
2599/* === BEGIN tabs.inc.css === */
2600
319c6529 2601.tabbrowser-tab,
43ee1307
RK
2602.tabs-newtab-button,
2603#TabsToolbar > #new-tab-button {
319c6529 2604 margin-top: 0px;
acb0e9b8 2605}
319c6529 2606
43ee1307 2607.tabbrowser-tab {
57fc408c
RK
2608 padding: 1px 4px 2px;
2609}
2610
2611.tabbrowser-tab:first-of-type {
2612 -moz-margin-start: 2px;
2613}
2614
43ee1307
RK
2615.tabs-newtab-button,
2616#TabsToolbar > #new-tab-button {
57fc408c
RK
2617 border-radius: 8px 8px 0px 0px;
2618 -moz-margin-start: 0;
2619}
2620
43ee1307
RK
2621.tabs-newtab-button:not(:hover),
2622#TabsToolbar > #new-tab-button:not(:hover) {
57fc408c
RK
2623 background-color: #C09070;
2624}
2625
fe524e0c
RK
2626.tabbrowser-tab[remote] {
2627 text-decoration: underline;
2628}
2629
6dc70335 2630/* Selected tab */
319c6529
RK
2631
2632.tabbrowser-tab[selected="true"] {
acb0e9b8 2633}
2634
6dc70335 2635/* End selected tab */
9abeb12c 2636
6dc70335 2637/* Pinned tabs */
319c6529 2638
6dc70335
RK
2639.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) {
2640 background-color: #E7ADE7;
acb0e9b8 2641}
6dc70335
RK
2642.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]):hover {
2643 background-color: #3333FF;
2644 color: #000000;
acb0e9b8 2645}
2646
6dc70335 2647/* New tab button */
319c6529 2648
6dc70335
RK
2649.tabs-newtab-button {
2650 width: 28px;
acb0e9b8 2651}
319c6529 2652
6dc70335
RK
2653#TabsToolbar > #new-tab-button {
2654 width: 26px;
acb0e9b8 2655}
2656
6dc70335 2657/* === END tabs.inc.css === */
319c6529
RK
2658
2659.tab-throbber,
2660.tab-icon-image {
2661 width: 16px;
2662 height: 16px;
dce90fef 2663 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
8da9da4e 2664 -moz-image-region: auto;
319c6529 2665 -moz-margin-end: 3px;
613daf44 2666}
2667
319c6529 2668.tab-throbber {
95f333af 2669 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim-connect.png");
613daf44 2670}
319c6529
RK
2671
2672.tab-throbber[progress] {
95f333af 2673 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
613daf44 2674}
319c6529 2675
319c6529
RK
2676.tab-throbber[pinned],
2677.tab-icon-image[pinned] {
2678 -moz-margin-start: 2px;
2679 -moz-margin-end: 2px;
613daf44 2680}
319c6529
RK
2681
2682/* tabbrowser-tab focus ring */
2683.tabbrowser-tab:focus > .tab-stack {
2684 outline: 1px dotted;
613daf44 2685}
319c6529 2686
8ad8bf83 2687/* Tab DnD indicator */
319c6529
RK
2688.tab-drop-indicator {
2689 list-style-image: url("chrome://browser/skin/tabbrowser/tabDragIndicator.png");
9abeb12c 2690 margin-bottom: -11px;
613daf44 2691}
2692
319c6529
RK
2693/* Tab close button */
2694.tab-close-button {
2695 border: none;
2696 padding: 0px;
57fc408c 2697 margin-top: 1px;
319c6529
RK
2698 list-style-image: url("chrome://global/skin/icons/close-button.gif");
2699}
acb0e9b8 2700
319c6529
RK
2701.tab-close-button:hover,
2702.tab-close-button:hover[selected="true"] {
2703 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
acb0e9b8 2704}
319c6529
RK
2705
2706.tab-close-button:hover:active,
2707.tab-close-button:hover:active[selected="true"] {
2708 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
acb0e9b8 2709}
319c6529 2710
319c6529
RK
2711/* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */
2712
319c6529
RK
2713.tabbrowser-arrowscrollbox > .scrollbutton-up,
2714.tabbrowser-arrowscrollbox > .scrollbutton-down {
319c6529
RK
2715 margin: 0;
2716 padding-top: 0;
2717 padding-bottom: 0;
acb0e9b8 2718}
319c6529 2719
319c6529
RK
2720.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
2721 background-color: #008484;
acb0e9b8 2722}
319c6529
RK
2723
2724.tabs-newtab-button > .toolbarbutton-icon {
2725 margin-top: -1px;
2726 margin-bottom: -1px;
acb0e9b8 2727}
319c6529
RK
2728
2729.tabs-newtab-button,
2730#TabsToolbar > #new-tab-button,
e20c83c3
RK
2731#TabsToolbar > toolbarpaletteitem > #new-tab-button,
2732#TabsToolbar > toolbarpaletteitem > #new-tab-button[cui-areatype="toolbar"] {
38cfeb47 2733 list-style-image: url("chrome://browser/skin/tabbrowser/newtab.png");
319c6529 2734 -moz-image-region: rect(0, 16px, 18px, 0);
acb0e9b8 2735}
2736
43ee1307 2737/* Remove |#navigator-toolbox:not([iconsize])| selector when Australis lands - this makes it only apply post-Australis as iconsize doesn't exist there */
8b5fc82e 2738.tabs-newtab-button,
38cfeb47 2739.tabs-newtab-button:hover,
43ee1307
RK
2740#navigator-toolbox:not([iconsize]) #TabsToolbar > #new-tab-button,
2741#navigator-toolbox:not([iconsize]) #TabsToolbar > #new-tab-button:hover,
38cfeb47 2742#TabsToolbar > #new-tab-button:hover {
319c6529 2743 -moz-image-region: rect(0, 32px, 18px, 16px);
acb0e9b8 2744}
319c6529
RK
2745
2746#alltabs-button {
8da9da4e 2747 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
acb0e9b8 2748}
2749
f9fc08c7 2750#alltabs-button > .toolbarbutton-menu-dropmarker {
319c6529 2751 display: none;
acb0e9b8 2752}
319c6529 2753
f9fc08c7
RK
2754#alltabs-button:hover,
2755#alltabs-button:hover:active,
2756#alltabs-button[open="true"] {
8da9da4e 2757 list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
acb0e9b8 2758}
319c6529
RK
2759
2760/* All tabs menupopup */
2761.alltabs-item > .menu-iconic-left > .menu-iconic-icon {
dce90fef 2762 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
8da9da4e 2763 -moz-image-region: auto;
acb0e9b8 2764}
2765
319c6529
RK
2766.alltabs-item[selected="true"] {
2767 font-weight: bold;
acb0e9b8 2768}
319c6529
RK
2769
2770.alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon {
2771 list-style-image: url("chrome://global/skin/icons/loading.gif");
acb0e9b8 2772}
319c6529 2773
85cfb236 2774.alltabs-item[tabIsVisible]:not([_moz-menuactive="true"]) {
b1234db8
RK
2775 background-color: #402800;
2776}
2777
319c6529
RK
2778/* Tabstrip close button */
2779.tabs-closebutton {
2780 -moz-box-flex: 1;
2781 margin: 0px;
2782 padding: 2px;
2783 list-style-image: url("chrome://global/skin/icons/close-button.gif");
acb0e9b8 2784}
2785
b36fc72e
RK
2786.tabs-closebutton > .toolbarbutton-icon {
2787}
2788
8da9da4e
RK
2789.tabs-closebutton > .toolbarbutton-text {
2790 display: none;
2791}
2792
319c6529
RK
2793.tabs-closebutton:hover,
2794.tabs-closebutton:hover:active {
2795 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
acb0e9b8 2796}
319c6529
RK
2797
2798toolbarbutton.chevron {
2799 list-style-image: url("chrome://global/skin/toolbar/chevron.gif") !important;
acb0e9b8 2800}
319c6529
RK
2801
2802toolbarbutton.chevron:hover {
2803 list-style-image: url("chrome://global/skin/toolbar/chevron-hover.gif") !important;
acb0e9b8 2804}
2805
319c6529
RK
2806toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon,
2807toolbarbutton.chevron:-moz-locale-dir(rtl):hover > .toolbarbutton-icon {
71a617ff 2808 transform: scaleX(-1);
acb0e9b8 2809}
319c6529
RK
2810
2811toolbarbutton.chevron > .toolbarbutton-text,
2812toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
2813 display: none;
acb0e9b8 2814}
319c6529
RK
2815
2816toolbarbutton.chevron > .toolbarbutton-icon {
2817 margin: 0;
acb0e9b8 2818}
2819
319c6529
RK
2820toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
2821 display: -moz-box; /* display chevron icon in text mode */
acb0e9b8 2822}
319c6529
RK
2823
2824#sidebar-throbber[loading="true"] {
2825 list-style-image: url("chrome://global/skin/icons/loading.gif");
2826 -moz-margin-end: 4px;
acb0e9b8 2827}
319c6529
RK
2828
2829/* Bookmarks toolbar */
2830#PlacesToolbarDropIndicator {
8da9da4e 2831 list-style-image: url("chrome://communicator/skin/bookmarks/toolbarDropMarker.png");
acb0e9b8 2832}
2833
319c6529
RK
2834toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2835 background-color: #008484 !important;
2836 color: #FFCF00 !important;
613daf44 2837}
319c6529
RK
2838
2839/* rules for menupopup drop indicators */
2840.menupopup-drop-indicator-bar {
2841 position: relative;
2842 /* these two margins must together compensate the indicator's height */
2843 margin-top: -1px;
2844 margin-bottom: -1px;
613daf44 2845}
319c6529
RK
2846
2847.menupopup-drop-indicator {
2848 list-style-image: none;
2849 height: 2px;
2850 -moz-margin-end: -4em;
2851 background-color: #008484;
613daf44 2852}
2853
319c6529
RK
2854/* ::::: Identity Indicator Styling ::::: */
2855
2856/* Popup Icons */
2857#identity-popup-icon {
2858 height: 64px;
2859 width: 64px;
2860 padding: 0;
2861 list-style-image: url("chrome://browser/skin/identity.png");
2862 -moz-image-region: rect(0px, 64px, 64px, 0px);
613daf44 2863}
319c6529
RK
2864
2865#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
2866 -moz-image-region: rect(64px, 64px, 128px, 0px);
613daf44 2867}
319c6529
RK
2868
2869#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
2870 -moz-image-region: rect(128px, 64px, 192px, 0px);
613daf44 2871}
2872
319c6529
RK
2873/* Popup Body Text */
2874.identity-popup-description {
2875 white-space: pre-wrap;
2876 -moz-padding-start: 15px;
2877 margin: 2px 0 4px;
613daf44 2878}
319c6529
RK
2879
2880.identity-popup-label {
2881 white-space: pre-wrap;
2882 -moz-padding-start: 15px;
2883 margin: 0;
613daf44 2884}
319c6529 2885
5517da5a 2886#identity-popup-content-host,
319c6529
RK
2887#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner {
2888 font-size: 1.2em;
613daf44 2889}
2890
319c6529
RK
2891#identity-popup-content-host {
2892 margin-top: 3px;
2893 margin-bottom: 5px;
2894 font-weight: bold;
2895 max-width: 300px;
2896}
613daf44 2897
319c6529
RK
2898#identity-popup-content-owner {
2899 margin-top: 4px;
2900 margin-bottom: 0 !important;
2901 font-weight: bold;
2902 max-width: 300px;
2903}
613daf44 2904
319c6529
RK
2905.verifiedDomain > #identity-popup-content-owner {
2906 font-weight: normal;
613daf44 2907}
2908
319c6529
RK
2909#identity-popup-content-verifier {
2910 margin: 4px 0 2px;
613daf44 2911}
2912
319c6529
RK
2913#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
2914#identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
2915 margin-top: 10px;
2916 -moz-margin-start: -24px;
613daf44 2917}
2918
319c6529
RK
2919#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
2920#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
2921 list-style-image: url("chrome://browser/skin/Secure24.png");
613daf44 2922}
2923
3a0880a9
RK
2924#identity-popup-help-icon {
2925 border: none;
2926 margin: 7px 0 0 -3px;
2927 background: none;
2928 min-width: 0;
2929 list-style-image: url("chrome://global/skin/icons/question-16.png");
2930 cursor: pointer;
2931}
2932
2933#identity-popup-help-icon > .button-box > .button-text {
2934 display: none;
2935}
2936
2937#identity-popup-help-icon > .button-box > .button-icon {
2938 height: 16px;
2939 width: 16px;
2940}
2941
319c6529
RK
2942#identity-popup-more-info-button {
2943 margin-top: 6px;
2944 margin-bottom: 0;
2945 -moz-margin-end: 0;
613daf44 2946}
acb0e9b8 2947
fe524e0c
RK
2948#identity-popup > .panel-arrowcontainer > .panel-arrowcontent {
2949 padding: 0;
2950}
2951
2952#identity-popup-container {
2953 min-width: 280px;
2954 padding: 10px;
2955}
2956
2957#identity-popup-button-container {
2958/* background: linear-gradient(to bottom, rgba(0,0,0,0.04) 60%, transparent);*/
2959 padding: 10px;
2960 margin-top: 5px;
2961}
2962
319c6529
RK
2963.popup-notification-icon {
2964 width: 64px;
2965 height: 64px;
2966 -moz-margin-end: 10px;
2967}
acb0e9b8 2968
319c6529
RK
2969.popup-notification-icon[popupid="geolocation"] {
2970 list-style-image: url("chrome://browser/skin/Geolocation-64.png");
acb0e9b8 2971}
2972
319c6529
RK
2973.popup-notification-icon[popupid="xpinstall-disabled"],
2974.popup-notification-icon[popupid="addon-progress"],
2975.popup-notification-icon[popupid="addon-install-cancelled"],
2976.popup-notification-icon[popupid="addon-install-blocked"],
2977.popup-notification-icon[popupid="addon-install-failed"],
a40f6a79 2978.popup-notification-icon[popupid="addon-install-complete"] {
319c6529
RK
2979 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
2980 width: 32px;
2981 height: 32px;
acb0e9b8 2982}
319c6529 2983
a40f6a79 2984.popup-notification-icon[popupid="click-to-play-plugins"] {
fcfb76ce 2985 list-style-image: url("chrome://mozapps/skin/plugins/pluginBlocked-64.png");
a40f6a79
RK
2986}
2987
a6757852
RK
2988.popup-notification-icon[popupid="plugins-not-found"] {
2989 list-style-image: url("chrome://browser/skin/pluginInstall-64.png");
2990}
2991
82b4252f
RK
2992.popup-notification-icon[popupid="web-notifications"] {
2993 list-style-image: url("chrome://browser/skin/notification-64.png");
2994}
2995
319c6529
RK
2996.addon-progress-description {
2997 width: 350px;
2998 max-width: 350px;
acb0e9b8 2999}
319c6529
RK
3000
3001.popup-progress-label,
3002.popup-progress-meter {
3003 -moz-margin-start: 0;
3004 -moz-margin-end: 0;
acb0e9b8 3005}
319c6529
RK
3006
3007.popup-progress-cancel {
3008 -moz-appearance: none;
3009 background: transparent;
3010 border: none;
3011 padding: 0;
3012 margin: 0;
3013 min-height: 0;
3014 min-width: 0;
3015 list-style-image: url("chrome://mozapps/skin/downloads/downloadButtons.png");
3016 -moz-image-region: rect(0px, 32px, 16px, 16px);
acb0e9b8 3017}
319c6529
RK
3018
3019.popup-progress-cancel:hover {
3020 -moz-image-region: rect(16px, 32px, 32px, 16px);
acb0e9b8 3021}
3022
319c6529
RK
3023.popup-progress-cancel:active {
3024 -moz-image-region: rect(32px, 32px, 48px, 16px);
3025}
acb0e9b8 3026
319c6529 3027.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
a6757852 3028.popup-notification-icon[popupid="indexedDB-quota-prompt"],
e2734cc7
RK
3029.popup-notification-icon[popupid*="offline-app-requested"],
3030.popup-notification-icon[popupid="offline-app-usage"] {
319c6529 3031 list-style-image: url("chrome://global/skin/icons/alert-question.gif");
acb0e9b8 3032}
3033
319c6529
RK
3034.popup-notification-icon[popupid="password-save"],
3035.popup-notification-icon[popupid="password-change"] {
3036 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-64.png");
acb0e9b8 3037}
3038
1b13529a 3039.popup-notification-icon[popupid="webapps-install-progress"],
8d7ef0d9 3040.popup-notification-icon[popupid="webapps-install"] {
87a1144f 3041 list-style-image: url("chrome://global/skin/icons/webapps-64.png");
8d7ef0d9
RK
3042}
3043
56ab361a
RK
3044.popup-notification-icon[popupid="mixed-content-blocked"] {
3045 list-style-image: url("chrome://browser/skin/mixed-content-blocked-64.png");
3046}
3047
0142a07b 3048.popup-notification-icon[popupid="webRTC-sharingDevices"],
7bc075b6
RK
3049.popup-notification-icon[popupid="webRTC-shareDevices"] {
3050 list-style-image: url("chrome://browser/skin/webRTC-shareDevice-64.png");
3051}
3052
82b4252f
RK
3053.popup-notification-icon[popupid="pointerLock"] {
3054 list-style-image: url("chrome://browser/skin/pointerLock-64.png");
3055}
3056
319c6529
RK
3057/* Notification icon box */
3058#notification-popup-box {
f993773d
RK
3059 position: relative;
3060 background-color: #000000;
3061 background-clip: padding-box;
3062 padding-left: 3px;
5517da5a 3063 padding-right: 8px;
f0eab82c 3064 border-radius: 3px 0 0 3px;
82b4252f 3065 border-image: url("chrome://browser/skin/urlbar-arrow.png") 0 8 0 0 / 0 8px 0 0;
f993773d 3066 -moz-margin-end: -8px;
5517da5a 3067 border-right-width: 8px;
f993773d
RK
3068}
3069
8ad8bf83
RK
3070window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] >
3071 :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) >
e8519ae0 3072 #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box {
5517da5a 3073/* padding-left: 5px; */
f993773d
RK
3074}
3075
3076#notification-popup-box:-moz-locale-dir(rtl),
3077.notification-anchor-icon:-moz-locale-dir(rtl) {
71a617ff 3078 transform: scaleX(-1);
319c6529 3079}
acb0e9b8 3080
319c6529 3081.notification-anchor-icon {
acb0e9b8 3082 width: 16px;
3083 height: 16px;
85cfb236 3084 margin: 0 2px;
acb0e9b8 3085}
3086
319c6529 3087.notification-anchor-icon:-moz-focusring {
f0eab82c
RK
3088 outline: 1px dotted #008484;
3089/* outline-offset: -3px; */
acb0e9b8 3090}
3091
e2734cc7 3092.default-notification-icon,
ab799a7a
RK
3093#default-notification-icon {
3094 list-style-image: url("chrome://global/skin/icons/information-16.png");
3095}
3096
e2734cc7 3097.identity-notification-icon,
9585a561
RK
3098#identity-notification-icon {
3099 list-style-image: url("chrome://mozapps/skin/profile/profileicon.png");
3100}
3101
e2734cc7 3102.geo-notification-icon,
319c6529
RK
3103#geo-notification-icon {
3104 list-style-image: url("chrome://browser/skin/Geolocation-16.png");
acb0e9b8 3105}
3106
319c6529
RK
3107#addons-notification-icon {
3108 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
acb0e9b8 3109}
3110
e2734cc7 3111.indexedDB-notification-icon,
319c6529
RK
3112#indexedDB-notification-icon {
3113 list-style-image: url("chrome://global/skin/icons/question-16.png");
acb0e9b8 3114}
3115
319c6529
RK
3116#password-notification-icon {
3117 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-16.png");
acb0e9b8 3118}
3119
8d7ef0d9 3120#webapps-notification-icon {
87a1144f 3121 list-style-image: url("chrome://gobal/skin/icons/webapps-16.png");
8d7ef0d9
RK
3122}
3123
a40f6a79 3124#plugins-notification-icon {
b27cc46e
RK
3125 list-style-image: url("chrome://browser/skin/notification-pluginNormal.png");
3126}
3127
f76c6aee 3128#plugins-notification-icon.plugin-hidden {
b27cc46e 3129 list-style-image: url("chrome://browser/skin/notification-pluginAlert.png");
a40f6a79
RK
3130}
3131
f76c6aee 3132#plugins-notification-icon.plugin-blocked {
b27cc46e 3133 list-style-image: url("chrome://browser/skin/notification-pluginBlocked.png");
990cba4b
RK
3134}
3135
f76c6aee 3136#plugins-notification-icon {
fe524e0c
RK
3137/* -moz-image-region: rect(0, 16px, 16px, 0);*/
3138}
3139
f76c6aee 3140#plugins-notification-icon:hover {
fe524e0c
RK
3141/* -moz-image-region: rect(0, 32px, 16px, 16px);*/
3142}
3143
a6757852
RK
3144#plugin-install-notification-icon {
3145 list-style-image: url("chrome://browser/skin/pluginInstall-16.png");
3146}
3147
6adbc9a6
RK
3148#notification-popup-box[hidden] {
3149 /* Override display:none to make the pluginBlockedNotification animation work
3150 when showing the notification repeatedly. */
3151 display: -moz-box;
3152 visibility: collapse;
3153}
3154
f76c6aee 3155#plugins-notification-icon.plugin-blocked[showing] {
990cba4b
RK
3156 animation: pluginBlockedNotification 500ms ease 0s 5 alternate both;
3157}
3158
3159@keyframes pluginBlockedNotification {
3160 from {
3161 opacity: 0;
3162 }
3163 to {
3164 opacity: 1;
3165 }
3166}
3167
e2734cc7 3168.mixed-content-blocked-notification-icon,
56ab361a
RK
3169#mixed-content-blocked-notification-icon {
3170 list-style-image: url("chrome://browser/skin/mixed-content-blocked-16.png");
3171}
3172
e2734cc7 3173.webRTC-shareDevices-notification-icon,
0142a07b 3174#webRTC-shareDevices-notification-icon {
7bc075b6
RK
3175 list-style-image: url("chrome://browser/skin/webRTC-shareDevice-16.png");
3176}
3177
e2734cc7 3178.webRTC-sharingDevices-notification-icon,
6adbc9a6
RK
3179#webRTC-sharingDevices-notification-icon {
3180 list-style-image: url("chrome://browser/skin/webRTC-sharingDevice-16.png");
3181}
3182
e2734cc7 3183.web-notifications-notification-icon,
82b4252f
RK
3184#web-notifications-notification-icon {
3185 list-style-image: url("chrome://browser/skin/notification-16.png");
3186}
3187
3188#pointerLock-notification-icon {
3189 list-style-image: url("chrome://browser/skin/pointerLock-16.png");
3190}
3191#pointerLock-cancel {
3192 margin: 0px;
3193}
3194
319c6529 3195#download-monitor {
a736ce46 3196 list-style-image: url("chrome://browser/skin/FxToolbar.png");
319c6529 3197 -moz-image-region: rect(0, 108px, 18px, 90px);
acb0e9b8 3198}
3199
319c6529
RK
3200/* Bookmarks roots menu-items */
3201#appmenu_subscribeToPage:not([disabled]),
3202#appmenu_subscribeToPageMenu,
3203#subscribeToPageMenuitem:not([disabled]),
3204#subscribeToPageMenupopup,
3205#BMB_subscribeToPageMenuitem:not([disabled]),
3206#BMB_subscribeToPageMenupopup {
3207 list-style-image: url("chrome://browser/skin/feeds/feedIcon16.png");
613daf44 3208}
3209
319c6529
RK
3210#bookmarksToolbarFolderMenu,
3211#appmenu_bookmarksToolbar,
3212#BMB_bookmarksToolbar {
8da9da4e 3213 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png");
319c6529
RK
3214 -moz-image-region: auto;
3215}
acb0e9b8 3216
319c6529
RK
3217#appmenu_unsortedBookmarks,
3218#BMB_unsortedBookmarks {
8da9da4e 3219 list-style-image: url("chrome://communicator/skin/bookmarks/unsortedBookmarks.png");
319c6529 3220 -moz-image-region: auto;
acb0e9b8 3221}
3222
319c6529 3223/* ::::: Keyboard UI Panel ::::: */
acb0e9b8 3224
319c6529
RK
3225.KUI-panel {
3226 color: #FF9F00;
3227 border-style: none;
3228 border-radius: 20px;
acb0e9b8 3229}
3230
319c6529
RK
3231.KUI-panel[level="top"] {
3232 /*background-color: rgba(27%,27%,27%,.65);*/
acb0e9b8 3233}
3234
319c6529
RK
3235/* Ctrl-Tab */
3236
3237#ctrlTab-panel {
3238 padding: 20px 10px 10px;
3239 font-weight: bold;
acb0e9b8 3240}
3241
319c6529
RK
3242.ctrlTab-favicon[src] {
3243 background-color: #000000;
3244 width: 20px;
3245 height: 20px;
3246 padding: 2px;
3247}
acb0e9b8 3248
319c6529 3249.ctrlTab-preview-inner > .tabPreview-canvas {
acb0e9b8 3250}
3251
319c6529
RK
3252.ctrlTab-preview:not(#ctrlTab-showAll) > * > .ctrlTab-preview-inner > .tabPreview-canvas {
3253 margin-bottom: 2px;
acb0e9b8 3254}
3255
319c6529
RK
3256.ctrlTab-preview-inner {
3257 padding-bottom: 10px;
acb0e9b8 3258}
3259
319c6529
RK
3260#ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
3261 padding: 10px;
3262 background-color: #000000;
3263 border-radius: .5em;
acb0e9b8 3264}
3265
319c6529
RK
3266.ctrlTab-preview:focus > * > .ctrlTab-preview-inner {
3267 color: white;
3268 background-color: #000000;
3269 text-shadow: none;
3270 padding: 8px;
3271 border: 2px solid #9C9CFF;
3272 border-radius: .5em;
acb0e9b8 3273}
3274
319c6529
RK
3275.ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
3276 margin: -10px -10px 0;
acb0e9b8 3277}
3278
319c6529
RK
3279#ctrlTab-showAll {
3280 margin-top: .5em;
acb0e9b8 3281}
3282
b36fc72e
RK
3283/* Add-on bar */
3284
3285#addon-bar {
3286 min-height: 20px;
3287 border-top: 3px solid #000000;
3e6e0e5c 3288 border-bottom-width: 0;
b36fc72e
RK
3289}
3290
3291#addon-bar .toolbar-holder {
3292 background-color: #8050B0;
3293 color: #FFCF00;
3294}
3295
3296#addon-bar .toolbar-holder {
3297 background-color: #8050B0;
3298 color: #FFCF00;
3299}
3300
3301#addon-bar .toolbar-startcap,
3302#addon-bar .toolbar-endcap{
3303 background-color: #6000CF;
3304}
3305
319c6529 3306#status-bar {
b36fc72e 3307 -moz-binding: url("chrome://global/content/bindings/general.xml#statusbar");
319c6529
RK
3308 margin-top: .3em;
3309 border-width: 0;
613daf44 3310}
3311
e0c47e26
RK
3312#addon-bar[customizing] > #status-bar {
3313 opacity: .5;
3314/* background-image: -moz-repeating-linear-gradient(-45deg,
3315 rgba(255,255,255,.3), rgba(255,255,255,.3) 5px,
3316 rgba(0,0,0,.3) 5px, rgba(0,0,0,.3) 10px);*/
3317}
3318
319c6529
RK
3319/* Remove all borders from statusbarpanel children of
3320 the statusbar.
3321#status-bar > statusbarpanel {
3322 border-width: 0;
3323} */
3324
319c6529
RK
3325#addonbar-closebutton {
3326 border: none;
3327 padding: 3px 5px;
3328 list-style-image: url("chrome://global/skin/icons/close-button.gif");
613daf44 3329}
3330
319c6529
RK
3331#addonbar-closebutton:hover,
3332#addonbar-closebutton:hover:active {
3333 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
613daf44 3334}
9abeb12c
RK
3335
3336/* Status panel */
3337
3338.statuspanel-label {
3339 margin: 0;
3340 padding: 2px 4px;
38cfeb47 3341 background: #404000;
9abeb12c
RK
3342 border: 1px none #9C9CFF;
3343 border-top-style: solid;
3344 color: #FF9F00;
3345 text-shadow: none;
3346}
3347
3348.statuspanel-label:-moz-locale-dir(ltr):not([mirror]),
3349.statuspanel-label:-moz-locale-dir(rtl)[mirror] {
3350 border-right-style: solid;
3351 border-top-right-radius: .3em;
3352 margin-right: 1em;
3353}
3354
3355.statuspanel-label:-moz-locale-dir(rtl):not([mirror]),
3356.statuspanel-label:-moz-locale-dir(ltr)[mirror] {
3357 border-left-style: solid;
3358 border-top-left-radius: .3em;
3359 margin-left: 1em;
3360}
3e6e0e5c
RK
3361
3362/* HACK to abolish devily color on main content */
3363
3364#content {
3365 background-color: transparent !important;
3366}
dce90fef 3367
7600e0b1
RK
3368/* === BEGIN highlighter.inc.css === */
3369
dce90fef
RK
3370/* Highlighter */
3371
0142a07b 3372.highlighter-outline {
fcfb76ce 3373 box-shadow: 0 0 0 1px black;
1bf116f8 3374 outline: 1px dashed #A09090;
dce90fef
RK
3375}
3376
0142a07b 3377.highlighter-outline[locked] {
fcfb76ce
RK
3378 box-shadow: 0 0 0 1px rgba(0,0,0,0.3);
3379 outline-color: rgba(255,255,255,0.7);
dce90fef 3380}
4c765db1 3381
8ad8bf83
RK
3382/* Highlighter - Node Infobar */
3383
0142a07b 3384.highlighter-nodeinfobar {
a40f6a79 3385 color: #FF9F00;
a40f6a79
RK
3386 border-radius: 3px;
3387 background-color: #000000;
3388 background-clip: padding-box;
1bf116f8
RK
3389 border: 1px solid #008484;
3390 padding: 5px;
3391 /* Avoid cases where the infobar is smaller than the arrow, when the text is
3392 short */
3393 min-width: 75px;
a40f6a79
RK
3394}
3395
8ad8bf83
RK
3396/* Highlighter - Node Infobar - text */
3397
0142a07b 3398.highlighter-nodeinfobar-text {
a40f6a79 3399 /* 100% - size of the buttons and margins */
c29b709d 3400 max-width: calc(100% - 2 * (26px + 6px));
a40f6a79
RK
3401 padding-bottom: 1px;
3402}
3403
0142a07b 3404html|*.highlighter-nodeinfobar-tagname {
8ad8bf83
RK
3405 color: #FFCF00;
3406}
3407
0142a07b 3408html|*.highlighter-nodeinfobar-id {
8ad8bf83
RK
3409 color: #9C9CFF;
3410}
3411
0142a07b 3412html|*.highlighter-nodeinfobar-pseudo-classes {
eec397be 3413 color: #FF9F00;
8ad8bf83
RK
3414}
3415
a40f6a79
RK
3416/* Highlighter - Node Infobar - buttons */
3417
3418.highlighter-nodeinfobar-button {
3419 padding: 0;
3420 width: 26px;
3421 min-height: 26px;
3422}
3423
0142a07b 3424.highlighter-nodeinfobar-inspectbutton {
a40f6a79
RK
3425 list-style-image: url("chrome://browser/skin/devtools/inspect-button.png");
3426 -moz-image-region: rect(0px 16px 16px 0px);
3427 -moz-margin-start: 0px;
3428 -moz-margin-end: 2px;
3429}
3430
0142a07b
RK
3431.highlighter-nodeinfobar-inspectbutton:hover,
3432.highlighter-nodeinfobar-inspectbutton:hover:active/*,
3433.highlighter-nodeinfobar-container:not([locked]) > .highlighter-nodeinfobar > .highlighter-nodeinfobar-inspectbutton*/ {
a40f6a79
RK
3434 -moz-image-region: rect(0px 32px 16px 16px);
3435}
3436
0142a07b 3437.highlighter-nodeinfobar-menu {
a40f6a79
RK
3438}
3439
0142a07b 3440.highlighter-nodeinfobar-menu > .toolbarbutton-menu-dropmarker {
a40f6a79
RK
3441 -moz-box-align: center;
3442 -moz-margin-start: -1px;
3443}
3444
3445/* Highlighter - Node Infobar - box & arrow */
3446
8ad8bf83
RK
3447.highlighter-nodeinfobar-arrow {
3448 width: 14px;
3449 height: 14px;
c29b709d 3450 -moz-margin-start: calc(50% - 7px);
71a617ff 3451 transform: rotate(-45deg);
8ad8bf83
RK
3452 background-clip: padding-box;
3453 background-repeat: no-repeat;
3454}
3455
0142a07b 3456.highlighter-nodeinfobar-arrow-top {
8ad8bf83
RK
3457 margin-bottom: -8px;
3458 margin-top: 8px;
fcaeefc2 3459 background-image: linear-gradient(to bottom left, transparent 50%, rgb(0, 132, 132) 50%);
8ad8bf83
RK
3460}
3461
0142a07b 3462.highlighter-nodeinfobar-arrow-bottom {
8ad8bf83
RK
3463 margin-top: -8px;
3464 margin-bottom: 8px;
fcaeefc2 3465 background-image: linear-gradient(to top right, transparent 50%, rgb(0, 132, 132) 50%);
8ad8bf83
RK
3466}
3467
0142a07b 3468.highlighter-nodeinfobar-container[hide-arrow] > .highlighter-nodeinfobar {
8ad8bf83
RK
3469 margin: 7px 0;
3470}
3471
7600e0b1
RK
3472/* === END highlighter.inc.css === */
3473
8ad8bf83
RK
3474#full-screen-warning-message {
3475 background-color: #000000;
3476 color: #FF9F00;
8ad8bf83
RK
3477 border-radius: 8px;
3478 margin-top: 30px;
3479 padding: 30px 50px;
3480 box-shadow: 0 0 2px #9C9CFF;
3481}
3482
3483#full-screen-warning-container[obscure-browser] {
85cfb236
RK
3484 background-color: rgba(0,0,0,0.3);
3485}
3486
3487.full-screen-description {
3488 font-size: 150%;
3489}
3490
3491#full-screen-domain-text {
3492 font-size: 300%;
8ad8bf83
RK
3493}
3494
85cfb236
RK
3495.full-screen-approval-button,
3496#full-screen-remember-decision {
3497 font-size: 120%;
8ad8bf83
RK
3498}
3499
b27cc46e
RK
3500/* === BEGIN commandline.inc.css === */
3501
3502/* Developer toolbar */
3503
3504#developer-toolbar {
3505 border-top: 3px solid #000000;
3506 border-bottom: none;
3507}
3508
3509#developer-toolbar .toolbar-holder {
3510 background-color: #8050B0;
3511 color: #FFCF00;
3512}
3513
3514#developer-toolbar .toolbar-holder {
3515 background-color: #8050B0;
3516 color: #FFCF00;
3517}
3518
3519#developer-toolbar .toolbar-startcap,
3520#developer-toolbar .toolbar-endcap{
3521 background-color: #6000CF;
3522}
3523
3524#developer-toolbar {
3525/* padding: 0;
3526 min-height: 32px; */
3527}
3528
de57e474 3529#developer-toolbar > toolbarbutton {
b27cc46e
RK
3530/* margin: 0;
3531 padding: 0 10px;
3532 width: 32px; */
3533}
3534
3535.developer-toolbar-button > image {
3536/* margin: auto 10px; */
3537}
3538
fe524e0c
RK
3539#developer-toolbar-toolbox-button > label {
3540 display: none;
3541}
3542
b27cc46e
RK
3543#developer-toolbar-toolbox-button {
3544 list-style-image: url("chrome://browser/skin/devtools/toggle-tools.png");
3545 -moz-image-region: rect(0px, 16px, 16px, 0px);
3546}
3547
3548#developer-toolbar-toolbox-button > label {
3549 display: none;
3550}
3551
3552#developer-toolbar-toolbox-button:hover,
3553#developer-toolbar-toolbox-button:hover:active,
3554#developer-toolbar-toolbox-button[checked=true] {
3555 -moz-image-region: rect(0px, 32px, 16px, 16px);
3556}
3557
de57e474
RK
3558#developer-toolbar-closebutton {
3559 list-style-image: url("chrome://browser/skin/devtools/close.png");
3560 -moz-image-region: rect(0px, 16px, 16px, 0px);
3561 min-width: 16px;
3562 width: 16px;
3563}
3564
3565#developer-toolbar-closebutton > .toolbarbutton-icon {
3566}
3567
3568#developer-toolbar-closebutton > .toolbarbutton-text {
3569 display: none;
3570}
3571
3572#developer-toolbar-closebutton:hover,
3573#developer-toolbar-closebutton:hover:active {
3574 -moz-image-region: rect(0px, 32px, 16px, 16px);
3575}
3576
b27cc46e
RK
3577/* GCLI */
3578
37953ab4
RK
3579html|*#gcli-tooltip-frame,
3580html|*#gcli-output-frame {
85cfb236 3581 padding: 0;
37953ab4
RK
3582 border-width: 0;
3583 background-color: transparent;
3584}
3585
3586#gcli-output,
3587#gcli-tooltip {
3588 border-width: 0;
3589 background-color: transparent;
85cfb236
RK
3590}
3591
3592.gclitoolbar-input-node,
b27cc46e 3593.gclitoolbar-complete-node {
37953ab4
RK
3594 margin: 1px 3px;
3595 -moz-box-align: center;
3596 padding-top: 0;
3597 padding-bottom: 0;
b27cc46e 3598 padding-right: 8px;
37953ab4 3599 background-color: transparent;
85cfb236
RK
3600}
3601
3602.gclitoolbar-input-node {
37953ab4 3603 padding-left: 20px;
b27cc46e
RK
3604/* line-height: 32px;
3605 outline-style: none; */
3606 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 16, 16, 0);
de57e474
RK
3607 background-repeat: no-repeat;
3608 background-color: rgba(0, 0, 0, .75);
b27cc46e
RK
3609}
3610
3611.gclitoolbar-input-node[focused="true"] {
3612 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16);
de57e474 3613 background-color: #000000;
37953ab4
RK
3614}
3615
3616.gclitoolbar-input-node:not([focused="true"]) {
3617 border-color: transparent;
85cfb236
RK
3618}
3619
7bc075b6
RK
3620.gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection {
3621 background-color: #008484;
3622 color: #000000;
3623 text-shadow: none;
3624}
3625
85cfb236 3626.gclitoolbar-complete-node {
37953ab4 3627 padding-left: 21px;
85cfb236
RK
3628 background-color: transparent;
3629 color: transparent;
b27cc46e
RK
3630 z-index: 100;
3631 pointer-events: none;
85cfb236
RK
3632}
3633
85cfb236
RK
3634.gcli-in-incomplete,
3635.gcli-in-error,
3636.gcli-in-ontab,
3637.gcli-in-todo,
3638.gcli-in-closebrace,
3639.gcli-in-param,
3640.gcli-in-valid {
3641 margin: 0;
3642 padding: 0;
3643}
3644
3645.gcli-in-incomplete {
3646 border-bottom: 2px dotted #8050B0;
3647}
3648
3649.gcli-in-error {
3650 border-bottom: 2px dotted #FF0000;
3651}
3652
3653.gcli-in-ontab {
3654 color: #9C9CFF;
3655}
3656
3657.gcli-in-todo {
3658 color: #795900;
3659}
3660
3661.gcli-in-closebrace {
3662 color: #8050B0;
3663}
3664
b27cc46e
RK
3665/* === END commandline.inc.css === */
3666
fe524e0c
RK
3667/* === BEGIN responsivedesign.inc.css === */
3668
37953ab4 3669/* Responsive Mode */
85cfb236 3670
7bc075b6
RK
3671.browserContainer[responsivemode] {
3672 background: #221500 url("chrome://browser/skin/devtools/responsive-background.png");
37953ab4
RK
3673 padding: 0 20px 20px 20px;
3674}
3675
7bc075b6 3676.browserStack[responsivemode] {
37953ab4
RK
3677 box-shadow: 0 0 7px #9C9CFF;
3678}
3679
3680.devtools-responsiveui-toolbar {
3681 background: transparent;
d2ce251d
RK
3682 /* text color is textColor from dark theme, since no theme is applied to
3683 * the responsive toolbar.
3684 */
3685 color: #FF9F00;
37953ab4
RK
3686 margin: 10px 0;
3687 padding: 0;
3688 box-shadow: none;
3689 border-bottom-width: 0;
3690}
3691
de57e474
RK
3692.devtools-responsiveui-menulist,
3693.devtools-responsiveui-toolbarbutton {
3694 -moz-box-align: center;
3695 min-width: 32px;
3696/* min-height: 22px;*/
3697/* margin: 0 3px; */
3698}
3699
3700.devtools-responsiveui-toolbarbutton > .toolbarbutton-menubutton-button {
3701 -moz-box-orient: horizontal;
3702}
3703
3704.devtools-responsiveui-menulist:-moz-focusring,
3705.devtools-responsiveui-toolbarbutton:-moz-focusring {
3706/* outline: 1px dotted hsla(210,30%,85%,0.7);
3707 outline-offset: -4px;*/
3708}
3709
3710.devtools-responsiveui-toolbarbutton:not([label]) > .toolbarbutton-text {
3711 display: none;
3712}
3713
3714.devtools-responsiveui-toolbarbutton:not([checked=true]):hover:active {
3715/* border-color: hsla(210,8%,5%,.6);
3716 background: linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
3717 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); */
3718}
3719
3720.devtools-responsiveui-menulist[open=true],
3721.devtools-responsiveui-toolbarbutton[open=true],
3722.devtools-responsiveui-toolbarbutton[checked=true] {
3723/* border-color: hsla(210,8%,5%,.6) !important;
3724 background: linear-gradient(hsla(220,6%,10%,.6), hsla(210,11%,18%,.45) 75%, hsla(210,11%,30%,.4));
3725 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); */
3726}
3727
3728.devtools-responsiveui-toolbarbutton[checked=true] {
3729/* color: hsl(208,100%,60%); */
3730}
3731
3732.devtools-responsiveui-toolbarbutton[checked=true]:hover {
3733/* background-color: transparent !important;*/
3734}
3735
3736.devtools-responsiveui-toolbarbutton[checked=true]:hover:active {
3737/* background-color: hsla(210,8%,5%,.2) !important;*/
3738}
3739
3740.devtools-responsiveui-menulist > .menulist-label-box {
3741 text-align: center;
3742}
3743
3744.devtools-responsiveui-menulist > .menulist-dropmarker {
3745/* display: -moz-box;
3746 background-color: transparent;
3747 list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
3748 -moz-box-align: center;
3749 border-width: 0;
3750 min-width: 16px;*/
3751}
3752
3753.devtools-responsiveui-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-button {
3754/* color: inherit;
3755 border-width: 0;
3756 -moz-border-end: 1px solid hsla(210,8%,5%,.45);
3757 box-shadow: -1px 0 0 hsla(210,16%,76%,.15) inset, 1px 0 0 hsla(210,16%,76%,.15);*/
3758}
3759
3760.devtools-responsiveui-toolbarbutton[type=menu-button]:-moz-locale-dir(rtl) > .toolbarbutton-menubutton-button {
3761/* box-shadow: 1px 0 0 hsla(210,16%,76%,.15) inset, -1px 0 0 hsla(210,16%,76%,.15);*/
3762}
3763
3764.devtools-responsiveui-toolbarbutton[type=menu-button] {
3765/* padding: 0 1px;*/
3766 -moz-box-align: stretch;
3767}
3768
3769.devtools-responsiveui-toolbarbutton[type=menu] > .toolbarbutton-menu-dropmarker,
3770.devtools-responsiveui-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-dropmarker {
3771/* list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
3772 -moz-box-align: center;
3773 padding: 0 3px;*/
37953ab4
RK
3774}
3775
3776.devtools-responsiveui-toolbar:-moz-locale-dir(ltr) > *:first-child,
3777.devtools-responsiveui-toolbar:-moz-locale-dir(rtl) > *:last-child {
fe524e0c
RK
3778 margin-left: 3px;
3779}
3780
3781.devtools-responsiveui-close {
3782 list-style-image: url("chrome://browser/skin/devtools/close.png");
3783 -moz-image-region: rect(0px,16px,16px,0px);
3784}
3785
3786.devtools-responsiveui-close:hover {
3787 -moz-image-region: rect(0px,32px,16px,16px);
3788}
3789
3790.devtools-responsiveui-rotate {
3791 list-style-image: url("chrome://browser/skin/devtools/responsiveui-rotate.png");
3792 -moz-image-region: rect(0px,16px,16px,0px);
3793}
3794
3795.devtools-responsiveui-rotate:hover {
3796 -moz-image-region: rect(0px,32px,16px,16px);
3797}
3798
3799.devtools-responsiveui-touch {
3800 list-style-image: url("chrome://browser/skin/devtools/responsiveui-touch.png");
3801 -moz-image-region: rect(0px,16px,16px,0px);
3802}
3803
3804.devtools-responsiveui-touch:hover,
3805.devtools-responsiveui-touch[checked],
3806.devtools-responsiveui-touch[checked]:hover {
3807 -moz-image-region: rect(0px,32px,16px,16px);
3808}
3809
3810.devtools-responsiveui-screenshot {
3811 list-style-image: url("chrome://browser/skin/devtools/responsiveui-screenshot.png");
3812 -moz-image-region: rect(0px,16px,16px,0px);
3813}
3814
3815.devtools-responsiveui-screenshot:hover {
3816 -moz-image-region: rect(0px,32px,16px,16px);
37953ab4
RK
3817}
3818
fe524e0c 3819.devtools-responsiveui-resizebarV {
37953ab4
RK
3820 width: 7px;
3821 height: 24px;
3822 cursor: ew-resize;
71a617ff 3823 transform: translate(12px, -12px);
37953ab4
RK
3824 background-image: url("chrome://browser/skin/devtools/responsive-vertical-resizer.png");
3825}
3826
fe524e0c
RK
3827.devtools-responsiveui-resizebarH {
3828 width: 24px;
3829 height: 7px;
3830 cursor: ns-resize;
3831 transform: translate(-12px, 12px);
3832 background-image: url("chrome://browser/skin/devtools/responsive-horizontal-resizer.png");
3833}
3834
37953ab4
RK
3835.devtools-responsiveui-resizehandle {
3836 width: 16px;
3837 height: 16px;
3838 cursor: se-resize;
71a617ff 3839 transform: translate(12px, 12px);
37953ab4 3840 background-image: url("chrome://browser/skin/devtools/responsive-se-resizer.png");
8d7ef0d9 3841}
889649fd 3842
fe524e0c 3843/* === END responsivedesign.inc.css === */
fcaeefc2
RK
3844
3845/* === including indicator.css is done at the start of the file === */
fe524e0c 3846
889649fd
RK
3847/* Error counter */
3848
0142a07b 3849#developer-toolbar-toolbox-button[error-count]:before {
889649fd
RK
3850 color: #000000;
3851 min-width: 16px;
3852 text-shadow: none;
3853 background-color: #FF0000;
3854 border-radius: 1px;
c29b709d 3855 -moz-margin-end: 5px;
c54ac991 3856}
e9c73590 3857
348c0499 3858/* Social toolbar item */
e9c73590 3859
0142a07b
RK
3860#social-provider-button {
3861 -moz-image-region: rect(0, 16px, 16px, 0);
a6757852 3862 list-style-image: url("chrome://browser/skin/social/services-16.png");
0142a07b
RK
3863}
3864
348c0499
RK
3865#social-provider-button > .toolbarbutton-menu-dropmarker {
3866 display: none;
e9c73590
RK
3867}
3868
82b4252f
RK
3869.toolbarbutton-badge-container {
3870 margin: 0;
3871 padding: 0;
3872 position: relative;
e9c73590
RK
3873}
3874
82b4252f 3875#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar .toolbarbutton-1 > .toolbarbutton-badge-container {
ed1a91c6 3876 padding: 2px 2px;
82b4252f
RK
3877}
3878
3879.toolbarbutton-1 > .toolbarbutton-badge-container > .toolbar-icon {
3880 position: absolute;
3881 top: 2px;
3882 right: 2px;
3883}
3884
3885.toolbarbutton-badge-container > .toolbarbutton-icon[label]:not([label=""]) {
3886 -moz-margin-end: 0;
e9c73590
RK
3887}
3888
82b4252f
RK
3889.toolbarbutton-badge[badge=""] {
3890 display: none;
3891}
3892.toolbarbutton-badge[badge]:not([badge=""])::after {
6adbc9a6 3893 /* The |content| property is set in the content stylesheet. */
348c0499
RK
3894 font-size: 9px;
3895 font-weight: bold;
3896 padding: 0 1px;
3897 color: #FF9F00;
3898 background-color: #000000;
3899 border: 1px solid #9C9CFF;
3900 border-radius: 2px;
6adbc9a6 3901 position: absolute;
82b4252f
RK
3902 top: 0;
3903 right: 0;
3904}
3905
3906#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar *|* > .toolbarbutton-badge[badge]:not([badge=""])::after {
3907 top: 1px;
3908 right: 1px;
e9c73590
RK
3909}
3910
82b4252f
RK
3911.toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
3912 left: 0;
3913 right: auto;
e9c73590
RK
3914}
3915
82b4252f
RK
3916#navigator-toolbox[iconsize=large][mode=icons] > #nav-bar *|* > .toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
3917 left: 1px;
6adbc9a6 3918 right: auto;
348c0499
RK
3919}
3920
3921#social-notification-icon-mentions {
e9c73590 3922 background-color: #000000;
348c0499
RK
3923 border-radius: 3px;
3924 -moz-margin-start: 2px;
e9c73590
RK
3925}
3926
348c0499
RK
3927#social-notification-icon-mentions:hover {
3928 background-color: #FFCF00;
3929}
3930
3931#social-notification-icon-mentions[open="true"] {
3932 background-color: #FF9F00;
e9c73590
RK
3933}
3934
3935#social-sidebar-splitter {
3936 border: 0;
3937}
3938
ed1a91c6
RK
3939.popup-notification-icon[popupid="servicesInstall"] {
3940 list-style-image: url("chrome://browser/skin/social/services-64.png");
3941}
3942#servicesInstall-notification-icon {
3943 list-style-image: url("chrome://browser/skin/social/services-16.png");
3944}
3945#social-undoactivation-button,
3946#servicesInstall-learnmore-link {
3947 -moz-margin-start: 0; /* override default label margin to match description margin */
3948}
3949
3950#socialActivatedNotification .popup-notification-button-container {
3951 margin-left: 6px;
3952}
3953
3954.social-activation-icon {
3955 width: auto;
3956 height: auto;
3957 max-height: 64px;
3958 max-width: 64px;
3959}
3960
3961#social-activation-message {
3962 max-width: 250px;
3963}
3964
3965#social-activation-message > label {
3966 margin: 0;
3967}
3968
e9c73590 3969/* social toolbar provider menu */
990cba4b 3970.social-statusarea-popup {
e9c73590
RK
3971 margin-top: 0;
3972 margin-left: -12px;
3973 margin-right: -12px;
3974}
3975
990cba4b 3976.social-statusarea-user {
e9c73590
RK
3977 border-bottom: 1px solid #9C9CFF;
3978 background-color: #000000;
3979 color: #FF9F00;
3980 position: relative;
348c0499 3981 cursor: pointer;
e9c73590
RK
3982}
3983
990cba4b 3984.social-statusarea-user-portrait {
e9c73590
RK
3985 width: 32px;
3986 height: 32px;
3987 border-radius: 2px;
3988 margin: 10px;
e9c73590
RK
3989}
3990
990cba4b 3991.social-statusarea-loggedInStatus {
e9c73590
RK
3992 background: transparent;
3993 border: none;
b8384c33 3994 color: #3333FF;
e9c73590
RK
3995 min-width: 0;
3996 margin: 0 6px;
348c0499 3997 list-style-image: none;
e9c73590 3998}
90a244b7 3999
990cba4b 4000#social-statusarea-user[_moz-menuactive] > vbox > .social-statusarea-loggedInStatus {
e9c73590
RK
4001 text-decoration: underline;
4002}
4003
348c0499
RK
4004.social-panel > .panel-arrowcontainer > .panel-arrowcontent {
4005 padding: 0;
4006}
4007
348c0499
RK
4008.social-panel-frame {
4009 border-radius: inherit;
4010}
e9c73590 4011
e7c8bab1
RK
4012/* === BEGIN chat.inc.css === */
4013
e9c73590
RK
4014.chat-status-icon {
4015 max-height: 16px;
4016 max-width: 16px;
4017 padding: 0;
4018}
4019
4020.chat-toolbarbutton {
4021 -moz-appearance: none;
4022 border: none;
4023 padding: 0;
4024 margin: 0;
4025 background: none;
b27cc46e 4026 width: 16px;
e9c73590
RK
4027}
4028
4029.chat-toolbarbutton > .toolbarbutton-text {
4030 display: none;
4031}
4032
b27cc46e
RK
4033.chat-toolbarbutton > .toolbarbutton-icon {
4034 width: inherit;
4035}
4036
e7c8bab1
RK
4037.chat-toolbarbutton.notification-anchor-icon > .toolbarbutton-icon {
4038 width: inherit;
4039 margin-top: -2px;
4040}
4041
e9c73590 4042.chat-close-button {
e2734cc7 4043 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 4044 -moz-image-region: rect(0, 16px, 16px, 0);
e9c73590
RK
4045}
4046
4047.chat-close-button:hover,
4048.chat-close-button:hover:active {
b27cc46e 4049 -moz-image-region: rect(0, 32px, 16px, 16px);
e9c73590
RK
4050}
4051
e2734cc7
RK
4052.chat-minimize-button {
4053 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 4054 -moz-image-region: rect(16px, 16px, 32px, 0);
e2734cc7
RK
4055}
4056
4057.chat-minimize-button:hover:active,
4058.chat-minimize-button:hover {
b27cc46e 4059 -moz-image-region: rect(16px, 32px, 32px, 16px);
e2734cc7
RK
4060}
4061
4062.chat-swap-button {
4063 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 4064 -moz-image-region: rect(48px, 16px, 64px, 0);
e2734cc7
RK
4065}
4066
4067.chat-swap-button:hover:active,
4068.chat-swap-button:hover {
b27cc46e 4069 -moz-image-region: rect(48px, 32px, 64px, 16px);
e2734cc7
RK
4070}
4071
4072chatbar > chatbox > .chat-titlebar > .chat-swap-button {
4073 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 4074 -moz-image-region: rect(32px, 16px, 48px, 0);
e2734cc7
RK
4075}
4076
4077chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover:active,
4078chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover {
b27cc46e 4079 -moz-image-region: rect(32px, 32px, 48px, 16px);
e2734cc7
RK
4080}
4081
e9c73590
RK
4082.chat-title {
4083 font-weight: bold;
4084 font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
90a244b7 4085 text-shadow: none;
348c0499 4086 cursor: inherit;
e9c73590
RK
4087}
4088
4089.chat-titlebar {
4090 background-color: #9C9CFF;
4091 color: #000000;
4092 height: 20px;
fcfb76ce 4093 min-height: 16px;
e9c73590
RK
4094 width: 100%;
4095 margin: 0;
4096 padding: 2px;
348c0499 4097 -moz-padding-start: 6px;
e9c73590
RK
4098 border: none;
4099 border-bottom: 1px solid #008484;
348c0499 4100 cursor: pointer;
e9c73590
RK
4101}
4102
e2734cc7
RK
4103.chat-titlebar > .notification-anchor-icon {
4104 margin-left: 2px;
4105 margin-right: 2px;
4106}
4107
e9c73590
RK
4108.chat-titlebar[minimized="true"] {
4109 border-bottom: none;
4110}
4111
348c0499
RK
4112.chat-titlebar[selected] {
4113 background-color: #008484;
4114}
4115
4116.chat-titlebar[activity] {
4117 background-color: #E7ADE7;
4118}
4119
e9c73590
RK
4120.chat-frame {
4121 padding: 0;
4122 margin: 0;
4123 overflow: hidden;
4124}
4125
4126.chatbar-button {
ed1a91c6 4127 list-style-image: url("chrome://browser/skin/social/services-16.png");
e9c73590
RK
4128 background-color: #000000;
4129 border: none;
4130 margin: 0;
4131 padding: 2px;
4132 height: 21px;
4133 width: 21px;
4134 border-top: 1px solid #008484;
4135 -moz-border-end: 1px solid #008484;
4136}
4137
ed1a91c6
RK
4138@media (min-resolution: 2dppx) {
4139 .chatbar-button {
4140 list-style-image: url("chrome://browser/skin/social/services-16@2x.png");
4141 }
4142}
4143
fe524e0c
RK
4144.chatbar-button > .toolbarbutton-icon {
4145 width: 16px;
4146}
4147
d7cfd768
RK
4148.chatbar-button > menupopup > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon {
4149 width: auto;
4150 height: auto;
e9c73590
RK
4151 max-height: 16px;
4152 max-width: 16px;
e9c73590
RK
4153}
4154
90a244b7
RK
4155.chatbar-button > .toolbarbutton-icon {
4156 opacity: .6;
4157 -moz-margin-end: 0;
4158}
4159.chatbar-button:hover > .toolbarbutton-icon,
4160.chatbar-button[open="true"] > .toolbarbutton-icon {
4161 opacity: 1;
4162}
4163
a6757852 4164.chatbar-button:hover,
90a244b7 4165.chatbar-button[open="true"] {
e9c73590
RK
4166}
4167
e9c73590
RK
4168.chatbar-button > .toolbarbutton-text,
4169.chatbar-button > .toolbarbutton-menu-dropmarker {
4170 display: none;
4171}
4172
90a244b7 4173.chatbar-button[activity]:not([open="true"]) {
348c0499
RK
4174 background-color: #E7ADE7;
4175}
4176
4177.chatbar-button > menupopup > menuitem[activity] {
4178 font-weight: bold;
4179}
4180
e9c73590
RK
4181.chatbar-innerbox {
4182 background: transparent;
90a244b7 4183 margin: -285px 0 0;
e9c73590
RK
4184 overflow: hidden;
4185}
4186
fcfb76ce
RK
4187chatbar {
4188 -moz-margin-end: 20px;
4189}
4190
e9c73590 4191chatbar > chatbox {
fcfb76ce
RK
4192 height: 285px;
4193 width: 260px;
4194 -moz-margin-start: 4px;
e9c73590
RK
4195 background-color: #000000;
4196 border: 1px solid #9C9CFF;
4197 border-bottom: none;
90a244b7
RK
4198 border-top-left-radius: 2.5px;
4199 border-top-right-radius: 2.5px;
e9c73590
RK
4200}
4201
fcfb76ce
RK
4202chatbox[minimized="true"] {
4203 width: 160px;
e9c73590 4204 height: 20px;
e9c73590 4205}
348c0499 4206
e2734cc7
RK
4207window > chatbox {
4208 -moz-margin-start: 0px;
4209 margin: 0px;
4210 border: none;
4211 padding: 0px;
4212}
4213
e7c8bab1
RK
4214/* === END chat.inc.css === */
4215
b27cc46e 4216/* === BEGIN plugin-doorhanger.inc.css === */
348c0499 4217
b27cc46e
RK
4218/**
4219 * Plugin Doorhanger Styles
4220 */
348c0499 4221
b27cc46e 4222#notification-popup[popupid="click-to-play-plugins"] > .panel-arrowcontainer > .panel-arrowcontent {
1e32332f 4223 padding: 6px 1px 2px;
348c0499
RK
4224}
4225
348c0499 4226.click-to-play-plugins-notification-center-box {
348c0499
RK
4227}
4228
fe524e0c
RK
4229.plugin-popupnotification-centeritem:nth-child(odd) {
4230/* background-color: rgba(0,0,0,0.1);*/
348c0499
RK
4231}
4232
b27cc46e
RK
4233.center-item-label {
4234 margin-bottom: 0;
4235 text-overflow: ellipsis;
348c0499
RK
4236}
4237
b27cc46e
RK
4238.center-item-warning-icon {
4239 background-image: url("chrome://mozapps/skin/extensions/alerticon-info-negative.png");
348c0499 4240 background-repeat: no-repeat;
348c0499 4241 width: 16px;
b27cc46e
RK
4242 height: 15px;
4243 -moz-margin-start: 6px;
348c0499
RK
4244}
4245
b27cc46e 4246.click-to-play-plugins-notification-button-container {
348c0499
RK
4247}
4248
b27cc46e
RK
4249.click-to-play-popup-button {
4250 width: 50%;
348c0499
RK
4251}
4252
b27cc46e 4253.click-to-play-plugins-notification-description-box {
1e32332f
RK
4254 margin-left: 5px;
4255 margin-right: 5px;
4256 margin-top: 0;
4257 padding-bottom: 3px;
348c0499
RK
4258}
4259
b27cc46e 4260.click-to-play-plugins-outer-description {
1e32332f 4261 margin-top: 1px;
348c0499
RK
4262}
4263
b27cc46e
RK
4264.click-to-play-plugins-notification-link,
4265.center-item-link {
4266 margin: 0;
348c0499
RK
4267}
4268
2c225fcb
RK
4269.messageImage[value="plugin-hidden"] {
4270 list-style-image: url("chrome://browser/skin/notification-pluginNormal.png");
4271}
4272
4273/* Keep any changes to this style in sync with pluginProblem.css */
4274notification.pluginVulnerable {
4275}
4276
4277notification.pluginVulnerable .messageImage {
4278 list-style-image: url("chrome://browser/skin/notification-pluginBlocked.png");
4279}
4280
b27cc46e 4281/* === END plugin-doorhanger.inc.css === */
0142a07b 4282
43cc2806
RK
4283/* === BEGIN customizeMode.inc.css === */
4284
4285/* Customization mode */
e28f3f71
RK
4286
4287#main-window:-moz-any([customize-entering],[customize-entered]) #content-deck {
4288 margin: 0 1em 1em;
4289}
4290
4291#main-window:-moz-any([customize-entering],[customize-entered]) #navigator-toolbox {
4292 margin-left: 1em;
4293 margin-right: 1em;
43cc2806
RK
4294}
4295
e28f3f71
RK
4296#main-window:-moz-any([customize-entering],[customize-exiting]) #tab-view-deck {
4297 pointer-events: none;
4298}
4299
4300#main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar))::before,
43cc2806 4301#PanelUI-contents > .panel-customization-placeholder {
e28f3f71 4302 -moz-outline-radius: 2.5px;
43cc2806
RK
4303 outline: 1px dashed transparent;
4304}
4305
e28f3f71
RK
4306#main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar))::before {
4307 /* Prevent jumping of tabs when switching a window between inactive and active (bug 853415). */
4308 -moz-box-ordinal-group: 0;
4309 content: "";
4310 display: -moz-box;
4311 height: 100%;
4312 left: 0;
4313 outline-offset: -2px;
4314 pointer-events: none;
4315 position: absolute;
4316 top: 0;
4317 width: 100%;
4318}
4319
4320/* Shift the TabsToolbar outline up 2px since the #nav-bar is shifted up by 1px and the
4321 #TabsToolbar::after is a pixel higher to draw the bottom border of the tabstrip so this makes the
4322 offset from the bottom effectively the same as other targets (-2px). */
4323#main-window[customize-entered] #TabsToolbar.customization-target::before {
e20c83c3 4324/* top: -2px;*/
e28f3f71
RK
4325}
4326
4327/* The parents of the outline pseudo-elements need to be positioned so that the outline is positioned relative to it. */
4328#main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar)):hover,
4329#main-window[customize-entered] .customization-target[customizing-dragovertarget]:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar)),
4330#main-window[customize-entered] #nav-bar-customization-target.customization-target {
4331 position: relative;
4332}
4333
4334/* Most target outlines are shown on hover and drag over but the panel menu uses
4335 placeholders instead. */
4336#main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar)):hover::before,
4337#main-window[customize-entered] .customization-target[customizing-dragovertarget]:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar))::before,
4338/* nav-bar and panel outlines are always shown */
4339#nav-bar[showoutline=true] > #nav-bar-customization-target.customization-target::before {
4340 outline-color: #A09090;
4341}
4342
4343#nav-bar[showoutline=true] > #nav-bar-customization-target.customization-target::before {
4344 transition: outline-color 250ms linear;
4345}
4346
4347#PanelUI-contents[showoutline=true] > .panel-customization-placeholder {
4348 transition: outline-color 250ms linear;
43cc2806
RK
4349 outline-color: #9C9CFF;
4350}
4351
4352#PanelUI-contents > .panel-customization-placeholder {
4353 cursor: auto;
4354 outline-offset: -5px;
4355}
4356
e28f3f71 4357#main-window[customizing] .customization-target:not(#PanelUI-contents) {
43cc2806 4358 min-width: 100px;
e20c83c3
RK
4359/* padding-left: 10px;
4360 padding-right: 10px;*/
4361}
4362
4363#main-window:-moz-any([customize-entering],[customize-entered]) #tab-view-deck {
4364 padding: 0 2em 2em;
43cc2806
RK
4365}
4366
4367#customization-container {
4368 background-color: #000000;
4369}
4370
e28f3f71
RK
4371#customization-palette,
4372#customization-empty {
4373 padding: 0 15px 15px;
43cc2806
RK
4374}
4375
4376#customization-header {
4377 font-size: 1.5em;
4378 line-height: 1.5em;
4379 color: #9C9CFF;
4380 font-weight: lighter;
4381 margin-bottom: 1em;
e28f3f71 4382 padding: 15px 15px 0;
43cc2806
RK
4383}
4384
4385#customization-panel-container {
e28f3f71
RK
4386 padding: 10px 10px 0px;
4387}
4388
4389#customization-footer {
4390 /*background-color: rgb(236,236,236);*/
4391 border-top: 1px solid #9C9CFF;
4392 padding: 15px;
4393}
4394
4395.customizationmode-button {
4396 margin: 0;
4397}
4398
4399.customizationmode-button:hover {
4400}
4401
4402.customizationmode-button[disabled="true"] {
4403}
4404
4405#customization-titlebar-visibility-button {
4406 list-style-image: url("chrome://browser/skin/customizableui/customize-titleBar-toggle.png");
4407 -moz-image-region: rect(0, 24px, 24px, 0);
4408 padding: 2px 7px;
4409 -moz-margin-end: 10px;
4410}
4411
4412#customization-titlebar-visibility-button > .button-box > .button-text {
4413 /* Sadly, button.css thinks its margins are perfect for everyone. */
4414 -moz-margin-start: 6px !important;
4415}
4416
4417#customization-titlebar-visibility-button[checked] {
4418 -moz-image-region: rect(0, 48px, 24px, 24px);
4419 background-color: #008484;
4420}
4421
4422#customization-undo-reset-button {
4423 -moz-margin-end: 10px;
4424}
4425
4426#main-window[customize-entered] #customization-panel-container {
43cc2806
RK
4427 background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png");
4428 background-position: left top;
4429 background-repeat: repeat;
4430 background-size: auto;
4431 background-attachment: fixed;
4432}
4433
e28f3f71
RK
4434toolbarpaletteitem[place="toolbar"] {
4435 transition: border-width 250ms ease-in-out;
43cc2806
RK
4436}
4437
4438toolbarpaletteitem[mousedown] {
4439 outline: 1px solid #008484;
4440 cursor: -moz-grabbing;
4441 opacity: 0.8;
4442}
4443
4444.panel-customization-placeholder,
4445toolbarpaletteitem[place="palette"],
4446toolbarpaletteitem[place="panel"] {
e28f3f71
RK
4447 transition: transform .3s ease-in-out;
4448}
4449
4450#customization-palette {
4451 transition: opacity .3s ease-in-out;
4452 opacity: 0;
43cc2806
RK
4453}
4454
e28f3f71
RK
4455#customization-palette[showing="true"] {
4456 opacity: 1;
4457}
4458
4459toolbarpaletteitem[notransition].panel-customization-placeholder,
4460toolbarpaletteitem[notransition][place="toolbar"],
43cc2806
RK
4461toolbarpaletteitem[notransition][place="palette"],
4462toolbarpaletteitem[notransition][place="panel"] {
e28f3f71 4463 transition: none;
43cc2806
RK
4464}
4465
e28f3f71
RK
4466toolbarpaletteitem > toolbarbutton > .toolbarbutton-icon,
4467toolbarpaletteitem > toolbaritem.panel-wide-item,
4468toolbarpaletteitem > toolbarbutton[type="menu-button"] {
4469 transition: transform .3s cubic-bezier(.6, 2, .75, 1.5) !important;
43cc2806
RK
4470}
4471
4472toolbarpaletteitem[mousedown] > toolbarbutton > .toolbarbutton-icon {
e28f3f71
RK
4473 transform: scale(1.3);
4474}
4475
4476toolbarpaletteitem[mousedown] > toolbaritem.panel-wide-item,
4477toolbarpaletteitem[mousedown] > toolbarbutton[type="menu-button"] {
43cc2806
RK
4478 transform: scale(1.1);
4479}
4480
4481/* Override the toolkit styling for items being dragged over. */
4482toolbarpaletteitem[place="toolbar"] {
4483 border-left-width: 0;
4484 border-right-width: 0;
4485 margin-right: 0;
4486 margin-left: 0;
4487}
4488
4489#customization-palette:not([hidden]) {
4490 margin-bottom: 25px;
4491}
4492
43cc2806
RK
4493#wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton,
4494#wrapper-edit-controls[place="palette"] > #edit-controls > separator,
e28f3f71
RK
4495#wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton,
4496#wrapper-zoom-controls[place="palette"] > #zoom-controls > separator {
4497 margin-top: 20px;
43cc2806
RK
4498}
4499
e28f3f71 4500/* Remove |:-moz-any(#customization-palette, #panelUI-contents)| selector when Australis lands - this makes it only apply post-Australis as those elements only exist there */
43cc2806
RK
4501#wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton,
4502:-moz-any(#customization-palette, #panelUI-contents) > #wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton {
4503 margin-left: 0;
4504 margin-right: 0;
e28f3f71
RK
4505 max-width: 24px;
4506 min-width: 24px;
43cc2806
RK
4507 max-height: 24px;
4508 height: 24px;
e28f3f71 4509 padding: 4px;
43cc2806
RK
4510}
4511
e28f3f71
RK
4512#wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton > .toolbarbutton-icon,
4513#wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton > .toolbarbutton-icon {
4514 width: 16px;
43cc2806
RK
4515}
4516
e28f3f71
RK
4517#wrapper-edit-controls > #edit-controls > toolbarbutton > .toolbarbutton-icon {
4518 opacity: 1; /* To ensure these buttons always look enabled in customize mode */
4519}
4520
4521:-moz-any(#customization-palette, #panelUI-contents) > #wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-reset-button,
4522:-moz-any(#customization-palette, #panelUI-contents) > #wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-reset-button + separator {
4523 display: none;
4524}
4525
4526#wrapper-personal-bookmarks:not([place="toolbar"]) > #personal-bookmarks {
4527 -moz-box-pack: center;
4528 min-height: 48px;
43cc2806
RK
4529}
4530
4531#customization-palette > toolbarpaletteitem > label {
4532 text-align: center;
4533 margin-left: 0;
4534 margin-right: 0;
4535}
4536
4537/* === END customizeMode.inc.css === */
4538
e28f3f71
RK
4539/* === BEGIN customizeTip.inc.css === */
4540
4541#customization-tipPanel > .panel-arrowcontainer > .panel-arrowcontent {
4542 padding: 0;
4543 margin: 0;
4544 min-width: 400px;
4545 max-width: 1000px;
4546 min-height: 200px;
4547 border-radius: 3px;
4548/* background-image: linear-gradient(90deg, #a0dfff 0%, #ceeeff 100%);*/
4549 border: 1px solid #9C9CFF;
4550}
4551
4552#customization-tipPanel > .panel-arrowcontainer > .panel-arrowcontent:-moz-locale-dir(rtl) {
4553/* background-image: linear-gradient(90deg, #ceeeff 0%, #a0dfff 100%);*/
4554}
4555
4556.customization-tipPanel-infoBox {
4557 margin: 20px 25px 25px;
4558 width: 25px;
4559 background-image: url("chrome://browser/skin/customizableui/info-icon-customizeTip.png");
4560 background-repeat: no-repeat;
4561}
4562
4563.customization-tipPanel-content {
4564 margin: 25px 0;
4565 font-size: 12px;
4566 line-height: 18px;
4567}
4568
4569.customization-tipPanel-em {
4570 margin: 0;
4571 font-weight: bold;
4572}
4573
4574.customization-tipPanel-contentImage {
4575 margin-top: 25px;
4576 list-style-image: url("chrome://browser/skin/customizableui/customize-illustration.png");
4577 min-width: 300px;
4578 max-width: 300px;
4579 min-height: 190px;
4580 max-height: 190px;
4581 display: -moz-box;
4582}
4583
4584.customization-tipPanel-contentImage:-moz-locale-dir(rtl) {
4585 list-style-image: url("chrome://browser/skin/customizableui/customize-illustration-rtl.png");
4586}
4587
4588.customization-tipPanel-link {
4589 -moz-appearance: none;
4590 background: transparent;
4591 border: none;
4592 box-shadow: none;
4593 color: #3333FF;
4594 margin: 0;
4595 cursor: pointer;
4596}
4597
4598.customization-tipPanel-link > .button-box > .button-text {
4599 margin: 0 !important;
4600}
4601
4602.customization-tipPanel-closeBox > .close-icon {
4603 -moz-appearance: none;
4604 border: 0;
4605 -moz-margin-end: -25px;
4606}
4607
4608#customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="left"],
4609#customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="right"] {
4610 list-style-image: url("chrome://browser/skin/customizableui/panelarrow-customizeTip.png");
4611}
4612
4613/* === END customizeTip.inc.css === */
4614
e20c83c3 4615#main-window[customize-entered] {
43cc2806
RK
4616 background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png");
4617 background-attachment: fixed;
4618}
4619
43cc2806
RK
4620#customization-container {
4621 border-left: 1px solid #9C9CFF;
4622 border-right: 1px solid #9C9CFF;
4623 background-clip: padding-box;
4624}
4625
e20c83c3
RK
4626#customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="left"] {
4627 margin-right: -2px;
4628}
4629
4630#customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="right"] {
4631 margin-left: -2px;
4632}
4633
4634/* End customization mode */
4635
4636#main-window[privatebrowsingmode=temporary] #toolbar-menubar {
4637 background-image: url("chrome://browser/skin/privatebrowsing-dark.png");
4638 background-position: top right;
4639 background-repeat: no-repeat;
4640}
4641
4642#main-window[privatebrowsingmode=temporary] #toolbar-menubar:-moz-locale-dir(rtl) {
4643 background-position: top left;
4644}
4645
4646#main-window[privatebrowsingmode=temporary] #appmenu-button > .button-box > .box-inherit > .button-icon {
4647 list-style-image: url("chrome://browser/skin/privatebrowsing-light.png");
4648 width: 20px;
4649 height: 16px;
4650}
4651
43cc2806
RK
4652#main-window[privatebrowsingmode=temporary] #TabsToolbar::after {
4653 content: "";
4654 display: -moz-box;
4655 width: 40px;
4656 background: url("chrome://browser/skin/privatebrowsing-indicator.png") no-repeat center center;
4657}
4658
4659/* === BEGIN UITour.inc.css === */
4660
4661/* UI Tour */
4662
4663html|div#UITourHighlight {
4664 border-radius: 20px;
4665 border: 2px #9C9CFF solid;
4666 min-height: 32px;
4667 min-width: 32px;
1bf116f8
RK
4668 /* HACK for pre-Australis */
4669 display: none;
4670}
4671
4672html|div#UITourHighlight[active] {
4673 /* HACK for pre-Australis */
4674 display: none;
43cc2806
RK
4675}
4676
4677#UITourTooltip {
4678 max-width: 20em;
4679}
4680
4681#UITourTooltipTitle {
4682 font-size: 130%;
4683 font-weight: bold;
4684 margin: 0 0 5px 0;
4685}
4686
4687#UITourTooltipDescription {
4688 max-width: 20em;
4689}
4690
4691/* === END UITour.inc.css === */