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