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