second part of syncing LCARStrek with Firefox 30 windows theme changes
[themes.git] / LCARStrek / browser / browser.css
CommitLineData
9099c61d
RK
1/* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
acb0e9b8 4
5@import url("chrome://global/skin/");
fcaeefc2 6@import url("downloads/indicator.css");
acb0e9b8 7
8@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
319c6529
RK
9@namespace html url("http://www.w3.org/1999/xhtml");
10
11toolbar {
12 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar");
13}
acb0e9b8 14
7d3f7f14 15toolbar[customizable="true"] {
43cc2806
RK
16 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-browsercustom");
17}
18
41279e76
RK
19toolbar[type="menubar"][autohide="true"] {
20 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide");
21}
22
7d3f7f14 23#toolbar-menubar[autohide="true"] {
43cc2806
RK
24 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide-browsercustom");
25}
26
acb0e9b8 27menubar {
319c6529 28 -moz-binding: url("chrome://global/skin/globalBindings.xml#menubar");
acb0e9b8 29}
30
319c6529
RK
31#menubar-items {
32 -moz-box-orient: vertical; /* for flex hack */
acb0e9b8 33}
34
319c6529
RK
35#main-menubar {
36 -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
37}
38
63ada306
RK
39/* ::::: primary toolbar ::::: */
40
41.toolbar-primary > .toolbar-box > .toolbar-holder {
270cbf0c 42 background-color: #A09090;
63ada306
RK
43}
44
45.toolbar-primary > .toolbar-box > .toolbar-startcap,
46.toolbar-primary > .toolbar-box > .toolbar-endcap {
47 background-color: #9C9CFF;
48}
49
e20c83c3
RK
50/* Hides the titlebar-placeholder underneath the window caption buttons when we
51 are not autohiding the menubar. */
52#toolbar-menubar:not([autohide="true"]) + #TabsToolbar > .titlebar-placeholder[type="caption-buttons"] {
53 display: none;
54}
55
43cc2806
RK
56/* We want a 4px gap between the TabsToolbar and the toolbar-menubar when the
57 toolbar-menu is displayed, and a 16px gap when it is not. 1px is taken care
58 of by the (light) outer shadow of the tab, the remaining 3/15 are these margins. */
c0f6797e
RK
59#toolbar-menubar:not([moz-collapsed=true]):not([autohide=true]) ~ #TabsToolbar,
60#toolbar-menubar:not([moz-collapsed=true])[autohide=true]:not([inactive]) ~ #TabsToolbar {
43cc2806
RK
61/* margin-top: 3px;*/
62}
63
64#main-window[tabsintitlebar][sizemode="normal"][chromehidden~="menubar"] #toolbar-menubar ~ #TabsToolbar,
65#main-window[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="true"][inactive] ~ #TabsToolbar {
66/* margin-top: 15px;*/
67}
68
7d3f7f14 69#toolbar-menubar:not([autohide="true"]) {
43cc2806
RK
70 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-drag-browsercustom");
71}
72
018d70fb
RK
73#main-window[tabsintitlebar] #toolbar-menubar .toolbar-endcap {
74 /* the titlebar buttons are shown right over the endcap but we have no power over the buttonbox position just for this case, so hide the endcap */
75 display: none;
43cc2806 76}
63ada306 77
e20c83c3
RK
78#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[customizing-dragovertarget].customization-target::before,
79#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #TabsToolbar[customizing-dragovertarget].customization-target::before,
80#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #toolbar-menubar.customization-target:hover::before,
81#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #TabsToolbar.customization-target:hover::before {
82 outline-color: #A09090;
83}
84
319c6529
RK
85#navigator-toolbox {
86}
87
9abeb12c
RK
88#navigator-toolbox::after {
89 content: "";
90 display: -moz-box;
91 -moz-box-ordinal-group: 101; /* tabs toolbar is 100 */
92 height: 1px;
93}
9abeb12c 94
319c6529
RK
95#navigator-toolbox > toolbar:not(:-moz-lwtheme) {
96}
97
c0f6797e
RK
98/* indent due to non-applicable aero rule */
99 #toolbar-menubar {
100 background-color: transparent !important;
319c6529
RK
101 }
102
c0f6797e
RK
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;
319c6529
RK
108 }
109
c0f6797e
RK
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;
319c6529
RK
114 }
115
c0f6797e
RK
116 #TabsToolbar:-moz-lwtheme {
117 /*background: linear-gradient(to top, @toolbarShadowColor@ 2px, transparent 2px);*/
319c6529 118 }
9abeb12c 119
c0f6797e
RK
120 #main-window[tabsintitlebar] #titlebar:-moz-lwtheme {
121 visibility: hidden;
122 }
319c6529 123
c0f6797e
RK
124 #main-window[tabsintitlebar] #titlebar-content:-moz-lwtheme {
125 -moz-binding: url("chrome://global/content/bindings/general.xml#windowdragbox");
126 visibility: visible;
127 }
319c6529 128
c0f6797e 129/* Make the menu inherit the toolbar's color. On non-compositor (Aero Basic, XP modern, classic)
5401f433
RK
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 }
319c6529 135
c0f6797e
RK
136#nav-bar {
137 /* Position the toolbar above the bottom of background tabs */
138 position: relative;
139 z-index: 1;
82b4252f
RK
140}
141
c0f6797e
RK
142#personal-bookmarks {
143/* min-height: 24px; */
319c6529
RK
144}
145
c0f6797e
RK
146#print-preview-toolbar:not(:-moz-lwtheme) {
147 /* -moz-appearance: toolbox; */
82b4252f
RK
148}
149
c0f6797e 150#browser-bottombox:not(:-moz-lwtheme) {
319c6529
RK
151}
152
153/* ::::: titlebar ::::: */
154
5305ef8d
RK
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
319c6529 165#main-window[sizemode="normal"] > #titlebar {
5305ef8d
RK
166 margin-top: -3px;
167 margin-bottom: 3px;
319c6529
RK
168}
169
170#main-window[sizemode="maximized"] > #titlebar {
5305ef8d 171 margin-top: 4px;
319c6529
RK
172}
173
43cc2806
RK
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 */
319c6529 180#titlebar-buttonbox {
b7f3670c
RK
181 -moz-appearance: none;
182 margin-top: 6px;
183 margin-top: 4px;
5305ef8d 184 -moz-margin-end: 3px;
43cc2806 185 z-index: 1;
319c6529
RK
186}
187
319c6529
RK
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 {
5305ef8d
RK
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");
319c6529
RK
204}
205
206#titlebar-max {
5305ef8d
RK
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");
319c6529
RK
212}
213
214#main-window[sizemode="maximized"] #titlebar-max {
5305ef8d
RK
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");
319c6529
RK
220}
221
222#titlebar-close {
5305ef8d
RK
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");
acb0e9b8 228}
229
230/* ::::: bookmark buttons ::::: */
231
c0f6797e
RK
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
26125509
RK
246.bookmark-item > .toolbarbutton-icon,
247#personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
acb0e9b8 248 width: 16px;
249 height: 16px;
250}
251
26125509
RK
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 {
acb0e9b8 255 display: -moz-box !important;
256}
257
319c6529
RK
258.bookmark-item > .toolbarbutton-menu-dropmarker {
259 display: none;
260}
261
26125509 262#bookmarks-toolbar-placeholder {
8da9da4e 263 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") !important;
319c6529
RK
264}
265
e20c83c3
RK
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
c0f6797e
RK
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
e20c83c3
RK
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 {
c0f6797e
RK
322 list-style-image: none !important;
323}
324
325#bookmarked-notification-dropmarker-anchor[notification="finish"] > #bookmarked-notification-dropmarker-icon {
326 visibility: visible;
e20c83c3
RK
327 animation: animation-bookmarkPulse 300ms;
328 animation-delay: 600ms;
329 animation-timing-function: ease-out;
330}
331
319c6529
RK
332/* ::::: bookmark menus ::::: */
333
334menu.bookmark-item,
335menuitem.bookmark-item {
336 min-width: 0;
ab799a7a 337 max-width: 32em;
319c6529
RK
338}
339
e20c83c3 340.bookmark-item:not(.subviewbutton) > .menu-iconic-left {
319c6529
RK
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 {
dce90fef 352 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
8da9da4e 353 -moz-image-region: auto;
319c6529
RK
354}
355
356.bookmark-item[container] {
357 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
8da9da4e 358 -moz-image-region: auto;
319c6529
RK
359}
360
361.bookmark-item[container][open] {
362 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
8da9da4e 363 -moz-image-region: auto;
319c6529
RK
364}
365
8da9da4e
RK
366.bookmark-item[container][livemark] {
367 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-folder.png");
319c6529
RK
368 -moz-image-region: auto;
369}
370
371.bookmark-item[container][livemark] .bookmark-item {
8da9da4e 372 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-item.png");
719b06bc 373 -moz-image-region: rect(0px, 16px, 16px, 0px);
319c6529
RK
374}
375
eec397be 376.bookmark-item[container][livemark] .bookmark-item[visited] {
719b06bc 377 -moz-image-region: rect(0px, 32px, 16px, 16px);
eec397be
RK
378}
379
319c6529 380.bookmark-item[container][query] {
8da9da4e 381 list-style-image: url("chrome://communicator/skin/bookmarks/query.png");
319c6529
RK
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] {
8da9da4e 391 list-style-image: url("chrome://communicator/skin/history/calendar.png");
319c6529
RK
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");
8da9da4e 397 -moz-image-region: auto;
319c6529
RK
398}
399
400.bookmark-item[query][hostContainer][open] {
401 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
8da9da4e 402 -moz-image-region: auto;
319c6529
RK
403}
404
b1234db8
RK
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
319c6529
RK
415/* ::::: primary toolbar buttons ::::: */
416
43cc2806
RK
417/* === BEGIN toolbarbuttons.inc.css === */
418
419/* Whole section of this included file: */
51994fad
RK
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
7d3f7f14 428#bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK
429 list-style-image: url("chrome://browser/skin/ToolbarFx.png");
430}
431
7d3f7f14 432#back-button {
43cc2806
RK
433 -moz-image-region: rect(0, 36px, 18px, 18px);
434}
435
7d3f7f14 436#back-button:hover:not([disabled="true"]) {
43cc2806
RK
437 -moz-image-region: rect(18px, 36px, 36px, 18px);
438}
439
7d3f7f14 440#back-button[disabled="true"] {
43cc2806
RK
441 -moz-image-region: rect(36px, 36px, 54px, 18px);
442}
443
7d3f7f14 444#forward-button {
43cc2806
RK
445 -moz-image-region: rect(0, 72px, 18px, 54px);
446}
447
7d3f7f14 448#forward-button:hover:not([disabled="true"]) {
43cc2806
RK
449 -moz-image-region: rect(18px, 72px, 36px, 54px);
450}
451
7d3f7f14 452#forward-button[disabled="true"] {
43cc2806
RK
453 -moz-image-region: rect(36px, 72px, 54px, 54px);
454}
455
7d3f7f14
RK
456#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
457#forward-button:-moz-locale-dir(rtl) {
43cc2806
RK
458 transform: scaleX(-1);
459}
460
7d3f7f14 461#home-button[cui-areatype="toolbar"] {
43cc2806
RK
462 -moz-image-region: rect(0, 126px, 18px, 108px);
463}
464
7d3f7f14 465#home-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
466 -moz-image-region: rect(18px, 126px, 36px, 108px);
467}
468
7d3f7f14 469#bookmarks-menu-button[cui-areatype="toolbar"] {
43cc2806
RK
470 -moz-image-region: rect(0, 144px, 18px, 126px);
471}
472
7d3f7f14
RK
473#bookmarks-menu-button[cui-areatype="toolbar"]:hover,
474#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
475 -moz-image-region: rect(18px, 144px, 36px, 126px);
476}
477
43ee1307 478/* When "new tab" page shows up, the menubutton-button (star button) is disabled */
7d3f7f14 479#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-button[disabled="true"] {
43ee1307
RK
480 -moz-image-region: rect(36px, 144px, 54px, 126px) !important;
481 background-color: transparent !important;
482}
483
7d3f7f14 484#bookmarks-menu-button[cui-areatype="toolbar"][starred] {
43cc2806
RK
485 -moz-image-region: rect(0, 162px, 18px, 144px);
486}
487
7d3f7f14 488#bookmarks-menu-button[cui-areatype="toolbar"][starred]:hover,
83e3b5cf
RK
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. */
43cc2806
RK
493 -moz-image-region: rect(18px, 162px, 36px, 144px);
494}
495
7d3f7f14 496#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK
497 -moz-image-region: rect(0, 630px, 18px, 612px);
498}
499
7d3f7f14 500#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker {
43cc2806
RK
501 padding: 1px;
502 -moz-box-align: center;
503}
504
7d3f7f14
RK
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 {
43cc2806
RK
507 -moz-image-region: rect(18px, 630px, 36px, 612px);
508}
509
7d3f7f14
RK
510#bookmarks-menu-button[cui-areatype="toolbar"]:hover:active > .toolbarbutton-menubutton-dropmarker,
511#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] > .toolbarbutton-menubutton-dropmarker {
43cc2806
RK
512 padding-top: 2px;
513 padding-bottom: 0px;
514 -moz-padding-start: 2px;
515 -moz-padding-end: 0px;
516}
517
7d3f7f14 518#history-panelmenu[cui-areatype="toolbar"] {
43cc2806
RK
519 -moz-image-region: rect(0, 180px, 18px, 162px);
520}
521
7d3f7f14
RK
522#history-panelmenu[cui-areatype="toolbar"]:hover,
523#history-panelmenu[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
524 -moz-image-region: rect(18px, 180px, 36px, 162px);
525}
526
7d3f7f14 527#downloads-button[cui-areatype="toolbar"] {
43cc2806
RK
528 -moz-image-region: rect(0, 198px, 18px, 180px);
529}
530
7d3f7f14
RK
531#downloads-button[cui-areatype="toolbar"]:hover,
532#downloads-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
533 -moz-image-region: rect(18px, 198px, 36px, 180px);
534}
535
7d3f7f14 536#add-ons-button[cui-areatype="toolbar"] {
43cc2806
RK
537 -moz-image-region: rect(0, 216px, 18px, 198px);
538}
539
7d3f7f14 540#add-ons-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
541 -moz-image-region: rect(18px, 216px, 36px, 198px);
542}
543
7d3f7f14 544#open-file-button[cui-areatype="toolbar"] {
43cc2806
RK
545 -moz-image-region: rect(0, 234px, 18px, 216px);
546}
547
7d3f7f14 548#open-file-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
549 -moz-image-region: rect(18px, 234px, 36px, 216px);
550}
551
7d3f7f14 552#save-page-button[cui-areatype="toolbar"] {
43cc2806
RK
553 -moz-image-region: rect(0, 252px, 18px, 234px);
554}
555
7d3f7f14 556#save-page-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
557 -moz-image-region: rect(18px, 252px, 36px, 234px);
558}
559
7d3f7f14 560#sync-button[cui-areatype="toolbar"] {
43cc2806
RK
561 -moz-image-region: rect(0, 270px, 18px, 252px);
562}
563
7d3f7f14 564#sync-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
565 -moz-image-region: rect(18px, 270px, 36px, 252px);
566}
567
5401f433
RK
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
7d3f7f14 581#feed-button[cui-areatype="toolbar"] {
43cc2806
RK
582 -moz-image-region: rect(0, 288px, 18px, 270px);
583}
584
7d3f7f14 585#feed-button[cui-areatype="toolbar"]:hover:not([disabled="true"]) {
43cc2806
RK
586 -moz-image-region: rect(18px, 288px, 36px, 270px);
587}
588
7d3f7f14 589#feed-button[cui-areatype="toolbar"][disabled="true"] {
cc4b0b0d
RK
590 -moz-image-region: rect(36px, 288px, 54px, 270px);
591}
592
7d3f7f14 593#social-share-button[cui-areatype="toolbar"] {
43cc2806
RK
594 -moz-image-region: rect(0px, 306px, 18px, 288px);
595}
596
7d3f7f14 597#social-share-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
598 -moz-image-region: rect(18px, 306px, 36px, 288px);
599}
600
7d3f7f14 601#characterencoding-button[cui-areatype="toolbar"] {
43cc2806
RK
602 -moz-image-region: rect(0, 324px, 18px, 306px);
603}
604
7d3f7f14
RK
605#characterencoding-button[cui-areatype="toolbar"]:hover:not([disabled="true"]),
606#characterencoding-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
607 -moz-image-region: rect(18px, 324px, 36px, 306px);
608}
609
7d3f7f14 610#characterencoding-button[cui-areatype="toolbar"][disabled="true"] {
cc4b0b0d
RK
611 -moz-image-region: rect(36px, 324px, 54px, 306px);
612}
613
7d3f7f14 614#new-window-button[cui-areatype="toolbar"] {
43cc2806
RK
615 -moz-image-region: rect(0, 342px, 18px, 324px);
616}
617
7d3f7f14 618#new-window-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
619 -moz-image-region: rect(18px, 342px, 36px, 324px);
620}
621
46e71434
RK
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
7d3f7f14 634#new-tab-button[cui-areatype="toolbar"] {
43cc2806
RK
635 -moz-image-region: rect(0, 360px, 18px, 342px);
636}
637
7d3f7f14 638#new-tab-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
639 -moz-image-region: rect(18px, 360px, 36px, 342px);
640}
641
7d3f7f14 642#privatebrowsing-button[cui-areatype="toolbar"] {
43cc2806
RK
643 -moz-image-region: rect(0, 378px, 18px, 360px);
644}
645
7d3f7f14 646#privatebrowsing-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
647 -moz-image-region: rect(18px, 378px, 36px, 360px);
648}
649
7d3f7f14 650#find-button[cui-areatype="toolbar"] {
43cc2806
RK
651 -moz-image-region: rect(0, 396px, 18px, 378px);
652}
653
7d3f7f14 654#find-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
655 -moz-image-region: rect(18px, 396px, 36px, 378px);
656}
657
7d3f7f14 658#print-button[cui-areatype="toolbar"] {
43cc2806
RK
659 -moz-image-region: rect(0, 414px, 18px, 396px);
660}
661
7d3f7f14 662#print-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
663 -moz-image-region: rect(18px, 414px, 36px, 396px);
664}
665
7d3f7f14 666#fullscreen-button[cui-areatype="toolbar"] {
43cc2806
RK
667 -moz-image-region: rect(0, 432px, 18px, 414px);
668}
669
7d3f7f14 670#fullscreen-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
671 -moz-image-region: rect(18px, 432px, 36px, 414px);
672}
673
7d3f7f14 674#developer-button[cui-areatype="toolbar"] {
43cc2806
RK
675 -moz-image-region: rect(0, 450px, 18px, 432px);
676}
677
7d3f7f14
RK
678#developer-button[cui-areatype="toolbar"]:hover,
679#developer-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
680 -moz-image-region: rect(18px, 450px, 36px, 432px);
681}
682
7d3f7f14 683#preferences-button[cui-areatype="toolbar"] {
43cc2806
RK
684 -moz-image-region: rect(0, 468px, 18px, 450px);
685}
686
7d3f7f14 687#preferences-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
688 -moz-image-region: rect(18px, 468px, 36px, 450px);
689}
690
7d3f7f14 691#PanelUI-menu-button {
43cc2806
RK
692 -moz-image-region: rect(0, 486px, 18px, 468px);
693}
694
7d3f7f14
RK
695#PanelUI-menu-button:hover,
696#PanelUI-menu-button[open="true"] {
43cc2806
RK
697 -moz-image-region: rect(18px, 486px, 36px, 468px);
698}
699
51994fad 700#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #cut-button {
43cc2806
RK
701 -moz-image-region: rect(0, 504px, 18px, 486px);
702}
703
51994fad 704#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #cut-button:hover:not([disabled="true"]) {
43cc2806
RK
705 -moz-image-region: rect(18px, 504px, 36px, 486px);
706}
707
51994fad 708#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #cut-button[disabled="true"] {
cc4b0b0d
RK
709 -moz-image-region: rect(36px, 504px, 54px, 486px);
710}
711
51994fad 712#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #copy-button {
43cc2806
RK
713 -moz-image-region: rect(0, 522px, 18px, 504px);
714}
715
51994fad 716#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #copy-button:hover:not([disabled="true"]) {
43cc2806
RK
717 -moz-image-region: rect(18px, 522px, 36px, 504px);
718}
719
51994fad 720#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #copy-button[disabled="true"] {
cc4b0b0d
RK
721 -moz-image-region: rect(36px, 522px, 54px, 504px);
722}
723
51994fad 724#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #paste-button {
43cc2806
RK
725 -moz-image-region: rect(0, 540px, 18px, 522px);
726}
727
51994fad 728#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #paste-button:hover:not([disabled="true"]) {
43cc2806
RK
729 -moz-image-region: rect(18px, 540px, 36px, 522px);
730}
731
51994fad 732#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #paste-button[disabled="true"] {
cc4b0b0d
RK
733 -moz-image-region: rect(36px, 540px, 54px, 522px);
734}
735
51994fad 736#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-out-button {
43cc2806
RK
737 -moz-image-region: rect(0, 558px, 18px, 540px);
738}
739
51994fad 740#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-out-button:hover:not([disabled="true"]) {
43cc2806
RK
741 -moz-image-region: rect(18px, 558px, 36px, 540px);
742}
743
51994fad 744#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-out-button[disabled="true"] {
cc4b0b0d
RK
745 -moz-image-region: rect(36px, 558px, 54px, 540px);
746}
747
51994fad 748#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-in-button {
43cc2806
RK
749 -moz-image-region: rect(0, 576px, 18px, 558px);
750}
751
51994fad 752#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-in-button:hover:not([disabled="true"]) {
43cc2806
RK
753 -moz-image-region: rect(18px, 576px, 36px, 558px);
754}
755
51994fad 756#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-in-button[disabled="true"] {
cc4b0b0d
RK
757 -moz-image-region: rect(36px, 576px, 54px, 558px);
758}
759
51994fad 760#webrtc-status-button:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) {
43cc2806
RK
761 -moz-image-region: rect(0, 594px, 18px, 576px);
762}
763
51994fad
RK
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"] {
43cc2806
RK
766 -moz-image-region: rect(18px, 594px, 36px, 576px);
767}
768
7d3f7f14 769#nav-bar-overflow-button {
43cc2806
RK
770 -moz-image-region: rect(0, 612px, 18px, 594px);
771}
772
7d3f7f14
RK
773#nav-bar-overflow-button:hover,
774#nav-bar-overflow-button[open="true"] {
43cc2806
RK
775 -moz-image-region: rect(18px, 612px, 36px, 594px);
776}
777
46e71434
RK
778#nav-bar-overflow-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
779 transform: scaleX(-1);
780}
781
c0f6797e
RK
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
43cc2806
RK
806/* === END toolbarbuttons.inc.css === */
807
808/* === BEGIN menupanel.inc.css === */
809
810/* Menu panel and palette styles */
811
51994fad 812toolbaritem[sdkstylewidget="true"] > toolbarbutton,
5401f433
RK
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) {
43cc2806
RK
827 list-style-image: url("chrome://browser/skin/menuPanel.png");
828}
829
830#home-button[cui-areatype="menu-panel"],
7d3f7f14 831toolbarpaletteitem[place="palette"] > #home-button {
43cc2806
RK
832 -moz-image-region: rect(0px, 128px, 32px, 96px);
833}
834
cc4b0b0d 835#home-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 836toolbarpaletteitem[place="palette"] > #home-button:hover {
cc4b0b0d
RK
837 -moz-image-region: rect(32px, 128px, 64px, 96px);
838}
839
43cc2806 840#bookmarks-menu-button[cui-areatype="menu-panel"],
7d3f7f14 841toolbarpaletteitem[place="palette"] > #bookmarks-menu-button {
46e71434 842 -moz-image-region: rect(0px, 192px, 32px, 160px);
43cc2806
RK
843}
844
cc4b0b0d 845#bookmarks-menu-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 846toolbarpaletteitem[place="palette"] > #bookmarks-menu-button:hover {
46e71434
RK
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);
cc4b0b0d
RK
852}
853
43cc2806 854#history-panelmenu[cui-areatype="menu-panel"],
7d3f7f14 855toolbarpaletteitem[place="palette"] > #history-panelmenu {
43cc2806
RK
856 -moz-image-region: rect(0px, 224px, 32px, 192px);
857}
858
cc4b0b0d 859#history-panelmenu[cui-areatype="menu-panel"]:hover,
7d3f7f14 860toolbarpaletteitem[place="palette"] > #history-panelmenu:hover {
cc4b0b0d
RK
861 -moz-image-region: rect(32px, 224px, 64px, 192px);
862}
863
46e71434
RK
864#history-panelmenu[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
865 -moz-image-region: rect(32px, 224px, 64px, 192px);
866}
867
43cc2806 868#downloads-button[cui-areatype="menu-panel"],
7d3f7f14 869toolbarpaletteitem[place="palette"] > #downloads-button {
43cc2806
RK
870 -moz-image-region: rect(0px, 256px, 32px, 224px);
871}
872
cc4b0b0d 873#downloads-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 874toolbarpaletteitem[place="palette"] > #downloads-button:hover {
cc4b0b0d
RK
875 -moz-image-region: rect(32px, 256px, 64px, 224px);
876}
877
43cc2806 878#add-ons-button[cui-areatype="menu-panel"],
7d3f7f14 879toolbarpaletteitem[place="palette"] > #add-ons-button {
43cc2806
RK
880 -moz-image-region: rect(0px, 288px, 32px, 256px);
881}
882
cc4b0b0d 883#add-ons-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 884toolbarpaletteitem[place="palette"] > #add-ons-button:hover {
cc4b0b0d
RK
885 -moz-image-region: rect(32px, 288px, 64px, 256px);
886}
887
43cc2806 888#open-file-button[cui-areatype="menu-panel"],
7d3f7f14 889toolbarpaletteitem[place="palette"] > #open-file-button {
43cc2806
RK
890 -moz-image-region: rect(0px, 320px, 32px, 288px);
891}
892
cc4b0b0d 893#open-file-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 894toolbarpaletteitem[place="palette"] > #open-file-button:hover {
cc4b0b0d
RK
895 -moz-image-region: rect(32px, 320px, 64px, 288px);
896}
897
43cc2806 898#save-page-button[cui-areatype="menu-panel"],
7d3f7f14 899toolbarpaletteitem[place="palette"] > #save-page-button {
43cc2806
RK
900 -moz-image-region: rect(0px, 352px, 32px, 320px);
901}
902
cc4b0b0d 903#save-page-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 904toolbarpaletteitem[place="palette"] > #save-page-button:hover {
cc4b0b0d
RK
905 -moz-image-region: rect(32px, 352px, 64px, 320px);
906}
907
43cc2806 908#sync-button[cui-areatype="menu-panel"],
7d3f7f14 909toolbarpaletteitem[place="palette"] > #sync-button {
43cc2806
RK
910 -moz-image-region: rect(0px, 384px, 32px, 352px);
911}
912
cc4b0b0d 913#sync-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 914toolbarpaletteitem[place="palette"] > #sync-button:hover {
cc4b0b0d
RK
915 -moz-image-region: rect(32px, 384px, 64px, 352px);
916}
917
5401f433
RK
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
43cc2806 923#feed-button[cui-areatype="menu-panel"],
7d3f7f14 924toolbarpaletteitem[place="palette"] > #feed-button {
43cc2806
RK
925 -moz-image-region: rect(0px, 416px, 32px, 384px);
926}
927
cc4b0b0d 928#feed-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
7d3f7f14 929toolbarpaletteitem[place="palette"] > #feed-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
930 -moz-image-region: rect(32px, 416px, 64px, 384px);
931}
932
933#feed-button[cui-areatype="menu-panel"][disabled="true"],
7d3f7f14 934toolbarpaletteitem[place="palette"] > #feed-button[disabled="true"] {
cc4b0b0d
RK
935 -moz-image-region: rect(64px, 416px, 96px, 384px);
936}
937
43cc2806 938#social-share-button[cui-areatype="menu-panel"],
7d3f7f14 939toolbarpaletteitem[place="palette"] > #social-share-button {
43cc2806
RK
940 -moz-image-region: rect(0px, 448px, 32px, 416px);
941}
942
cc4b0b0d 943#social-share-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 944toolbarpaletteitem[place="palette"] > #social-share-button:hover {
cc4b0b0d
RK
945 -moz-image-region: rect(32px, 448px, 64px, 416px);
946}
947
43cc2806 948#characterencoding-button[cui-areatype="menu-panel"],
7d3f7f14 949toolbarpaletteitem[place="palette"] > #characterencoding-button {
43cc2806
RK
950 -moz-image-region: rect(0px, 480px, 32px, 448px);
951}
952
cc4b0b0d 953#characterencoding-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
7d3f7f14 954toolbarpaletteitem[place="palette"] > #characterencoding-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
955 -moz-image-region: rect(32px, 480px, 64px, 448px);
956}
957
958#characterencoding-button[cui-areatype="menu-panel"][disabled="true"],
7d3f7f14 959toolbarpaletteitem[place="palette"] > #characterencoding-button[disabled="true"] {
cc4b0b0d
RK
960 -moz-image-region: rect(64px, 480px, 96px, 448px);
961}
962
46e71434
RK
963#characterencoding-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
964 -moz-image-region: rect(32px, 480px, 64px, 448px);
965}
966
43cc2806 967#new-window-button[cui-areatype="menu-panel"],
7d3f7f14 968toolbarpaletteitem[place="palette"] > #new-window-button {
43cc2806
RK
969 -moz-image-region: rect(0px, 512px, 32px, 480px);
970}
971
cc4b0b0d 972#new-window-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 973toolbarpaletteitem[place="palette"] > #new-window-button:hover {
cc4b0b0d
RK
974 -moz-image-region: rect(32px, 512px, 64px, 480px);
975}
976
5401f433
RK
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
43cc2806 987#new-tab-button[cui-areatype="menu-panel"],
7d3f7f14 988toolbarpaletteitem[place="palette"] > #new-tab-button {
43cc2806
RK
989 -moz-image-region: rect(0px, 544px, 32px, 512px);
990}
991
cc4b0b0d 992#new-tab-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 993toolbarpaletteitem[place="palette"] > #new-tab-button:hover {
cc4b0b0d
RK
994 -moz-image-region: rect(32px, 544px, 64px, 512px);
995}
996
43cc2806 997#privatebrowsing-button[cui-areatype="menu-panel"],
7d3f7f14 998toolbarpaletteitem[place="palette"] > #privatebrowsing-button {
43cc2806
RK
999 -moz-image-region: rect(0px, 576px, 32px, 544px);
1000}
1001
cc4b0b0d 1002#privatebrowsing-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1003toolbarpaletteitem[place="palette"] > #privatebrowsing-button:hover {
cc4b0b0d
RK
1004 -moz-image-region: rect(32px, 576px, 64px, 544px);
1005}
1006
46e71434
RK
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
43cc2806 1017#find-button[cui-areatype="menu-panel"],
7d3f7f14 1018toolbarpaletteitem[place="palette"] > #find-button {
43cc2806
RK
1019 -moz-image-region: rect(0px, 640px, 32px, 608px);
1020}
1021
cc4b0b0d 1022#find-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1023toolbarpaletteitem[place="palette"] > #find-button:hover {
cc4b0b0d
RK
1024 -moz-image-region: rect(32px, 640px, 64px, 608px);
1025}
1026
43cc2806 1027#print-button[cui-areatype="menu-panel"],
7d3f7f14 1028toolbarpaletteitem[place="palette"] > #print-button {
43cc2806
RK
1029 -moz-image-region: rect(0px, 672px, 32px, 640px);
1030}
1031
cc4b0b0d 1032#print-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1033toolbarpaletteitem[place="palette"] > #print-button:hover {
cc4b0b0d
RK
1034 -moz-image-region: rect(32px, 672px, 64px, 640px);
1035}
1036
43cc2806 1037#fullscreen-button[cui-areatype="menu-panel"],
7d3f7f14 1038toolbarpaletteitem[place="palette"] > #fullscreen-button {
43cc2806
RK
1039 -moz-image-region: rect(0px, 704px, 32px, 672px);
1040}
1041
cc4b0b0d 1042#fullscreen-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1043toolbarpaletteitem[place="palette"] > #fullscreen-button:hover {
cc4b0b0d
RK
1044 -moz-image-region: rect(32px, 704px, 64px, 672px);
1045}
1046
43cc2806 1047#developer-button[cui-areatype="menu-panel"],
7d3f7f14 1048toolbarpaletteitem[place="palette"] > #developer-button {
43cc2806
RK
1049 -moz-image-region: rect(0px, 736px, 32px, 704px);
1050}
1051
cc4b0b0d 1052#developer-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1053toolbarpaletteitem[place="palette"] > #developer-button:hover {
cc4b0b0d
RK
1054 -moz-image-region: rect(32px, 736px, 64px, 704px);
1055}
1056
46e71434
RK
1057#developer-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1058 -moz-image-region: rect(32px, 736px, 64px, 704px);
1059}
1060
43cc2806 1061#preferences-button[cui-areatype="menu-panel"],
7d3f7f14 1062toolbarpaletteitem[place="palette"] > #preferences-button {
43cc2806
RK
1063 -moz-image-region: rect(0px, 768px, 32px, 736px);
1064}
1065
cc4b0b0d 1066#preferences-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1067toolbarpaletteitem[place="palette"] > #preferences-button:hover {
cc4b0b0d
RK
1068 -moz-image-region: rect(32px, 768px, 64px, 736px);
1069}
1070
46e71434
RK
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
43cc2806
RK
1099/* Wide panel control icons */
1100
51994fad
RK
1101#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton,
1102#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton,
7d3f7f14
RK
1103toolbarpaletteitem[place="palette"] > #edit-controls > toolbarbutton,
1104toolbarpaletteitem[place="palette"] > #zoom-controls > toolbarbutton {
43cc2806
RK
1105 list-style-image: url("chrome://browser/skin/menuPanel-small.png");
1106}
1107
51994fad 1108#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button,
7d3f7f14 1109toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button {
43cc2806
RK
1110 -moz-image-region: rect(0px, 32px, 16px, 16px);
1111}
1112
51994fad 1113#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button:hover:not([disabled="true"]),
7d3f7f14 1114toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1115 -moz-image-region: rect(16px, 32px, 32px, 16px);
1116}
1117
51994fad 1118#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button[disabled="true"],
7d3f7f14 1119toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button[disabled="true"] {
cc4b0b0d
RK
1120 -moz-image-region: rect(32px, 32px, 48px, 16px);
1121}
1122
51994fad 1123#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button,
7d3f7f14 1124toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button {
43cc2806
RK
1125 -moz-image-region: rect(0px, 48px, 16px, 32px);
1126}
1127
51994fad 1128#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button:hover:not([disabled="true"]),
7d3f7f14 1129toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1130 -moz-image-region: rect(16px, 48px, 32px, 32px);
1131}
1132
51994fad 1133#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button[disabled="true"],
7d3f7f14 1134toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button[disabled="true"] {
cc4b0b0d
RK
1135 -moz-image-region: rect(32px, 48px, 48px, 32px);
1136}
1137
51994fad 1138#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button,
7d3f7f14 1139toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button {
43cc2806
RK
1140 -moz-image-region: rect(0px, 64px, 16px, 48px);
1141}
1142
51994fad 1143#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button:hover:not([disabled="true"]),
7d3f7f14 1144toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1145 -moz-image-region: rect(16px, 64px, 32px, 48px);
1146}
1147
51994fad 1148#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button[disabled="true"],
7d3f7f14 1149toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button[disabled="true"] {
cc4b0b0d
RK
1150 -moz-image-region: rect(32px, 64px, 48px, 48px);
1151}
1152
51994fad 1153#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button,
7d3f7f14 1154toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button {
43cc2806
RK
1155 -moz-image-region: rect(0px, 80px, 16px, 64px);
1156}
1157
51994fad 1158#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button:hover:not([disabled="true"]),
7d3f7f14 1159toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1160 -moz-image-region: rect(16px, 80px, 32px, 64px);
1161}
1162
51994fad 1163#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button[disabled="true"],
7d3f7f14 1164toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button[disabled="true"] {
cc4b0b0d
RK
1165 -moz-image-region: rect(32px, 80px, 48px, 64px);
1166}
1167
51994fad 1168#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button,
7d3f7f14 1169toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button {
43cc2806
RK
1170 -moz-image-region: rect(0px, 96px, 16px, 80px);
1171}
1172
51994fad 1173#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button:hover:not([disabled="true"]),
7d3f7f14 1174toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1175 -moz-image-region: rect(16px, 96px, 32px, 80px);
1176}
1177
51994fad 1178#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button[disabled="true"],
7d3f7f14 1179toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button[disabled="true"] {
cc4b0b0d
RK
1180 -moz-image-region: rect(32px, 96px, 48px, 80px);
1181}
1182
43cc2806
RK
1183/* === END menupanel.inc.css === */
1184
63ada306
RK
1185.toolbarbutton-1:not([type="menu-button"]) {
1186 -moz-box-orient: vertical;
1187}
1188
319c6529
RK
1189.toolbarbutton-1,
1190.toolbarbutton-1 > .toolbarbutton-menubutton-button {
c0f6797e
RK
1191/* min-width: 36px;
1192 min-height: 36px;*/
319c6529
RK
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
c0f6797e
RK
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 {
e20c83c3
RK
1216}
1217
c0f6797e
RK
1218.toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
1219.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
e20c83c3
RK
1220}
1221
c0f6797e
RK
1222toolbar .toolbarbutton-1 > .toolbarbutton-menu-dropmarker:-moz-lwtheme-brighttext,
1223toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker:-moz-lwtheme-brighttext {
319c6529
RK
1224}
1225
c0f6797e
RK
1226.toolbarbutton-1 > .toolbarbutton-icon,
1227.toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
319c6529
RK
1228}
1229
c0f6797e
RK
1230#nav-bar .toolbarbutton-1,
1231#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button {
319c6529
RK
1232}
1233
c0f6797e
RK
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 {
319c6529
RK
1237}
1238
c0f6797e
RK
1239#nav-bar #PanelUI-menu-button {
1240/* -moz-padding-start: 7px;
1241 -moz-padding-end: 5px;*/
319c6529
RK
1242}
1243
c0f6797e
RK
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;*/
319c6529
RK
1247}
1248
c0f6797e
RK
1249#nav-bar .toolbarbutton-1 > menupopup {
1250/* margin-top: -3px;*/
319c6529
RK
1251}
1252
c0f6797e 1253#nav-bar .toolbarbutton-1 > menupopup.cui-widget-panel {
c1d2ce3e 1254 margin-top: -4px;
319c6529
RK
1255}
1256
c0f6797e
RK
1257#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1258/* -moz-padding-end: 0;*/
319c6529
RK
1259}
1260
c0f6797e
RK
1261#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1262/* -moz-padding-start: 0;
1263 -moz-box-align: center;*/
319c6529
RK
1264}
1265
c0f6797e
RK
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,
46e71434 1271window:not([chromehidden~="toolbar"]) #urlbar-container > .toolbarbutton-1:-moz-any([disabled=true],:not([open]):not([disabled=true]):not(:active)) > .toolbarbutton-icon {
c0f6797e
RK
1272/* padding: 2px 6px;
1273 border: 1px solid;
1274 border-color: transparent;
1275 transition-property: background-color, border-color;
1276 transition-duration: 150ms;*/
d54f5b23 1277}
c0f6797e
RK
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;
d54f5b23 1283}
c0f6797e 1284*/
d54f5b23 1285
c0f6797e
RK
1286/* Help SDK icons fit: */
1287toolbarbutton[sdk-button="true"][cui-areatype="toolbar"] > .toolbarbutton-icon {
1288 width: 16px;
26125509
RK
1289}
1290
c0f6797e
RK
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;
26125509 1294}
26125509 1295
c0f6797e
RK
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;*/
319c6529
RK
1299}
1300
c0f6797e 1301#nav-bar .toolbarbutton-1 > .toolbarbutton-menu-dropmarker {
319c6529
RK
1302}
1303
c0f6797e 1304#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
319c6529
RK
1305}
1306
c0f6797e 1307#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
38cfeb47
RK
1308}
1309
c0f6797e
RK
1310#nav-bar .toolbaritem-combined-buttons {
1311/* margin-left: 2px;
1312 margin-right: 2px;*/
38cfeb47
RK
1313}
1314
c0f6797e
RK
1315#nav-bar .toolbaritem-combined-buttons > .toolbarbutton-1 {
1316/* padding-left: 0;
1317 padding-right: 0;*/
319c6529
RK
1318}
1319
c0f6797e
RK
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*/
319c6529
RK
1329}
1330
46e71434 1331window:not([chromehidden~="toolbar"]) #urlbar-container > .toolbarbutton-1:-moz-any([disabled=true],:not([open]):not([disabled=true]):not(:active)) > .toolbarbutton-icon {
319c6529
RK
1332}
1333
c0f6797e
RK
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,
46e71434
RK
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 {
319c6529
RK
1341}
1342
c0f6797e
RK
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 {
319c6529
RK
1348}
1349
c0f6797e
RK
1350#TabsToolbar .toolbarbutton-1,
1351#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
1352.tabbrowser-arrowscrollbox > .scrollbutton-up,
1353.tabbrowser-arrowscrollbox > .scrollbutton-down {
e8519ae0
RK
1354}
1355
c0f6797e
RK
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 {
e8519ae0
RK
1361}
1362
c0f6797e 1363/* unified back/forward button */
319c6529 1364
c0f6797e 1365#forward-button {
71bac478
RK
1366}
1367
c0f6797e
RK
1368#forward-button > menupopup {
1369 margin-top: 1px !important;
319c6529
RK
1370}
1371
c0f6797e
RK
1372#forward-button > .toolbarbutton-icon {
1373 background-clip: padding-box !important;
1374 /*mask: url(keyhole-forward-mask.svg#mask); XXX: this regresses twinopen */
5401f433 1375 /*clip-path: url(chrome://browser/content/browser.xul#keyhole-forward-clip-path) !important;*/
71bac478
RK
1376}
1377
c0f6797e
RK
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;
319c6529
RK
1385}
1386
c0f6797e
RK
1387#forward-button:-moz-locale-dir(rtl) {
1388 border-radius: 10000px 0 0 10000px;
8ad8bf83
RK
1389}
1390
fff8097b
RK
1391window:not([chromehidden~="toolbar"]) #urlbar-container:not([switchingtabs]) > #forward-button,
1392window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not([switchingtabs]) > #forward-button {
5401f433 1393 transition: opacity 150ms ease-out;
8ad8bf83
RK
1394}
1395
fff8097b
RK
1396window:not([chromehidden~="toolbar"]) #urlbar-container:not(:hover) > #forward-button[disabled=true],
1397window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled=true] {
8ad8bf83
RK
1398 opacity: 0;
1399}
1400
fff8097b
RK
1401window:not([chromehidden~="toolbar"]) #urlbar-container > #forward-button[occluded-by-urlbar],
1402window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[occluded-by-urlbar] {
c0f6797e 1403 visibility: hidden;
143c5409
RK
1404}
1405
c0f6797e
RK
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;
143c5409
RK
1418}
1419
c0f6797e 1420#back-button:-moz-locale-dir(rtl) {
319c6529
RK
1421}
1422
c0f6797e
RK
1423#back-button > menupopup {
1424 margin-top: -1px !important;
b36fc72e
RK
1425}
1426
c0f6797e
RK
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;
143c5409
RK
1435}
1436
c0f6797e
RK
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;*/
143c5409
RK
1440}
1441
c0f6797e
RK
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;*/
143c5409
RK
1446}
1447
c0f6797e
RK
1448#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
1449#forward-button:-moz-locale-dir(rtl) {
1450 transform: scaleX(-1);
143c5409 1451}
c0f6797e
RK
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;
6adbc9a6
RK
1456}
1457
c0f6797e
RK
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;
6adbc9a6
RK
1461}
1462
c0f6797e
RK
1463#home-button.bookmark-item {
1464 list-style-image: url("chrome://browser/skin/Toolbar.png");
6adbc9a6
RK
1465}
1466
c0f6797e
RK
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");
6adbc9a6
RK
1477}
1478
c0f6797e
RK
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");
6adbc9a6 1482}
c0f6797e 1483*/
6adbc9a6 1484
c0f6797e
RK
1485#downloads-button > .toolbarbutton-icon {
1486 margin: 0;
6adbc9a6
RK
1487}
1488
c0f6797e
RK
1489/* tabview button & menu item */
1490
6adbc9a6 1491#menu_tabview {
c0f6797e 1492 list-style-image: url("chrome://browser/skin/tabview/tabview.png");
6adbc9a6
RK
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
5401f433
RK
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
319c6529
RK
1522/* ::::: fullscreen window controls ::::: */
1523
8d7ef0d9 1524#window-controls {
ab799a7a
RK
1525 -moz-margin-start: 4px;
1526}
1527
319c6529
RK
1528#minimize-button,
1529#restore-button,
1530#close-button {
c0f6797e
RK
1531/* list-style-image: url("chrome://global/skin/icons/windowControls.png");
1532 padding: 0; */
319c6529
RK
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
319c6529
RK
1561#urlbar,
1562.searchbar-textbox {
1563 border-radius: 5px;
1564 margin: 0;
1565 -moz-margin-start: 3px;
1566}
1567
ffce2402 1568#urlbar {
f0071a71
RK
1569 /* make color as light as possible to deal with dark non-domain parts */
1570 color: #FFBFFF;
ffce2402
RK
1571}
1572
319c6529
RK
1573#urlbar:-moz-lwtheme,
1574.searchbar-textbox:-moz-lwtheme {
1575 /* background-color: rgba(255,255,255,.8);
1576 @navbarTextboxCustomBorder@
1577 color: black; */
1578}
1579
c0f6797e
RK
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
fff8097b
RK
1590window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper,
1591window:not([chromehidden~="toolbar"]) #urlbar-wrapper {
e8519ae0
RK
1592 padding-left: 22px;
1593 -moz-margin-start: -22px;
8ad8bf83
RK
1594 position: relative;
1595 pointer-events: none;
1596}
1597
fff8097b
RK
1598window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar,
1599window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar {
e8519ae0
RK
1600/* -moz-border-start: none;
1601 margin-left: 0; */
8ad8bf83
RK
1602 pointer-events: all;
1603}
1604
fff8097b
RK
1605window:not([chromehidden~="toolbar"]) #urlbar-container:not([switchingtabs]) > #urlbar-wrapper > #urlbar,
1606window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not([switchingtabs]) > #urlbar {
71a617ff 1607 transition: margin-left 150ms ease-out;
8ad8bf83
RK
1608}
1609
fff8097b
RK
1610window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(ltr),
1611window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(ltr) {
e8519ae0
RK
1612/* border-top-left-radius: 0;
1613 border-bottom-left-radius: 0; */
8ad8bf83
RK
1614}
1615
fff8097b
RK
1616window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl),
1617window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) {
e8519ae0
RK
1618/* border-top-right-radius: 0;
1619 border-bottom-right-radius: 0; */
8ad8bf83
RK
1620}
1621
fff8097b
RK
1622window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper,
1623window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled] {
5401f433 1624/* clip-path: url("chrome://browser/content/browser.xul#urlbar-back-button-clip-path");*/
c0f6797e
RK
1625}
1626
fff8097b
RK
1627window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar,
1628window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled] > #urlbar {
e8519ae0 1629 margin-left: -22px;
8ad8bf83
RK
1630}
1631
fff8097b
RK
1632window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:hover:not([switchingtabs]) > #urlbar-wrapper > #urlbar,
1633window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled]:hover:not([switchingtabs]) > #urlbar {
8ad8bf83 1634 /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */
71a617ff 1635 transition-delay: 100s;
8ad8bf83
RK
1636}
1637
fff8097b
RK
1638window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled]:not(:hover) > #urlbar-wrapper > #urlbar,
1639window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled]:not(:hover) > #urlbar {
8ad8bf83 1640 /* when not hovered anymore, trigger a new transition to hide the forward button immediately */
e8519ae0 1641 margin-left: -22.01px;
8ad8bf83
RK
1642}
1643
26125509 1644window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper:-moz-locale-dir(rtl),
fff8097b
RK
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) {
c0f6797e 1648 /* let windows-urlbar-back-button-mask clip the urlbar's right side for RTL */
71a617ff 1649 transform: scaleX(-1);
8ad8bf83
RK
1650}
1651
a7145e95
RK
1652html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
1653.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
319c6529
RK
1654 color: #E7ADE7;
1655}
1656
319c6529
RK
1657#urlbar-container {
1658 -moz-box-orient: horizontal;
1659 -moz-box-align: stretch;
1660}
1661
9abeb12c
RK
1662.urlbar-textbox-container {
1663 -moz-box-align: stretch;
1664}
1665
a40f6a79
RK
1666.urlbar-input-box {
1667 -moz-margin-start: 0;
1668}
1669
319c6529 1670#urlbar-icons {
319c6529
RK
1671 -moz-box-align: center;
1672}
1673
1674.urlbar-icon {
b8384c33 1675 padding: 0 2px;
ffce2402
RK
1676}
1677
1678.searchbar-engine-button,
1679.search-go-container {
4b686546
RK
1680 padding: 2px;
1681}
1682
1683.search-go-container > .search-go-button {
1684 padding: 0;
319c6529
RK
1685}
1686
ffce2402
RK
1687.urlbar-icon:hover {
1688}
1689
1690.urlbar-icon[open="true"],
1691.urlbar-icon:hover:active {
1692}
1693
319c6529
RK
1694#urlbar-search-splitter {
1695 min-width: 6px;
1696 -moz-margin-start: -3px;
1697 border: none;
1698 background: transparent;
1699}
1700
f0071a71 1701#urlbar-search-splitter + #urlbar-container > #urlbar,
319c6529
RK
1702#urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox {
1703 -moz-margin-start: 0;
1704}
1705
e20c83c3
RK
1706#urlbar-display-box {
1707}
1708
319c6529 1709#urlbar-display {
319c6529
RK
1710 -moz-border-end: 1px solid #9C9CFF;
1711 -moz-margin-end: 3px;
ab799a7a
RK
1712 margin-top: 0;
1713 margin-bottom: 0;
a40f6a79 1714 -moz-margin-start: 0;
ab799a7a
RK
1715 color: #8050B0;
1716}
1717
26125509
RK
1718#search-container {
1719 min-width: calc(54px + 11ch);
1720}
1721
319c6529
RK
1722/* identity box */
1723
1724#identity-box {
319c6529 1725 border-radius: 2px;
85cfb236 1726 font-size: .9em;
319c6529
RK
1727}
1728
e20c83c3
RK
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
8ad8bf83 1739#notification-popup-box:not([hidden]) + #identity-box {
5517da5a 1740 -moz-padding-start: 10px !important;
8ad8bf83
RK
1741 border-radius: 0;
1742}
1743
fff8097b
RK
1744window:not([chromehidden~="toolbar"]) #urlbar-container > #urlbar-wrapper > #urlbar > #identity-box,
1745window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box {
d15d08bf 1746/* border-radius: 0; */
2a5b7882
RK
1747 -moz-padding-start: 2px;
1748 -moz-padding-end: 2px;
1749 -moz-margin-end: 1px;
8ad8bf83
RK
1750}
1751
26125509 1752window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar >
fff8097b
RK
1753 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr),
1754window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled] > #urlbar >
26125509 1755 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
2a5b7882 1756 padding-left: 2px;
71a617ff 1757 transition: padding-left;
8ad8bf83
RK
1758}
1759
fff8097b
RK
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 >
26125509 1763 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
2a5b7882 1764 padding-right: 2px;
71a617ff 1765 transition: padding-right;
8ad8bf83
RK
1766}
1767
fff8097b
RK
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 >
26125509 1771 #notification-popup-box[hidden] + #identity-box {
8ad8bf83 1772 /* forward button hiding is delayed when hovered */
71a617ff 1773 transition-delay: 100s;
8ad8bf83
RK
1774}
1775
fff8097b
RK
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 >
26125509 1779 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
8ad8bf83 1780 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
2a5b7882 1781 padding-left: 2.01px;
8ad8bf83
RK
1782}
1783
fff8097b
RK
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 >
26125509 1787 #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
8ad8bf83 1788 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
2a5b7882 1789 padding-right: 2.01px;
8ad8bf83
RK
1790}
1791
56859d76
RK
1792#urlbar[pageproxystate="valid"] > #identity-box.chromeUI,
1793#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
a40f6a79 1794 -moz-margin-end: 3px;
319c6529
RK
1795}
1796
56859d76 1797#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:-moz-locale-dir(ltr),
37953ab4 1798#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(ltr) {
a40f6a79
RK
1799 border-top-right-radius: 0;
1800 border-bottom-right-radius: 0;
319c6529
RK
1801}
1802
56859d76 1803#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:-moz-locale-dir(rtl),
37953ab4 1804#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:-moz-locale-dir(rtl) {
a40f6a79
RK
1805 border-top-left-radius: 0;
1806 border-bottom-left-radius: 0;
319c6529
RK
1807}
1808
a40f6a79
RK
1809#identity-box.verifiedIdentity:not(:-moz-lwtheme) {
1810 background-color: #000000;
319c6529
RK
1811}
1812
1813#identity-box:-moz-focusring {
1814 outline: 1px dotted #008484;
f993773d 1815 outline-offset: -1px;
319c6529
RK
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;
319c6529
RK
1826}
1827
1828/* Location bar dropmarker */
1829
38cfeb47 1830.urlbar-history-dropmarker:not(:hover):not([open="true"]) {
319c6529 1831 background-color: transparent;
319c6529
RK
1832}
1833
00f971bc
RK
1834#urlbar-container[combined="true"] > #urlbar > .urlbar-history-dropmarker,
1835#urlbar-wrapper > #urlbar > .urlbar-history-dropmarker {
38cfeb47
RK
1836 border: none;
1837 border-radius: 0px;
319c6529
RK
1838}
1839
ffce2402
RK
1840.urlbar-history-dropmarker:hover {
1841}
1842
1843.urlbar-history-dropmarker:hover:active,
1844.urlbar-history-dropmarker[open="true"] {
1845}
1846
319c6529
RK
1847/* page proxy icon */
1848
e7c8bab1
RK
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
4d58ff64 1871#page-proxy-favicon {
319c6529
RK
1872 width: 16px;
1873 height: 16px;
a40f6a79 1874 list-style-image: url("chrome://browser/skin/identity-icons-generic.png");
00f971bc 1875 margin: 2px;
e7c8bab1
RK
1876}
1877
1878.chromeUI > #page-proxy-favicon[pageproxystate="valid"] {
1879 list-style-image: url("chrome://branding/content/identity-icons-brand.png");
319c6529
RK
1880}
1881
2a5b7882 1882.verifiedDomain > #page-proxy-favicon[pageproxystate="valid"] {
a40f6a79
RK
1883 list-style-image: url("chrome://browser/skin/identity-icons-https.png");
1884}
1885
2a5b7882 1886.verifiedIdentity > #page-proxy-favicon[pageproxystate="valid"] {
a40f6a79
RK
1887 list-style-image: url("chrome://browser/skin/identity-icons-https-ev.png");
1888}
1889
56ab361a
RK
1890.mixedActiveContent > #page-proxy-favicon[pageproxystate="valid"] {
1891 list-style-image: url("chrome://browser/skin/identity-icons-https-mixed-active.png");
1892}
1893
e7c8bab1
RK
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
fff8097b
RK
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 {
c0f6797e
RK
1929/* -moz-margin-end: 1px;*/
1930}
1931
2a5b7882 1932#identity-box:hover > #page-proxy-favicon {
a40f6a79
RK
1933 -moz-image-region: rect(0, 32px, 16px, 16px);
1934}
1935
2a5b7882
RK
1936#identity-box:hover:active > #page-proxy-favicon,
1937#identity-box[open=true] > #page-proxy-favicon {
a40f6a79 1938 -moz-image-region: rect(0, 48px, 16px, 32px);
acb0e9b8 1939}
1940
2a5b7882
RK
1941#identity-box:hover {
1942 background-color: #FFCF00;
7092015d 1943 color: #000000;
2a5b7882
RK
1944}
1945
1946#identity-box:hover:active,
1947#identity-box[open=true] {
1948 background-color: #FF9F00;
7092015d 1949 color: #000000;
2a5b7882
RK
1950}
1951
56859d76
RK
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
387e6560
RK
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] {
2a5b7882
RK
1962 background-color: #008484;
1963 color: #000000;
1964}
1965
319c6529
RK
1966/* autocomplete */
1967
319c6529
RK
1968#treecolAutoCompleteImage {
1969 max-width: 36px;
1970}
acb0e9b8 1971
319c6529
RK
1972.ac-result-type-bookmark,
1973.autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
71bac478 1974 list-style-image: url("chrome://browser/skin/places/bookmark.png");
319c6529 1975 -moz-image-region: rect(0px 16px 16px 0px);
c1f7cc84 1976 width: 16px;
319c6529 1977 height: 16px;
acb0e9b8 1978}
1979
c0f6797e
RK
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
319c6529
RK
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);
acb0e9b8 1989 width: 16px;
1990 height: 16px;
1991}
1992
319c6529
RK
1993.ac-result-type-tag,
1994.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
8da9da4e 1995 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
c1f7cc84 1996 width: 16px;
319c6529
RK
1997 height: 16px;
1998}
acb0e9b8 1999
319c6529 2000.ac-comment {
c0f6797e 2001 font-size: 1.06em;
acb0e9b8 2002}
319c6529
RK
2003
2004.ac-extra > .ac-comment {
c0f6797e 2005 font-size: 1em;
acb0e9b8 2006}
319c6529
RK
2007
2008.ac-url-text,
2009.ac-action-text {
c0f6797e 2010 font-size: 1em;
319c6529 2011 color: #9C9CFF;
acb0e9b8 2012}
319c6529
RK
2013
2014richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
2015 list-style-image: url("chrome://browser/skin/actionicon-tab.png");
85cfb236
RK
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);
acb0e9b8 2022}
2023
319c6529
RK
2024.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
2025 color: #8050B0;
2026}
acb0e9b8 2027
319c6529
RK
2028.ac-comment[selected="true"],
2029.ac-url-text[selected="true"],
2030.ac-action-text[selected="true"] {
2031 color: inherit !important;
acb0e9b8 2032}
2033
c1f7cc84
RK
2034.autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
2035.autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
319c6529
RK
2036{
2037 color: #8050B0;
2038 font-size: smaller;
acb0e9b8 2039}
319c6529
RK
2040
2041.autocomplete-treebody::-moz-tree-cell(suggesthint) {
2042 border-top: 1px solid #9C9CFF;
acb0e9b8 2043}
2044
319c6529
RK
2045/* combined go/reload/stop button in location bar */
2046
2047#urlbar > toolbarbutton {
9abeb12c 2048 -moz-margin-start: 0;
ffce2402 2049 padding: 0 2px;
319c6529
RK
2050 background-origin: border-box;
2051 border: none;
c0f6797e 2052 list-style-image: url("chrome://browser/skin/reload-stop-go.png");
9abeb12c
RK
2053 -moz-border-start: 1px solid #9C9CFF;
2054}
2055
2056#urlbar:-moz-locale-dir(ltr) > toolbarbutton {
38cfeb47
RK
2057 border-top-left-radius: 0px;
2058 border-bottom-left-radius: 0px;
acb0e9b8 2059}
acb0e9b8 2060
9abeb12c 2061#urlbar:-moz-locale-dir(rtl) > toolbarbutton {
38cfeb47
RK
2062 border-top-right-radius: 0px;
2063 border-bottom-right-radius: 0px;
9abeb12c
RK
2064}
2065
46e71434 2066#urlbar > toolbarbutton:not([disabled=true]):active:hover,
dce90fef
RK
2067#urlbar-reload-button:not(:hover) {
2068 -moz-border-start-style: none;
714b11f6 2069 -moz-padding-start: 3px;
dce90fef
RK
2070}
2071
c0f6797e
RK
2072#urlbar-reload-button {
2073 -moz-image-region: rect(0px, 14px, 14px, 0px);
acb0e9b8 2074}
2075
46e71434 2076#urlbar-reload-button[disabled=true] {
c0f6797e 2077 -moz-image-region: rect(28px, 14px, 42px, 0px);
acb0e9b8 2078}
2079
46e71434 2080#urlbar-reload-button:not([disabled=true]):hover {
c0f6797e 2081 -moz-image-region: rect(14px, 14px, 28px, 0px);
ffce2402
RK
2082}
2083
c0f6797e
RK
2084#urlbar-reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
2085 transform: scaleX(-1);
acb0e9b8 2086}
2087
c0f6797e
RK
2088#urlbar-go-button {
2089 -moz-image-region: rect(0, 42px, 14px, 28px);
38cfeb47
RK
2090}
2091
fff8097b 2092#urlbar-go-button:hover {
c0f6797e 2093 -moz-image-region: rect(14px, 42px, 28px, 28px);
acb0e9b8 2094}
2095
c0f6797e
RK
2096#urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
2097 transform: scaleX(-1);
acb0e9b8 2098}
319c6529
RK
2099
2100#urlbar-stop-button {
ffce2402 2101 -moz-image-region: rect(0px, 28px, 14px, 14px);
acb0e9b8 2102}
319c6529
RK
2103
2104#urlbar-stop-button:hover {
ffce2402 2105 -moz-image-region: rect(14px, 28px, 28px, 14px);
acb0e9b8 2106}
2107
319c6529
RK
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);
acb0e9b8 2113}
319c6529 2114
71bac478 2115#page-report-button:hover ,
319c6529
RK
2116#page-report-button:hover:active,
2117#page-report-button[open="true"] {
71bac478 2118 -moz-image-region: rect(0, 32px, 16px, 16px);
acb0e9b8 2119}
2120
c4460289
RK
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
c4460289
RK
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
5a199ba1
RK
2165toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
2166 width: auto;
2167 height: auto;
2168 max-width: 32px;
2169 max-height: 24px;
2170}
2171
c4460289
RK
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;
c4460289
RK
2188 /* we resize our panels dynamically, make it look nice */
2189 transition: height 100ms ease-out, width 100ms ease-out;
2190}
2191
e2734cc7
RK
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) {
c4460289
RK
2200 border-top-left-radius: inherit;
2201 border-bottom-left-radius: inherit;
e2734cc7
RK
2202 border-top-right-radius: 0;
2203 border-bottom-right-radius: 0;
c4460289
RK
2204}
2205
e2734cc7
RK
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) {
c4460289
RK
2217 border-top-left-radius: inherit;
2218 border-bottom-left-radius: inherit;
2219}
2220
e2734cc7
RK
2221#social-share-provider-buttons:-moz-locale-dir(rtl) {
2222 border-top-right-radius: inherit;
2223 border-bottom-right-radius: inherit;
2224}
2225
889649fd
RK
2226/* social recommending panel */
2227
a6757852 2228#social-mark-button {
d7cfd768 2229 -moz-image-region: rect(0, 16px, 16px, 0);
889649fd
RK
2230}
2231
c0f6797e 2232/* bookmarks menu-button */
319c6529 2233
c0f6797e
RK
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);
acb0e9b8 2237}
319c6529 2238
c0f6797e
RK
2239#bookmarks-menu-button.bookmark-item[starred] {
2240 -moz-image-region: rect(0px 32px 16px 16px);
acb0e9b8 2241}
319c6529 2242
c0f6797e
RK
2243#bookmarks-menu-button.bookmark-item > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
2244 -moz-margin-start: 5px;
acb0e9b8 2245}
2246
c0f6797e
RK
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;
71bac478
RK
2250}
2251
c0f6797e
RK
2252#BMB_bookmarksPopup[side="top"],
2253#BMB_bookmarksPopup[side="bottom"] {
2254 margin-left: -20px;
2255 margin-right: -20px;
71bac478
RK
2256}
2257
c0f6797e
RK
2258#BMB_bookmarksPopup[side="left"],
2259#BMB_bookmarksPopup[side="right"] {
2260 margin-top: -20px;
2261 margin-bottom: -20px;
acb0e9b8 2262}
319c6529
RK
2263
2264/* bookmarking panel */
c0f6797e 2265
319c6529
RK
2266#editBookmarkPanelStarIcon {
2267 list-style-image: url("chrome://browser/skin/places/starred48.png");
2268 width: 48px;
2269 height: 48px;
acb0e9b8 2270}
319c6529
RK
2271
2272#editBookmarkPanelStarIcon[unstarred] {
2273 list-style-image: url("chrome://browser/skin/places/unstarred48.png");
acb0e9b8 2274}
2275
319c6529
RK
2276#editBookmarkPanelTitle {
2277 font-size: 130%;
acb0e9b8 2278}
319c6529
RK
2279
2280#editBookmarkPanelHeader,
2281#editBookmarkPanelContent {
2282 margin-bottom: .5em;
acb0e9b8 2283}
319c6529
RK
2284
2285/* Implements editBookmarkPanel resizing on folderTree un-collapse. */
2286#editBMPanel_folderTree {
2287 min-width: 27em;
acb0e9b8 2288}
2289
f993773d 2290.panel-promo-box {
46e71434
RK
2291 margin: 5px 0 -6px;
2292 padding: 5px 0;
889649fd 2293 border-top: 1px solid #9C9CFF;
f0eab82c
RK
2294 border-bottom-left-radius: 5px;
2295 border-bottom-right-radius: 5px;
f993773d
RK
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");
f0eab82c
RK
2306 -moz-margin-end: -3px;
2307 margin-top: -3px;
f993773d
RK
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
319c6529
RK
2323/* ::::: content area ::::: */
2324
2325#sidebar {
2326 background-color: Window;
acb0e9b8 2327}
319c6529
RK
2328
2329#sidebar-title {
2330 -moz-padding-start: 0px;
acb0e9b8 2331}
319c6529 2332
fe524e0c
RK
2333.browserContainer > findbar {
2334/*
2335 background-color: -moz-dialog;
2336 color: -moz-DialogText;
2337*/
2338}
2339
319c6529 2340/* Tabstrip */
b36fc72e 2341
c0f6797e 2342#TabsToolbar {
e20c83c3
RK
2343 min-height: 0;
2344 padding: 0;
2345 -moz-binding: url("chrome://browser/content/customizableui/toolbar.xml#toolbar");
2346}
2347
b36fc72e 2348#TabsToolbar .toolbar-holder {
c1f7cc84 2349 background-color: #000000; /* correct effect of being an actual toolbar */
acb0e9b8 2350}
2351
b36fc72e 2352#main-window[disablechrome] #TabsToolbar,
319c6529 2353#TabsToolbar[tabsontop="false"] {
8b5fc82e 2354 border-bottom: 1px solid #008484;
acb0e9b8 2355}
319c6529 2356
c0f6797e 2357#main-window:not([customizing]) #TabsToolbar:not(:-moz-lwtheme) {
45dc7657 2358}
c0f6797e
RK
2359
2360#main-window[tabsintitlebar] #TabsToolbar {
2361 background-color: transparent;
2362}
2363
6dc70335
RK
2364/* === BEGIN tabs.inc.css === */
2365
319c6529 2366.tabbrowser-tab,
43ee1307
RK
2367.tabs-newtab-button,
2368#TabsToolbar > #new-tab-button {
319c6529 2369 margin-top: 0px;
acb0e9b8 2370}
319c6529 2371
43ee1307 2372.tabbrowser-tab {
57fc408c
RK
2373 padding: 1px 4px 2px;
2374}
2375
2376.tabbrowser-tab:first-of-type {
2377 -moz-margin-start: 2px;
2378}
2379
43ee1307
RK
2380.tabs-newtab-button,
2381#TabsToolbar > #new-tab-button {
57fc408c
RK
2382 border-radius: 8px 8px 0px 0px;
2383 -moz-margin-start: 0;
2384}
2385
43ee1307
RK
2386.tabs-newtab-button:not(:hover),
2387#TabsToolbar > #new-tab-button:not(:hover) {
57fc408c
RK
2388 background-color: #C09070;
2389}
2390
fe524e0c
RK
2391.tabbrowser-tab[remote] {
2392 text-decoration: underline;
2393}
2394
c0f6797e
RK
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;*/
acb0e9b8 2399}
2400
c0f6797e 2401.tab-background-middle {
acb0e9b8 2402}
2403
c0f6797e 2404.tab-content {
acb0e9b8 2405}
319c6529 2406
46e71434 2407.tab-/*throbber*/,
c0f6797e
RK
2408.tab-icon-image,
2409.tab-close-button {
acb0e9b8 2410}
2411
319c6529
RK
2412.tab-throbber,
2413.tab-icon-image {
319c6529 2414 height: 16px;
c0f6797e
RK
2415 width: 16px;
2416}
2417
2418.tab-icon-image {
dce90fef 2419 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
613daf44 2420}
2421
319c6529 2422.tab-throbber {
95f333af 2423 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim-connect.png");
613daf44 2424}
319c6529
RK
2425
2426.tab-throbber[progress] {
95f333af 2427 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
613daf44 2428}
319c6529 2429
c0f6797e
RK
2430.tab-throbber:not([pinned]),
2431.tab-icon-image:not([pinned]) {
2432 -moz-margin-end: 3px;
2433}
2434
319c6529
RK
2435.tab-throbber[pinned],
2436.tab-icon-image[pinned] {
2437 -moz-margin-start: 2px;
2438 -moz-margin-end: 2px;
613daf44 2439}
319c6529 2440
c0f6797e
RK
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
319c6529 2469/* tabbrowser-tab focus ring */
c0f6797e 2470.tabbrowser-tab:focus {
319c6529 2471 outline: 1px dotted;
613daf44 2472}
319c6529 2473
c0f6797e
RK
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
8ad8bf83 2522/* Tab DnD indicator */
319c6529
RK
2523.tab-drop-indicator {
2524 list-style-image: url("chrome://browser/skin/tabbrowser/tabDragIndicator.png");
9abeb12c 2525 margin-bottom: -11px;
613daf44 2526}
2527
319c6529
RK
2528/* Tab close button */
2529.tab-close-button {
319c6529
RK
2530 list-style-image: url("chrome://global/skin/icons/close-button.gif");
2531}
acb0e9b8 2532
319c6529
RK
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");
acb0e9b8 2536}
319c6529
RK
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");
acb0e9b8 2541}
319c6529 2542
319c6529
RK
2543/* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */
2544
319c6529
RK
2545.tabbrowser-arrowscrollbox > .scrollbutton-up,
2546.tabbrowser-arrowscrollbox > .scrollbutton-down {
319c6529
RK
2547 margin: 0;
2548 padding-top: 0;
2549 padding-bottom: 0;
c0f6797e
RK
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 }
b7f3670c 2558
c0f6797e
RK
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;
acb0e9b8 2570}
319c6529 2571
319c6529
RK
2572.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
2573 background-color: #008484;
acb0e9b8 2574}
319c6529 2575
c0f6797e
RK
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
319c6529
RK
2583.tabs-newtab-button > .toolbarbutton-icon {
2584 margin-top: -1px;
2585 margin-bottom: -1px;
acb0e9b8 2586}
319c6529
RK
2587
2588.tabs-newtab-button,
2589#TabsToolbar > #new-tab-button,
e20c83c3
RK
2590#TabsToolbar > toolbarpaletteitem > #new-tab-button,
2591#TabsToolbar > toolbarpaletteitem > #new-tab-button[cui-areatype="toolbar"] {
38cfeb47 2592 list-style-image: url("chrome://browser/skin/tabbrowser/newtab.png");
319c6529 2593 -moz-image-region: rect(0, 16px, 18px, 0);
acb0e9b8 2594}
2595
8b5fc82e 2596.tabs-newtab-button,
38cfeb47 2597.tabs-newtab-button:hover,
c0f6797e 2598#TabsToolbar > #new-tab-button,
38cfeb47 2599#TabsToolbar > #new-tab-button:hover {
319c6529 2600 -moz-image-region: rect(0, 32px, 18px, 16px);
acb0e9b8 2601}
319c6529 2602
c0f6797e
RK
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 {
acb0e9b8 2609}
2610
c0f6797e
RK
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");
acb0e9b8 2617}
319c6529 2618
f9fc08c7
RK
2619#alltabs-button:hover,
2620#alltabs-button:hover:active,
2621#alltabs-button[open="true"] {
8da9da4e 2622 list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
acb0e9b8 2623}
319c6529 2624
c0f6797e
RK
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
319c6529
RK
2637/* All tabs menupopup */
2638.alltabs-item > .menu-iconic-left > .menu-iconic-icon {
dce90fef 2639 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
8da9da4e 2640 -moz-image-region: auto;
acb0e9b8 2641}
2642
319c6529
RK
2643.alltabs-item[selected="true"] {
2644 font-weight: bold;
acb0e9b8 2645}
319c6529
RK
2646
2647.alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon {
2648 list-style-image: url("chrome://global/skin/icons/loading.gif");
acb0e9b8 2649}
319c6529 2650
85cfb236 2651.alltabs-item[tabIsVisible]:not([_moz-menuactive="true"]) {
b1234db8
RK
2652 background-color: #402800;
2653}
2654
319c6529
RK
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");
acb0e9b8 2661}
2662
b36fc72e
RK
2663.tabs-closebutton > .toolbarbutton-icon {
2664}
2665
8da9da4e
RK
2666.tabs-closebutton > .toolbarbutton-text {
2667 display: none;
2668}
2669
319c6529
RK
2670.tabs-closebutton:hover,
2671.tabs-closebutton:hover:active {
2672 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
acb0e9b8 2673}
319c6529
RK
2674
2675toolbarbutton.chevron {
2676 list-style-image: url("chrome://global/skin/toolbar/chevron.gif") !important;
acb0e9b8 2677}
319c6529
RK
2678
2679toolbarbutton.chevron:hover {
2680 list-style-image: url("chrome://global/skin/toolbar/chevron-hover.gif") !important;
acb0e9b8 2681}
2682
319c6529
RK
2683toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon,
2684toolbarbutton.chevron:-moz-locale-dir(rtl):hover > .toolbarbutton-icon {
71a617ff 2685 transform: scaleX(-1);
acb0e9b8 2686}
319c6529
RK
2687
2688toolbarbutton.chevron > .toolbarbutton-text,
2689toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
2690 display: none;
acb0e9b8 2691}
319c6529
RK
2692
2693toolbarbutton.chevron > .toolbarbutton-icon {
2694 margin: 0;
acb0e9b8 2695}
2696
319c6529
RK
2697#sidebar-throbber[loading="true"] {
2698 list-style-image: url("chrome://global/skin/icons/loading.gif");
2699 -moz-margin-end: 4px;
acb0e9b8 2700}
319c6529
RK
2701
2702/* Bookmarks toolbar */
2703#PlacesToolbarDropIndicator {
8da9da4e 2704 list-style-image: url("chrome://communicator/skin/bookmarks/toolbarDropMarker.png");
acb0e9b8 2705}
2706
319c6529
RK
2707toolbarbutton.bookmark-item[dragover="true"][open="true"] {
2708 background-color: #008484 !important;
2709 color: #FFCF00 !important;
613daf44 2710}
319c6529
RK
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;
613daf44 2718}
319c6529
RK
2719
2720.menupopup-drop-indicator {
2721 list-style-image: none;
2722 height: 2px;
2723 -moz-margin-end: -4em;
2724 background-color: #008484;
613daf44 2725}
2726
319c6529
RK
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);
613daf44 2736}
319c6529
RK
2737
2738#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
2739 -moz-image-region: rect(64px, 64px, 128px, 0px);
613daf44 2740}
319c6529
RK
2741
2742#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
2743 -moz-image-region: rect(128px, 64px, 192px, 0px);
613daf44 2744}
2745
319c6529
RK
2746/* Popup Body Text */
2747.identity-popup-description {
2748 white-space: pre-wrap;
2749 -moz-padding-start: 15px;
2750 margin: 2px 0 4px;
613daf44 2751}
319c6529
RK
2752
2753.identity-popup-label {
2754 white-space: pre-wrap;
2755 -moz-padding-start: 15px;
2756 margin: 0;
613daf44 2757}
319c6529 2758
5517da5a 2759#identity-popup-content-host,
319c6529
RK
2760#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner {
2761 font-size: 1.2em;
613daf44 2762}
2763
319c6529
RK
2764#identity-popup-content-host {
2765 margin-top: 3px;
2766 margin-bottom: 5px;
2767 font-weight: bold;
2768 max-width: 300px;
2769}
613daf44 2770
319c6529
RK
2771#identity-popup-content-owner {
2772 margin-top: 4px;
2773 margin-bottom: 0 !important;
2774 font-weight: bold;
2775 max-width: 300px;
2776}
613daf44 2777
319c6529
RK
2778.verifiedDomain > #identity-popup-content-owner {
2779 font-weight: normal;
613daf44 2780}
2781
319c6529
RK
2782#identity-popup-content-verifier {
2783 margin: 4px 0 2px;
613daf44 2784}
2785
319c6529
RK
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;
613daf44 2790}
2791
319c6529
RK
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");
613daf44 2795}
2796
3a0880a9
RK
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
319c6529
RK
2815#identity-popup-more-info-button {
2816 margin-top: 6px;
2817 margin-bottom: 0;
2818 -moz-margin-end: 0;
613daf44 2819}
acb0e9b8 2820
fe524e0c
RK
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
319c6529
RK
2836.popup-notification-icon {
2837 width: 64px;
2838 height: 64px;
2839 -moz-margin-end: 10px;
2840}
acb0e9b8 2841
319c6529
RK
2842.popup-notification-icon[popupid="geolocation"] {
2843 list-style-image: url("chrome://browser/skin/Geolocation-64.png");
acb0e9b8 2844}
2845
319c6529
RK
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"],
a40f6a79 2851.popup-notification-icon[popupid="addon-install-complete"] {
319c6529
RK
2852 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
2853 width: 32px;
2854 height: 32px;
acb0e9b8 2855}
319c6529 2856
a40f6a79 2857.popup-notification-icon[popupid="click-to-play-plugins"] {
fcfb76ce 2858 list-style-image: url("chrome://mozapps/skin/plugins/pluginBlocked-64.png");
a40f6a79
RK
2859}
2860
a6757852
RK
2861.popup-notification-icon[popupid="plugins-not-found"] {
2862 list-style-image: url("chrome://browser/skin/pluginInstall-64.png");
2863}
2864
82b4252f
RK
2865.popup-notification-icon[popupid="web-notifications"] {
2866 list-style-image: url("chrome://browser/skin/notification-64.png");
2867}
2868
319c6529
RK
2869.addon-progress-description {
2870 width: 350px;
2871 max-width: 350px;
acb0e9b8 2872}
319c6529
RK
2873
2874.popup-progress-label,
2875.popup-progress-meter {
2876 -moz-margin-start: 0;
2877 -moz-margin-end: 0;
acb0e9b8 2878}
319c6529
RK
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);
acb0e9b8 2890}
319c6529
RK
2891
2892.popup-progress-cancel:hover {
2893 -moz-image-region: rect(16px, 32px, 32px, 16px);
acb0e9b8 2894}
2895
319c6529
RK
2896.popup-progress-cancel:active {
2897 -moz-image-region: rect(32px, 32px, 48px, 16px);
2898}
acb0e9b8 2899
319c6529 2900.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
a6757852 2901.popup-notification-icon[popupid="indexedDB-quota-prompt"],
e2734cc7
RK
2902.popup-notification-icon[popupid*="offline-app-requested"],
2903.popup-notification-icon[popupid="offline-app-usage"] {
319c6529 2904 list-style-image: url("chrome://global/skin/icons/alert-question.gif");
acb0e9b8 2905}
2906
319c6529
RK
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");
acb0e9b8 2910}
2911
1b13529a 2912.popup-notification-icon[popupid="webapps-install-progress"],
8d7ef0d9 2913.popup-notification-icon[popupid="webapps-install"] {
87a1144f 2914 list-style-image: url("chrome://global/skin/icons/webapps-64.png");
8d7ef0d9
RK
2915}
2916
56ab361a
RK
2917.popup-notification-icon[popupid="mixed-content-blocked"] {
2918 list-style-image: url("chrome://browser/skin/mixed-content-blocked-64.png");
2919}
2920
0142a07b 2921.popup-notification-icon[popupid="webRTC-sharingDevices"],
7bc075b6
RK
2922.popup-notification-icon[popupid="webRTC-shareDevices"] {
2923 list-style-image: url("chrome://browser/skin/webRTC-shareDevice-64.png");
2924}
2925
c1d2ce3e
RK
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
82b4252f
RK
2931.popup-notification-icon[popupid="pointerLock"] {
2932 list-style-image: url("chrome://browser/skin/pointerLock-64.png");
2933}
2934
319c6529
RK
2935/* Notification icon box */
2936#notification-popup-box {
f993773d
RK
2937 position: relative;
2938 background-color: #000000;
2939 background-clip: padding-box;
2940 padding-left: 3px;
5517da5a 2941 padding-right: 8px;
f0eab82c 2942 border-radius: 3px 0 0 3px;
82b4252f 2943 border-image: url("chrome://browser/skin/urlbar-arrow.png") 0 8 0 0 / 0 8px 0 0;
f993773d 2944 -moz-margin-end: -8px;
5517da5a 2945 border-right-width: 8px;
f993773d
RK
2946}
2947
fff8097b
RK
2948window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlbar-wrapper > #urlbar > #notification-popup-box,
2949window:not([chromehidden~="toolbar"]) #urlbar-wrapper[forwarddisabled] > #urlbar > #notification-popup-box {
5517da5a 2950/* padding-left: 5px; */
f993773d
RK
2951}
2952
2953#notification-popup-box:-moz-locale-dir(rtl),
2954.notification-anchor-icon:-moz-locale-dir(rtl) {
71a617ff 2955 transform: scaleX(-1);
319c6529 2956}
acb0e9b8 2957
319c6529 2958.notification-anchor-icon {
acb0e9b8 2959 width: 16px;
2960 height: 16px;
85cfb236 2961 margin: 0 2px;
acb0e9b8 2962}
2963
319c6529 2964.notification-anchor-icon:-moz-focusring {
f0eab82c
RK
2965 outline: 1px dotted #008484;
2966/* outline-offset: -3px; */
acb0e9b8 2967}
2968
e2734cc7 2969.default-notification-icon,
ab799a7a
RK
2970#default-notification-icon {
2971 list-style-image: url("chrome://global/skin/icons/information-16.png");
2972}
2973
e2734cc7 2974.identity-notification-icon,
9585a561
RK
2975#identity-notification-icon {
2976 list-style-image: url("chrome://mozapps/skin/profile/profileicon.png");
2977}
2978
e2734cc7 2979.geo-notification-icon,
319c6529
RK
2980#geo-notification-icon {
2981 list-style-image: url("chrome://browser/skin/Geolocation-16.png");
acb0e9b8 2982}
2983
319c6529
RK
2984#addons-notification-icon {
2985 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
acb0e9b8 2986}
2987
e2734cc7 2988.indexedDB-notification-icon,
319c6529
RK
2989#indexedDB-notification-icon {
2990 list-style-image: url("chrome://global/skin/icons/question-16.png");
acb0e9b8 2991}
2992
319c6529
RK
2993#password-notification-icon {
2994 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-16.png");
acb0e9b8 2995}
2996
8d7ef0d9 2997#webapps-notification-icon {
87a1144f 2998 list-style-image: url("chrome://gobal/skin/icons/webapps-16.png");
8d7ef0d9
RK
2999}
3000
a40f6a79 3001#plugins-notification-icon {
b27cc46e
RK
3002 list-style-image: url("chrome://browser/skin/notification-pluginNormal.png");
3003}
3004
f76c6aee 3005#plugins-notification-icon.plugin-hidden {
b27cc46e 3006 list-style-image: url("chrome://browser/skin/notification-pluginAlert.png");
a40f6a79
RK
3007}
3008
f76c6aee 3009#plugins-notification-icon.plugin-blocked {
b27cc46e 3010 list-style-image: url("chrome://browser/skin/notification-pluginBlocked.png");
990cba4b
RK
3011}
3012
f76c6aee 3013#plugins-notification-icon {
fe524e0c
RK
3014/* -moz-image-region: rect(0, 16px, 16px, 0);*/
3015}
3016
f76c6aee 3017#plugins-notification-icon:hover {
fe524e0c
RK
3018/* -moz-image-region: rect(0, 32px, 16px, 16px);*/
3019}
3020
a6757852
RK
3021#plugin-install-notification-icon {
3022 list-style-image: url("chrome://browser/skin/pluginInstall-16.png");
3023}
3024
6adbc9a6
RK
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
f76c6aee 3032#plugins-notification-icon.plugin-blocked[showing] {
990cba4b
RK
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
e2734cc7 3045.mixed-content-blocked-notification-icon,
56ab361a
RK
3046#mixed-content-blocked-notification-icon {
3047 list-style-image: url("chrome://browser/skin/mixed-content-blocked-16.png");
3048}
3049
e2734cc7 3050.webRTC-shareDevices-notification-icon,
0142a07b 3051#webRTC-shareDevices-notification-icon {
7bc075b6
RK
3052 list-style-image: url("chrome://browser/skin/webRTC-shareDevice-16.png");
3053}
3054
e2734cc7 3055.webRTC-sharingDevices-notification-icon,
6adbc9a6
RK
3056#webRTC-sharingDevices-notification-icon {
3057 list-style-image: url("chrome://browser/skin/webRTC-sharingDevice-16.png");
3058}
3059
c1d2ce3e
RK
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
e2734cc7 3070.web-notifications-notification-icon,
82b4252f
RK
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
319c6529 3082/* Bookmarks roots menu-items */
319c6529
RK
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");
613daf44 3088}
3089
319c6529 3090#bookmarksToolbarFolderMenu,
c0f6797e
RK
3091#BMB_bookmarksToolbar,
3092#panelMenu_bookmarksToolbar {
8da9da4e 3093 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png");
319c6529
RK
3094 -moz-image-region: auto;
3095}
acb0e9b8 3096
c0f6797e
RK
3097#BMB_unsortedBookmarks,
3098#panelMenu_unsortedBookmarks {
8da9da4e 3099 list-style-image: url("chrome://communicator/skin/bookmarks/unsortedBookmarks.png");
319c6529 3100 -moz-image-region: auto;
acb0e9b8 3101}
3102
319c6529 3103/* ::::: Keyboard UI Panel ::::: */
acb0e9b8 3104
319c6529
RK
3105.KUI-panel {
3106 color: #FF9F00;
3107 border-style: none;
3108 border-radius: 20px;
acb0e9b8 3109}
3110
319c6529
RK
3111.KUI-panel[level="top"] {
3112 /*background-color: rgba(27%,27%,27%,.65);*/
acb0e9b8 3113}
3114
319c6529
RK
3115/* Ctrl-Tab */
3116
3117#ctrlTab-panel {
3118 padding: 20px 10px 10px;
3119 font-weight: bold;
acb0e9b8 3120}
3121
319c6529
RK
3122.ctrlTab-favicon[src] {
3123 background-color: #000000;
3124 width: 20px;
3125 height: 20px;
3126 padding: 2px;
3127}
acb0e9b8 3128
319c6529 3129.ctrlTab-preview-inner > .tabPreview-canvas {
acb0e9b8 3130}
3131
319c6529
RK
3132.ctrlTab-preview:not(#ctrlTab-showAll) > * > .ctrlTab-preview-inner > .tabPreview-canvas {
3133 margin-bottom: 2px;
acb0e9b8 3134}
3135
319c6529
RK
3136.ctrlTab-preview-inner {
3137 padding-bottom: 10px;
acb0e9b8 3138}
3139
319c6529
RK
3140#ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
3141 padding: 10px;
3142 background-color: #000000;
3143 border-radius: .5em;
acb0e9b8 3144}
3145
319c6529
RK
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;
acb0e9b8 3153}
3154
319c6529
RK
3155.ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
3156 margin: -10px -10px 0;
acb0e9b8 3157}
3158
319c6529
RK
3159#ctrlTab-showAll {
3160 margin-top: .5em;
acb0e9b8 3161}
3162
45dc7657
RK
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
9abeb12c
RK
3189/* Status panel */
3190
3191.statuspanel-label {
3192 margin: 0;
3193 padding: 2px 4px;
38cfeb47 3194 background: #404000;
9abeb12c
RK
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}
3e6e0e5c
RK
3214
3215/* HACK to abolish devily color on main content */
3216
3217#content {
3218 background-color: transparent !important;
3219}
dce90fef 3220
7600e0b1
RK
3221/* === BEGIN highlighter.inc.css === */
3222
dce90fef
RK
3223/* Highlighter */
3224
0142a07b 3225.highlighter-outline {
fcfb76ce 3226 box-shadow: 0 0 0 1px black;
1bf116f8 3227 outline: 1px dashed #A09090;
dce90fef
RK
3228}
3229
8ad8bf83
RK
3230/* Highlighter - Node Infobar */
3231
0142a07b 3232.highlighter-nodeinfobar {
a40f6a79 3233 color: #FF9F00;
a40f6a79
RK
3234 border-radius: 3px;
3235 background-color: #000000;
3236 background-clip: padding-box;
1bf116f8
RK
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;
a40f6a79
RK
3242}
3243
8ad8bf83
RK
3244/* Highlighter - Node Infobar - text */
3245
0142a07b 3246.highlighter-nodeinfobar-text {
45dc7657 3247 text-align: center;
a40f6a79 3248 /* 100% - size of the buttons and margins */
c29b709d 3249 max-width: calc(100% - 2 * (26px + 6px));
a40f6a79
RK
3250 padding-bottom: 1px;
3251}
3252
0142a07b 3253html|*.highlighter-nodeinfobar-tagname {
8ad8bf83
RK
3254 color: #FFCF00;
3255}
3256
0142a07b 3257html|*.highlighter-nodeinfobar-id {
8ad8bf83
RK
3258 color: #9C9CFF;
3259}
3260
0142a07b 3261html|*.highlighter-nodeinfobar-pseudo-classes {
eec397be 3262 color: #FF9F00;
8ad8bf83
RK
3263}
3264
a40f6a79
RK
3265/* Highlighter - Node Infobar - box & arrow */
3266
8ad8bf83
RK
3267.highlighter-nodeinfobar-arrow {
3268 width: 14px;
3269 height: 14px;
c29b709d 3270 -moz-margin-start: calc(50% - 7px);
71a617ff 3271 transform: rotate(-45deg);
8ad8bf83
RK
3272 background-clip: padding-box;
3273 background-repeat: no-repeat;
3274}
3275
0142a07b 3276.highlighter-nodeinfobar-arrow-top {
8ad8bf83
RK
3277 margin-bottom: -8px;
3278 margin-top: 8px;
fcaeefc2 3279 background-image: linear-gradient(to bottom left, transparent 50%, rgb(0, 132, 132) 50%);
8ad8bf83
RK
3280}
3281
0142a07b 3282.highlighter-nodeinfobar-arrow-bottom {
8ad8bf83
RK
3283 margin-top: -8px;
3284 margin-bottom: 8px;
fcaeefc2 3285 background-image: linear-gradient(to top right, transparent 50%, rgb(0, 132, 132) 50%);
8ad8bf83
RK
3286}
3287
0142a07b 3288.highlighter-nodeinfobar-container[hide-arrow] > .highlighter-nodeinfobar {
8ad8bf83
RK
3289 margin: 7px 0;
3290}
3291
7600e0b1
RK
3292/* === END highlighter.inc.css === */
3293
8ad8bf83
RK
3294#full-screen-warning-message {
3295 background-color: #000000;
3296 color: #FF9F00;
8ad8bf83
RK
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] {
85cfb236
RK
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%;
8ad8bf83
RK
3313}
3314
85cfb236
RK
3315.full-screen-approval-button,
3316#full-screen-remember-decision {
3317 font-size: 120%;
8ad8bf83
RK
3318}
3319
b27cc46e
RK
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
de57e474 3349#developer-toolbar > toolbarbutton {
b27cc46e
RK
3350/* margin: 0;
3351 padding: 0 10px;
3352 width: 32px; */
3353}
3354
3355.developer-toolbar-button > image {
3356/* margin: auto 10px; */
3357}
3358
fe524e0c
RK
3359#developer-toolbar-toolbox-button > label {
3360 display: none;
3361}
3362
b27cc46e
RK
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
de57e474
RK
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
b27cc46e
RK
3397/* GCLI */
3398
37953ab4
RK
3399html|*#gcli-tooltip-frame,
3400html|*#gcli-output-frame {
85cfb236 3401 padding: 0;
37953ab4
RK
3402 border-width: 0;
3403 background-color: transparent;
3404}
3405
3406#gcli-output,
3407#gcli-tooltip {
3408 border-width: 0;
3409 background-color: transparent;
85cfb236
RK
3410}
3411
3412.gclitoolbar-input-node,
b27cc46e 3413.gclitoolbar-complete-node {
37953ab4
RK
3414 margin: 1px 3px;
3415 -moz-box-align: center;
3416 padding-top: 0;
3417 padding-bottom: 0;
b27cc46e 3418 padding-right: 8px;
37953ab4 3419 background-color: transparent;
85cfb236
RK
3420}
3421
3422.gclitoolbar-input-node {
37953ab4 3423 padding-left: 20px;
b27cc46e
RK
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);
de57e474
RK
3427 background-repeat: no-repeat;
3428 background-color: rgba(0, 0, 0, .75);
b27cc46e
RK
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);
de57e474 3433 background-color: #000000;
37953ab4
RK
3434}
3435
3436.gclitoolbar-input-node:not([focused="true"]) {
3437 border-color: transparent;
85cfb236
RK
3438}
3439
7bc075b6
RK
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
85cfb236 3446.gclitoolbar-complete-node {
37953ab4 3447 padding-left: 21px;
85cfb236
RK
3448 background-color: transparent;
3449 color: transparent;
b27cc46e
RK
3450 z-index: 100;
3451 pointer-events: none;
85cfb236
RK
3452}
3453
85cfb236
RK
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
b27cc46e
RK
3485/* === END commandline.inc.css === */
3486
fe524e0c
RK
3487/* === BEGIN responsivedesign.inc.css === */
3488
37953ab4 3489/* Responsive Mode */
85cfb236 3490
7bc075b6
RK
3491.browserContainer[responsivemode] {
3492 background: #221500 url("chrome://browser/skin/devtools/responsive-background.png");
37953ab4
RK
3493 padding: 0 20px 20px 20px;
3494}
3495
7bc075b6 3496.browserStack[responsivemode] {
37953ab4
RK
3497 box-shadow: 0 0 7px #9C9CFF;
3498}
3499
3500.devtools-responsiveui-toolbar {
3501 background: transparent;
d2ce251d
RK
3502 /* text color is textColor from dark theme, since no theme is applied to
3503 * the responsive toolbar.
3504 */
3505 color: #FF9F00;
37953ab4
RK
3506 margin: 10px 0;
3507 padding: 0;
3508 box-shadow: none;
3509 border-bottom-width: 0;
3510}
3511
de57e474
RK
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;*/
37953ab4
RK
3594}
3595
3596.devtools-responsiveui-toolbar:-moz-locale-dir(ltr) > *:first-child,
3597.devtools-responsiveui-toolbar:-moz-locale-dir(rtl) > *:last-child {
fe524e0c
RK
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);
37953ab4
RK
3637}
3638
fe524e0c 3639.devtools-responsiveui-resizebarV {
37953ab4
RK
3640 width: 7px;
3641 height: 24px;
3642 cursor: ew-resize;
71a617ff 3643 transform: translate(12px, -12px);
37953ab4
RK
3644 background-image: url("chrome://browser/skin/devtools/responsive-vertical-resizer.png");
3645}
3646
fe524e0c
RK
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
37953ab4
RK
3655.devtools-responsiveui-resizehandle {
3656 width: 16px;
3657 height: 16px;
3658 cursor: se-resize;
71a617ff 3659 transform: translate(12px, 12px);
37953ab4 3660 background-image: url("chrome://browser/skin/devtools/responsive-se-resizer.png");
8d7ef0d9 3661}
889649fd 3662
fe524e0c 3663/* === END responsivedesign.inc.css === */
fcaeefc2
RK
3664
3665/* === including indicator.css is done at the start of the file === */
fe524e0c 3666
889649fd
RK
3667/* Error counter */
3668
0142a07b 3669#developer-toolbar-toolbox-button[error-count]:before {
889649fd
RK
3670 color: #000000;
3671 min-width: 16px;
3672 text-shadow: none;
3673 background-color: #FF0000;
3674 border-radius: 1px;
c29b709d 3675 -moz-margin-end: 5px;
c54ac991 3676}
e9c73590 3677
348c0499 3678/* Social toolbar item */
e9c73590 3679
0142a07b
RK
3680#social-provider-button {
3681 -moz-image-region: rect(0, 16px, 16px, 0);
a6757852 3682 list-style-image: url("chrome://browser/skin/social/services-16.png");
0142a07b
RK
3683}
3684
348c0499
RK
3685#social-provider-button > .toolbarbutton-menu-dropmarker {
3686 display: none;
e9c73590
RK
3687}
3688
82b4252f
RK
3689.toolbarbutton-badge-container {
3690 margin: 0;
3691 padding: 0;
3692 position: relative;
e9c73590
RK
3693}
3694
c0f6797e 3695#nav-bar .toolbarbutton-1 > .toolbarbutton-badge-container {
ed1a91c6 3696 padding: 2px 2px;
82b4252f
RK
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;
e9c73590
RK
3707}
3708
82b4252f
RK
3709.toolbarbutton-badge[badge=""] {
3710 display: none;
3711}
3712.toolbarbutton-badge[badge]:not([badge=""])::after {
6adbc9a6 3713 /* The |content| property is set in the content stylesheet. */
348c0499
RK
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;
6adbc9a6 3721 position: absolute;
82b4252f
RK
3722 top: 0;
3723 right: 0;
3724}
3725
c0f6797e 3726#nav-bar *|* > .toolbarbutton-badge[badge]:not([badge=""])::after {
82b4252f
RK
3727 top: 1px;
3728 right: 1px;
e9c73590
RK
3729}
3730
82b4252f
RK
3731.toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
3732 left: 0;
3733 right: auto;
e9c73590
RK
3734}
3735
c0f6797e 3736#nav-bar *|* > .toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
82b4252f 3737 left: 1px;
6adbc9a6 3738 right: auto;
348c0499
RK
3739}
3740
3741#social-notification-icon-mentions {
e9c73590 3742 background-color: #000000;
348c0499
RK
3743 border-radius: 3px;
3744 -moz-margin-start: 2px;
e9c73590
RK
3745}
3746
348c0499
RK
3747#social-notification-icon-mentions:hover {
3748 background-color: #FFCF00;
3749}
3750
3751#social-notification-icon-mentions[open="true"] {
3752 background-color: #FF9F00;
e9c73590
RK
3753}
3754
3755#social-sidebar-splitter {
3756 border: 0;
3757}
3758
ed1a91c6
RK
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}
c1d2ce3e 3765#social-undoactivation-button {
ed1a91c6
RK
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
e9c73590 3788/* social toolbar provider menu */
990cba4b 3789.social-statusarea-popup {
e9c73590
RK
3790 margin-top: 0;
3791 margin-left: -12px;
3792 margin-right: -12px;
3793}
3794
990cba4b 3795.social-statusarea-user {
e9c73590
RK
3796 border-bottom: 1px solid #9C9CFF;
3797 background-color: #000000;
3798 color: #FF9F00;
3799 position: relative;
348c0499 3800 cursor: pointer;
e9c73590
RK
3801}
3802
990cba4b 3803.social-statusarea-user-portrait {
e9c73590
RK
3804 width: 32px;
3805 height: 32px;
3806 border-radius: 2px;
3807 margin: 10px;
e9c73590
RK
3808}
3809
990cba4b 3810.social-statusarea-loggedInStatus {
e9c73590
RK
3811 background: transparent;
3812 border: none;
b8384c33 3813 color: #3333FF;
e9c73590
RK
3814 min-width: 0;
3815 margin: 0 6px;
348c0499 3816 list-style-image: none;
e9c73590 3817}
90a244b7 3818
990cba4b 3819#social-statusarea-user[_moz-menuactive] > vbox > .social-statusarea-loggedInStatus {
e9c73590
RK
3820 text-decoration: underline;
3821}
3822
348c0499
RK
3823.social-panel > .panel-arrowcontainer > .panel-arrowcontent {
3824 padding: 0;
3825}
3826
348c0499
RK
3827.social-panel-frame {
3828 border-radius: inherit;
3829}
e9c73590 3830
e7c8bab1
RK
3831/* === BEGIN chat.inc.css === */
3832
dfa34f73
RK
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");
45dc7657 3840 border: none;
dfa34f73
RK
3841 padding: 0;
3842 margin: 2px;
3843}
45dc7657
RK
3844#social-sidebar-button > .toolbarbutton-icon {
3845 min-height: 16px;
3846 min-width: 16px;
3847}
dfa34f73
RK
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
e9c73590
RK
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;
b27cc46e 3879 width: 16px;
e9c73590
RK
3880}
3881
3882.chat-toolbarbutton > .toolbarbutton-text {
3883 display: none;
3884}
3885
b27cc46e
RK
3886.chat-toolbarbutton > .toolbarbutton-icon {
3887 width: inherit;
3888}
3889
e7c8bab1
RK
3890.chat-toolbarbutton.notification-anchor-icon > .toolbarbutton-icon {
3891 width: inherit;
3892 margin-top: -2px;
3893}
3894
e9c73590 3895.chat-close-button {
e2734cc7 3896 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 3897 -moz-image-region: rect(0, 16px, 16px, 0);
e9c73590
RK
3898}
3899
3900.chat-close-button:hover,
3901.chat-close-button:hover:active {
b27cc46e 3902 -moz-image-region: rect(0, 32px, 16px, 16px);
e9c73590
RK
3903}
3904
e2734cc7
RK
3905.chat-minimize-button {
3906 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 3907 -moz-image-region: rect(16px, 16px, 32px, 0);
e2734cc7
RK
3908}
3909
3910.chat-minimize-button:hover:active,
3911.chat-minimize-button:hover {
b27cc46e 3912 -moz-image-region: rect(16px, 32px, 32px, 16px);
e2734cc7
RK
3913}
3914
3915.chat-swap-button {
3916 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 3917 -moz-image-region: rect(48px, 16px, 64px, 0);
e2734cc7
RK
3918}
3919
3920.chat-swap-button:hover:active,
3921.chat-swap-button:hover {
b27cc46e 3922 -moz-image-region: rect(48px, 32px, 64px, 16px);
e2734cc7
RK
3923}
3924
3925chatbar > chatbox > .chat-titlebar > .chat-swap-button {
3926 list-style-image: url('chrome://browser/skin/social/chat-icons.png');
b27cc46e 3927 -moz-image-region: rect(32px, 16px, 48px, 0);
e2734cc7
RK
3928}
3929
3930chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover:active,
3931chatbar > chatbox > .chat-titlebar > .chat-swap-button:hover {
b27cc46e 3932 -moz-image-region: rect(32px, 32px, 48px, 16px);
e2734cc7
RK
3933}
3934
e9c73590
RK
3935.chat-title {
3936 font-weight: bold;
3937 font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
90a244b7 3938 text-shadow: none;
348c0499 3939 cursor: inherit;
e9c73590
RK
3940}
3941
3942.chat-titlebar {
3943 background-color: #9C9CFF;
3944 color: #000000;
3945 height: 20px;
fcfb76ce 3946 min-height: 16px;
e9c73590
RK
3947 width: 100%;
3948 margin: 0;
3949 padding: 2px;
348c0499 3950 -moz-padding-start: 6px;
e9c73590
RK
3951 border: none;
3952 border-bottom: 1px solid #008484;
348c0499 3953 cursor: pointer;
e9c73590
RK
3954}
3955
e2734cc7
RK
3956.chat-titlebar > .notification-anchor-icon {
3957 margin-left: 2px;
3958 margin-right: 2px;
3959}
3960
e9c73590
RK
3961.chat-titlebar[minimized="true"] {
3962 border-bottom: none;
3963}
3964
348c0499
RK
3965.chat-titlebar[selected] {
3966 background-color: #008484;
3967}
3968
3969.chat-titlebar[activity] {
3970 background-color: #E7ADE7;
3971}
3972
e9c73590
RK
3973.chat-frame {
3974 padding: 0;
3975 margin: 0;
3976 overflow: hidden;
3977}
3978
3979.chatbar-button {
ed1a91c6 3980 list-style-image: url("chrome://browser/skin/social/services-16.png");
e9c73590
RK
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
ed1a91c6
RK
3991@media (min-resolution: 2dppx) {
3992 .chatbar-button {
3993 list-style-image: url("chrome://browser/skin/social/services-16@2x.png");
3994 }
3995}
3996
fe524e0c
RK
3997.chatbar-button > .toolbarbutton-icon {
3998 width: 16px;
3999}
4000
d7cfd768
RK
4001.chatbar-button > menupopup > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon {
4002 width: auto;
4003 height: auto;
e9c73590
RK
4004 max-height: 16px;
4005 max-width: 16px;
e9c73590
RK
4006}
4007
90a244b7
RK
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
a6757852 4017.chatbar-button:hover,
90a244b7 4018.chatbar-button[open="true"] {
e9c73590
RK
4019}
4020
e9c73590
RK
4021.chatbar-button > .toolbarbutton-text,
4022.chatbar-button > .toolbarbutton-menu-dropmarker {
4023 display: none;
4024}
4025
90a244b7 4026.chatbar-button[activity]:not([open="true"]) {
348c0499
RK
4027 background-color: #E7ADE7;
4028}
4029
4030.chatbar-button > menupopup > menuitem[activity] {
4031 font-weight: bold;
4032}
4033
e9c73590
RK
4034.chatbar-innerbox {
4035 background: transparent;
90a244b7 4036 margin: -285px 0 0;
e9c73590
RK
4037 overflow: hidden;
4038}
4039
fcfb76ce
RK
4040chatbar {
4041 -moz-margin-end: 20px;
4042}
4043
e9c73590 4044chatbar > chatbox {
fcfb76ce
RK
4045 height: 285px;
4046 width: 260px;
4047 -moz-margin-start: 4px;
e9c73590
RK
4048 background-color: #000000;
4049 border: 1px solid #9C9CFF;
4050 border-bottom: none;
90a244b7
RK
4051 border-top-left-radius: 2.5px;
4052 border-top-right-radius: 2.5px;
e9c73590
RK
4053}
4054
fcfb76ce
RK
4055chatbox[minimized="true"] {
4056 width: 160px;
e9c73590 4057 height: 20px;
e9c73590 4058}
348c0499 4059
e2734cc7
RK
4060window > chatbox {
4061 -moz-margin-start: 0px;
4062 margin: 0px;
4063 border: none;
4064 padding: 0px;
4065}
4066
e7c8bab1
RK
4067/* === END chat.inc.css === */
4068
c0f6797e
RK
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
b27cc46e 4099/* === BEGIN plugin-doorhanger.inc.css === */
348c0499 4100
b27cc46e
RK
4101/**
4102 * Plugin Doorhanger Styles
4103 */
348c0499 4104
b27cc46e 4105#notification-popup[popupid="click-to-play-plugins"] > .panel-arrowcontainer > .panel-arrowcontent {
1e32332f 4106 padding: 6px 1px 2px;
348c0499
RK
4107}
4108
348c0499 4109.click-to-play-plugins-notification-center-box {
348c0499
RK
4110}
4111
fe524e0c
RK
4112.plugin-popupnotification-centeritem:nth-child(odd) {
4113/* background-color: rgba(0,0,0,0.1);*/
348c0499
RK
4114}
4115
b27cc46e
RK
4116.center-item-label {
4117 margin-bottom: 0;
4118 text-overflow: ellipsis;
348c0499
RK
4119}
4120
b27cc46e
RK
4121.center-item-warning-icon {
4122 background-image: url("chrome://mozapps/skin/extensions/alerticon-info-negative.png");
348c0499 4123 background-repeat: no-repeat;
348c0499 4124 width: 16px;
b27cc46e
RK
4125 height: 15px;
4126 -moz-margin-start: 6px;
348c0499
RK
4127}
4128
b27cc46e 4129.click-to-play-plugins-notification-button-container {
348c0499
RK
4130}
4131
b27cc46e
RK
4132.click-to-play-popup-button {
4133 width: 50%;
348c0499
RK
4134}
4135
b27cc46e 4136.click-to-play-plugins-notification-description-box {
1e32332f
RK
4137 margin-left: 5px;
4138 margin-right: 5px;
4139 margin-top: 0;
4140 padding-bottom: 3px;
348c0499
RK
4141}
4142
b27cc46e 4143.click-to-play-plugins-outer-description {
1e32332f 4144 margin-top: 1px;
348c0499
RK
4145}
4146
b27cc46e
RK
4147.click-to-play-plugins-notification-link,
4148.center-item-link {
4149 margin: 0;
348c0499
RK
4150}
4151
2c225fcb
RK
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
b27cc46e 4164/* === END plugin-doorhanger.inc.css === */
0142a07b 4165
43cc2806
RK
4166/* === BEGIN customizeMode.inc.css === */
4167
4168/* Customization mode */
e28f3f71 4169
5401f433
RK
4170#main-window:-moz-any([customize-entering],[customize-entered]) #browser-bottombox {
4171 margin-bottom: 1em;
e28f3f71
RK
4172}
4173
5401f433
RK
4174#main-window:-moz-any([customize-entering],[customize-entered]) #content-deck,
4175#main-window:-moz-any([customize-entering],[customize-entered]) #browser-bottombox,
e28f3f71
RK
4176#main-window:-moz-any([customize-entering],[customize-entered]) #navigator-toolbox {
4177 margin-left: 1em;
4178 margin-right: 1em;
43cc2806
RK
4179}
4180
e28f3f71
RK
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,
43cc2806 4186#PanelUI-contents > .panel-customization-placeholder {
e28f3f71 4187 -moz-outline-radius: 2.5px;
43cc2806
RK
4188 outline: 1px dashed transparent;
4189}
4190
e28f3f71
RK
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 {
e20c83c3 4209/* top: -2px;*/
e28f3f71
RK
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;
43cc2806
RK
4234 outline-color: #9C9CFF;
4235}
4236
4237#PanelUI-contents > .panel-customization-placeholder {
4238 cursor: auto;
4239 outline-offset: -5px;
4240}
4241
e28f3f71 4242#main-window[customizing] .customization-target:not(#PanelUI-contents) {
43cc2806 4243 min-width: 100px;
e20c83c3
RK
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;
43cc2806
RK
4250}
4251
4252#customization-container {
4253 background-color: #000000;
4254}
4255
e28f3f71
RK
4256#customization-palette,
4257#customization-empty {
4258 padding: 0 15px 15px;
43cc2806
RK
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;
e28f3f71 4267 padding: 15px 15px 0;
43cc2806
RK
4268}
4269
4270#customization-panel-container {
e28f3f71
RK
4271 padding: 10px 10px 0px;
4272}
4273
5401f433 4274#main-window:-moz-any([customize-entering],[customize-entered]) #browser-bottombox,
e28f3f71
RK
4275#customization-footer {
4276 /*background-color: rgb(236,236,236);*/
5401f433
RK
4277}
4278
4279#customization-footer {
e28f3f71
RK
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");
b7f3670c
RK
4296 -moz-image-region: rect(0, 16px, 16px, 0);
4297 padding: 0px 5px;
e28f3f71
RK
4298 -moz-margin-end: 10px;
4299}
4300
b7f3670c
RK
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
e28f3f71
RK
4315#customization-titlebar-visibility-button > .button-box > .button-text {
4316 /* Sadly, button.css thinks its margins are perfect for everyone. */
b7f3670c 4317 -moz-margin-start: 5px !important;
e28f3f71
RK
4318}
4319
4320#customization-titlebar-visibility-button[checked] {
b7f3670c 4321 -moz-image-region: rect(0, 32px, 16px, 16px);
e28f3f71
RK
4322 background-color: #008484;
4323}
4324
b7f3670c
RK
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
e28f3f71
RK
4334#customization-undo-reset-button {
4335 -moz-margin-end: 10px;
4336}
4337
4338#main-window[customize-entered] #customization-panel-container {
43cc2806
RK
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
e28f3f71
RK
4346toolbarpaletteitem[place="toolbar"] {
4347 transition: border-width 250ms ease-in-out;
43cc2806
RK
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"] {
e28f3f71
RK
4359 transition: transform .3s ease-in-out;
4360}
4361
4362#customization-palette {
4363 transition: opacity .3s ease-in-out;
4364 opacity: 0;
43cc2806
RK
4365}
4366
e28f3f71
RK
4367#customization-palette[showing="true"] {
4368 opacity: 1;
4369}
4370
4371toolbarpaletteitem[notransition].panel-customization-placeholder,
4372toolbarpaletteitem[notransition][place="toolbar"],
43cc2806
RK
4373toolbarpaletteitem[notransition][place="palette"],
4374toolbarpaletteitem[notransition][place="panel"] {
e28f3f71 4375 transition: none;
43cc2806
RK
4376}
4377
e28f3f71
RK
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;
43cc2806
RK
4382}
4383
4384toolbarpaletteitem[mousedown] > toolbarbutton > .toolbarbutton-icon {
e28f3f71
RK
4385 transform: scale(1.3);
4386}
4387
4388toolbarpaletteitem[mousedown] > toolbaritem.panel-wide-item,
4389toolbarpaletteitem[mousedown] > toolbarbutton[type="menu-button"] {
43cc2806
RK
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
43cc2806
RK
4405#wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton,
4406#wrapper-edit-controls[place="palette"] > #edit-controls > separator,
e28f3f71
RK
4407#wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton,
4408#wrapper-zoom-controls[place="palette"] > #zoom-controls > separator {
4409 margin-top: 20px;
43cc2806
RK
4410}
4411
4412#wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton,
c0f6797e 4413#wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton {
43cc2806
RK
4414 margin-left: 0;
4415 margin-right: 0;
e28f3f71
RK
4416 max-width: 24px;
4417 min-width: 24px;
43cc2806 4418 max-height: 24px;
5401f433 4419 min-height: 24px;
e28f3f71 4420 padding: 4px;
43cc2806
RK
4421}
4422
e28f3f71
RK
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;
43cc2806
RK
4426}
4427
e28f3f71
RK
4428#wrapper-edit-controls > #edit-controls > toolbarbutton > .toolbarbutton-icon {
4429 opacity: 1; /* To ensure these buttons always look enabled in customize mode */
4430}
4431
c0f6797e
RK
4432#wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-reset-button,
4433#wrapper-zoom-controls[place="palette"] > #zoom-controls > #zoom-reset-button + separator {
e28f3f71
RK
4434 display: none;
4435}
4436
4437#wrapper-personal-bookmarks:not([place="toolbar"]) > #personal-bookmarks {
4438 -moz-box-pack: center;
4439 min-height: 48px;
43cc2806
RK
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
e28f3f71
RK
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
c0f6797e
RK
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
e20c83c3 4536#main-window[customize-entered] {
43cc2806
RK
4537 background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png");
4538 background-attachment: fixed;
4539}
4540
5401f433
RK
4541#main-window[customize-entered] #browser-bottombox,
4542#main-window[customize-entered] #customization-container {
43cc2806
RK
4543 border-left: 1px solid #9C9CFF;
4544 border-right: 1px solid #9C9CFF;
4545 background-clip: padding-box;
4546}
4547
5401f433
RK
4548#main-window[customize-entered] #browser-bottombox {
4549 border-bottom: 1px solid #9C9CFF;
4550}
4551
e20c83c3
RK
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
51994fad
RK
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;
e20c83c3
RK
4575}
4576
51994fad
RK
4577#private-browsing-indicator-titlebar {
4578 display: block;
4579 position: absolute;
e20c83c3
RK
4580}
4581
51994fad
RK
4582#main-window[privatebrowsingmode=temporary][tabsintitlebar] #private-browsing-indicator-titlebar > .private-browsing-indicator {
4583 display: block;
e20c83c3
RK
4584}
4585
51994fad
RK
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;
43cc2806 4604 width: 40px;
51994fad
RK
4605 height: 20px;
4606 position: relative;
43cc2806
RK
4607}
4608
51994fad
RK
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
43cc2806
RK
4617/* === BEGIN UITour.inc.css === */
4618
4619/* UI Tour */
4620
2a8b2b48
RK
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);
43cc2806
RK
4636 min-height: 32px;
4637 min-width: 32px;
1bf116f8
RK
4638}
4639
2a8b2b48
RK
4640#UITourTooltipBody {
4641 -moz-margin-end: 14px;
4642}
4643
4644#UITourTooltipBody > vbox {
4645 padding-top: 4px;
43cc2806
RK
4646}
4647
2a8b2b48
RK
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;
43cc2806
RK
4662}
4663
4664#UITourTooltipTitle {
2a8b2b48 4665 font-size: 1.45rem;
43cc2806 4666 font-weight: bold;
2a8b2b48
RK
4667 -moz-margin-start: 0;
4668 -moz-margin-end: 0;
4669 margin: 0 0 9px 0;
43cc2806
RK
4670}
4671
4672#UITourTooltipDescription {
2a8b2b48
RK
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;
43cc2806
RK
4760}
4761
4762/* === END UITour.inc.css === */
c0f6797e
RK
4763
4764#UITourTooltipButtons {
4765 margin: 24px -4px -4px;
4766}
fff8097b
RK
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 === */