downloads button with open panel needs to use hover icon
[themes.git] / EarlyBlue / navigator / navigator.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/. */
128000f4 4
76983f4c 5/** Contains style definitions for the navigator application
f6e0a33f 6 **/
7
74d14f90 8@import url("chrome://navigator/content/navigator.css");
9@import url("chrome://communicator/skin/");
74d14f90 10@import url("chrome://communicator/skin/bookmarks/bookmarksToolbar.css");
f6e0a33f 11
f840e302 12@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
13
74d14f90 14/* ::::: primary toolbar buttons ::::: */
f6e0a33f 15
74d14f90 16#back-button {
ecb2fda9
RK
17 list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png");
18 -moz-image-region: rect(42px 25px 63px 0px);
74d14f90 19}
f6e0a33f 20
74d14f90 21#back-button[disabled="true"] {
749ee109 22 -moz-image-region: rect(42px 50px 63px 25px);
74d14f90 23}
f6e0a33f 24
74d14f90 25#forward-button {
ecb2fda9
RK
26 list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png");
27 -moz-image-region: rect(63px 25px 84px 0px);
74d14f90 28}
29
30#forward-button[disabled="true"] {
749ee109 31 -moz-image-region: rect(63px 50px 84px 25px);
74d14f90 32}
33
34#reload-button {
749ee109
RK
35 list-style-image: url("chrome://navigator/skin/icons/navigatoricons.png");
36 -moz-image-region: rect(0px 25px 21px 0px);
74d14f90 37}
749ee109 38
74d14f90 39#reload-button[disabled="true"] {
749ee109 40 -moz-image-region: rect(0px 50px 21px 25px);
74d14f90 41}
42
43#stop-button {
ecb2fda9
RK
44 list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png");
45 -moz-image-region: rect(21px 25px 42px 0px);
74d14f90 46}
47
48#stop-button[disabled="true"] {
749ee109 49 -moz-image-region: rect(21px 50px 42px 25px);
76983f4c 50}
74d14f90 51
0ef1663c
RK
52#home-button {
53 list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png");
54 -moz-image-region: rect(84px 25px 105px 0px);
55}
56
57#home-button[disabled="true"] {
58 -moz-image-region: rect(84px 50px 105px 25px);
59}
60
c2e1f790
RK
61#sync-button {
62 list-style-image: url("chrome://communicator/skin/sync/sync-32.png");
63}
64
65#sync-button[status=active] {
66 list-style-image: url("chrome://communicator/skin/sync/sync-32-throbber.png");
67}
68
f2450795 69#clear-button {
70 list-style-image: url("chrome://global/skin/icons/close-button.gif");
71}
72
c2e1f790
RK
73/* ::::: small primary toolbar buttons ::::: */
74
0ef1663c
RK
75toolbar[iconsize="small"] > #back-button {
76 list-style-image: url("chrome://communicator/skin/icons/communicatoricons-small.png");
77 -moz-image-region: rect(32px 16px 48px 0);
78}
79
80toolbar[iconsize="small"] > #back-button[disabled="true"] {
81 -moz-image-region: rect(32px 32px 48px 16px) !important;
82}
83
84toolbar[iconsize="small"] > #forward-button {
85 list-style-image: url("chrome://communicator/skin/icons/communicatoricons-small.png");
86 -moz-image-region: rect(48px 16px 64px 0);
87}
88
89toolbar[iconsize="small"] > #forward-button[disabled="true"] {
90 -moz-image-region: rect(48px 32px 64px 16px) !important;
91}
92
93toolbar[iconsize="small"] > #reload-button {
94 list-style-image: url("chrome://navigator/skin/icons/navigatoricons-small.png");
95 -moz-image-region: rect(0 16px 16px 0);
96}
97
98toolbar[iconsize="small"] > #reload-button[disabled="true"] {
99 -moz-image-region: rect(0 32px 16px 16px) !important;
100}
101
102toolbar[iconsize="small"] > #stop-button {
103 list-style-image: url("chrome://communicator/skin/icons/communicatoricons-small.png");
104 -moz-image-region: rect(16px 16px 32px 0);
105}
106
107toolbar[iconsize="small"] > #stop-button[disabled="true"] {
108 -moz-image-region: rect(16px 32px 32px 16px) !important;
109}
110
0ef1663c
RK
111toolbar[iconsize="small"] > #home-button {
112 list-style-image: url("chrome://communicator/skin/icons/communicatoricons-small.png");
113 -moz-image-region: rect(64px 16px 80px 0);
114}
115
116toolbar[iconsize="small"] > #home-button[disabled="true"] {
117 -moz-image-region: rect(64px 32px 80px 16px) !important;
118}
119
c2e1f790
RK
120toolbar[iconsize="small"] > toolbarpaletteitem > #sync-button,
121toolbar[iconsize="small"] > #sync-button {
122 list-style-image: url("chrome://communicator/skin/sync/sync-16.png");
123}
124
125toolbar[iconsize="small"] > toolbarpaletteitem > #sync-button[status=active],
126toolbar[iconsize="small"] > #sync-button[status=active] {
127 list-style-image: url("chrome://communicator/skin/sync/sync-16-throbber.png");
128}
129
f1b199d6
RK
130#FindToolbar:-moz-lwtheme {
131/* -moz-border-top-colors: transparent;
132 -moz-border-bottom-colors: transparent; */
133}
134
c8120ee9 135/* ::::: fullscreen window controls ::::: */
136
137#window-controls {
138 -moz-box-align: center;
749ee109 139 padding: 0 2px;
083cee4a 140 border-left: 1px solid #9999CC;
749ee109 141 -moz-margin-start: 2px;
083cee4a 142}
143
144#window-controls > toolbarbutton {
749ee109
RK
145 padding: 3px;
146 -moz-padding-start: 2px;
147 -moz-padding-end: 1px;
148}
149
150toolbar[mode="text"] > #window-controls > toolbarbutton > .toolbarbutton-icon {
151 display: -moz-box;
c8120ee9 152}
153
154#minimize-button {
155 list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
156}
157
158#restore-button {
159 list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
160}
161
162#close-button {
163 list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
164}
165
74d14f90 166/* ::::: nav-bar-inner ::::: */
167
d1476608 168.nav-bar-class {
749ee109
RK
169 -moz-padding-start: 1px;
170 -moz-padding-end: 1px;
74d14f90 171 min-width: 0px;
749ee109 172 -moz-box-align: center;
74d14f90 173}
76983f4c 174
74d14f90 175#urlbar {
749ee109
RK
176 margin: 0;
177 -moz-margin-start: 3px;
178}
179
7197fc13 180.urlbar-security-level {
749ee109 181 padding: 2px;
76983f4c 182}
74d14f90 183
cf89ee7b 184.urlbar-security-level[level="high"] {
d84b9613 185 background-color: #FFFFCC;
186}
187
e8fc8e8e
RK
188#wrapper-nav-bar-inner[place="palette"] > #nav-bar-inner > .button-toolbar,
189#wrapper-nav-bar-inner[place="palette"] > #nav-bar-inner > #urlbar > .urlbar-icons {
190 display: none;
191}
192
fb2b5761
RK
193/* ::::: notification popups ::::: */
194
fb2b5761
RK
195.popup-notification-icon {
196 width: 64px;
197 height: 64px;
198 -moz-margin-end: 10px;
199}
200
201.popup-notification-icon[popupid="geolocation"] {
202 list-style-image: url("chrome://communicator/skin/icons/geolocation-64.png");
203}
204
a3b6328b
RK
205.popup-notification-icon[popupid="addon-install-disabled"],
206.popup-notification-icon[popupid="addon-install-blocked"],
b4af54ca
RK
207.popup-notification-icon[popupid="addon-install-started"],
208.popup-notification-icon[popupid="addon-install-cancelled"],
a3b6328b 209.popup-notification-icon[popupid="addon-install-failed"],
c1f7cc84
RK
210.popup-notification-icon[popupid="addon-install-complete"],
211.popup-notification-icon[popupid="lwtheme-install-request"],
212.popup-notification-icon[popupid="lwtheme-install-notification"] {
a3b6328b
RK
213 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
214 width: 32px;
215 height: 32px;
216}
217
c2e1f790
RK
218.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
219.popup-notification-icon[popupid="indexedDB-quota-prompt"] {
220 list-style-image: url("chrome://global/skin/icons/question-64.png");
221}
222
223.popup-notification-icon[popupid="password-change"],
fb2b5761
RK
224.popup-notification-icon[popupid="password-save"] {
225 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-64.png");
226}
227
719b06bc
RK
228.popup-notification-icon[popupid="click-to-play-plugins"] {
229 list-style-image: url("chrome://mozapps/skin/plugins/pluginGeneric.png");
230 width: 32px;
231 height: 32px;
232}
233
234.addon-progress-description {
235 width: 350px;
236 max-width: 350px;
237}
238
fb2b5761
RK
239/* Notification icon box */
240#notification-popup-box {
241 -moz-margin-end: 3px;
242}
243
244.notification-anchor-icon:-moz-focusring {
245 outline: 1px dotted;
246}
247
c2e1f790
RK
248#default-notification-icon {
249 list-style-image: url("chrome://global/skin/icons/information-16.png");
250 width: 16px;
251 height: 16px;
252}
253
fb2b5761
RK
254#geo-notification-icon {
255 list-style-image: url("chrome://communicator/skin/icons/geolocation-16.png");
256 width: 16px;
257 height: 16px;
258}
259
a3b6328b
RK
260#addons-notification-icon {
261 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
262 width: 16px;
263 height: 16px;
264}
265
c2e1f790
RK
266#indexedDB-notification-icon {
267 list-style-image: url("chrome://global/skin/icons/question-16.png");
268 width: 16px;
269 height: 16px;
270}
271
fb2b5761
RK
272#password-notification-icon {
273 list-style-image: url("chrome://mozapps/skin/passwordmgr/key-16.png");
274 width: 16px;
275 height: 16px;
276}
277
719b06bc
RK
278#plugins-notification-icon {
279 list-style-image: url("chrome://mozapps/skin/plugins/pluginGeneric-16.png");
280 width: 16px;
281 height: 16px;
282}
283
74d14f90 284/* ::::: page proxy icon ::::: */
76983f4c 285
74d14f90 286#page-proxy-deck,
287#page-proxy-favicon,
288#page-proxy-button {
289 width: 16px;
290 height: 16px;
291}
2d09e496 292
293#page-proxy-deck {
d2f0d128 294 cursor: -moz-grab;
749ee109 295 margin: 0;
74d14f90 296}
297
298#page-proxy-button {
76983f4c 299 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-item.gif");
76983f4c 300}
74d14f90 301
302#page-proxy-favicon {
303 list-style-image: none;
76983f4c 304}
f6e0a33f 305
74d14f90 306/* ::::: autocomplete ::::: */
307
a1f525f0 308.autocomplete-treebody::-moz-tree-cell-text(value) {
e8fc8e8e 309 -moz-padding-start: 13px;
f6e0a33f 310}
f6e0a33f 311
a1f525f0 312.autocomplete-treebody::-moz-tree-cell-text(comment) {
74d14f90 313 color: #808080;
314/* font-style: italic; */
f6e0a33f 315}
316
74d14f90 317.autocomplete-search-box {
318 border-top: 1px solid #9999CC;
319 background-color: #666699;
320 color: #000000;
321}
f6e0a33f 322
74d14f90 323.autocomplete-result-popup[nomatch] > .autocomplete-search-box {
324 border-top: 1px solid #666699;
325}
326
327.autocomplete-search-engine {
328 padding: 2px;
329}
330
331.autocomplete-search-engine[menuactive="true"] {
332 background-color: #9999CC;
333 color: #000000;
334}
335
336.autocomplete-search-engine-img {
8caa872d 337 -moz-margin-end: 4px;
74d14f90 338}
339
5ddff932
RK
340.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
341 color: #808080;
342}
343
74d14f90 344/* ::::: go and searchbuttons ::::: */
f6e0a33f 345
76983f4c 346#search-button,
f6e0a33f 347#go-button {
749ee109
RK
348 margin: 0;
349 padding: 1px 0;
350 -moz-margin-start: 2px;
74d14f90 351 background-color: #9999CC;
f6e0a33f 352}
353
749ee109
RK
354/* care that those buttons base on the same min height of 16px that the urlbar
355 autocomplete box gets through site icon and urlbar icons at the right */
d1476608 356#search-button > .button-box,
749ee109
RK
357#go-button > .button-box {
358 min-height: 16px;
359}
360
74d14f90 361#search-button {
362/* list-style-image: url("chrome://communicator/skin/icons/search.gif"); */
363 font-weight: bold;
f6e0a33f 364}
365
c1f7cc84
RK
366#search-button > .button-box > .button-icon {
367 display: -moz-box;
368}
369
749ee109
RK
370/*
371toolbar[mode="text"] #search-button > .button-box > .button-icon,
372toolbar[mode="icons"] #search-button > .button-box > .button-text {
373 display: none;
374}
375*/
376
5ddff932
RK
377/* ::::: search bar ::::: */
378
379.autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
380.autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment) {
381 color: #808080;
382 font-size: smaller;
383}
384
385.autocomplete-treebody::-moz-tree-cell(suggesthint) {
386 border-top: 1px solid #808080;
387}
388
459f2165 389/* ::::: security button ::::: */
74d14f90 390
459f2165 391#security-button {
8caa872d 392 -moz-margin-start: 2px;
f6e0a33f 393}
394
ff5bd775 395#security-button {
aeb317b8
RK
396 list-style-image: url("chrome://communicator/skin/icons/lock-insecure.gif");
397}
398
b70a3a73 399/* |high| and |low| styles could be different, to better reflect the secure level... */
cf89ee7b 400#security-button[level="high"] > .statusbarpanel-contentbox {
aeb317b8
RK
401 list-style-image: url("chrome://communicator/skin/icons/lock-secure.gif");
402 background-color: #FFFFCC;
74d14f90 403}
f6e0a33f 404
ff5bd775 405#security-button[level="broken"] > .statusbarpanel-contentbox {
aeb317b8
RK
406 list-style-image: url("chrome://communicator/skin/icons/lock-broken.gif");
407 background-color: #FFCCCC;
408}
409
ff5bd775
RK
410#security-button[label] > .statusbarpanel-contentbox {
411 background-color: #33FF33;
412}
413
537196e5 414#security-button > .statusbarpanel-contentbox > .statusbarpanel-text {
aeb317b8 415 margin: 0px;
aeb317b8 416 color: #000000;
74d14f90 417}
f6e0a33f 418
ff5bd775 419/* make same background-color translucent on lwthemes */
cf89ee7b 420#security-button[level="high"] > .statusbarpanel-contentbox:-moz-lwtheme {
ff5bd775
RK
421 background-color: rgba(255, 255, 204, .8);
422}
423
424#security-button[level="broken"] > .statusbarpanel-contentbox:-moz-lwtheme {
425 background-color: rgba(255, 204, 204, .8);
426}
427
428#security-button[label] > .statusbarpanel-contentbox:-moz-lwtheme {
429 background-color: rgba(51, 255, 51, .8);
430}
431
d9954aaf
RK
432#ev-button {
433 list-style-image: url("chrome://communicator/skin/icons/identity.png");
434}
435
4c66fa00 436#popupIcon {
c37975cc 437 list-style-image:url("chrome://navigator/skin/icons/popup-blocked.gif");
4c66fa00 438}
439
fb2b5761
RK
440#invalid-form-popup {
441 border : 1px outset #FFFFCC;
442 padding: 2px 3px 0px 3px;
443 max-width: 40em;
444 background-color : #FFFFCC;
445 color: #000000;
446 font-weight: bold;
447}
448
459f2165 449/* ::::: personal toolbar ::::: */
f6e0a33f 450
459f2165 451#bookmarks-button {
452 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
74d14f90 453}
454
459f2165 455#bookmarks-button[open="true"] {
456 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
74d14f90 457}
459f2165 458
749ee109 459#toolbarbutton.chevron {
56029caf 460 list-style-image: url("chrome://navigator/skin/icons/chevron.gif") !important;
b618d1fd 461}
462
749ee109 463#toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
b618d1fd 464 display: none;
465}
6082be94 466
749ee109
RK
467toolbarbutton.chevron > .toolbarbutton-text {
468 display: none; /* hide chevron label which has a width even if blank */
469}
470
471toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
472 display: -moz-box; /* display chevron icon in text mode */
473}
474
475/* Prevent [mode="icons"|"text"] from hiding the label and icon */
476#bookmarks-ptf .bookmark-item > .toolbarbutton-text,
477#bookmarks-ptf .bookmark-item > .toolbarbutton-icon {
478 display: -moz-box !important;
479}
480
e8fc8e8e 481#PersonalToolbar[iconsize="small"] > toolbarpaletteitem > #home-button > .toolbarbutton-icon,
0ef1663c
RK
482#PersonalToolbar[iconsize="small"] > #home-button > .toolbarbutton-icon {
483 /* width: 16px;
484 height: 16px; */
485}
486
487#PersonalToolbar > #home-button {
488 cursor: pointer;
489}
490
491#PersonalToolbar > #home-button[disabled="true"] {
492 cursor: default !important;
493}
494
e8fc8e8e
RK
495/*
496 In customize mode we hide the normal bookmark items and show a placeholder
497 for the drag/drop UI.
498*/
499.bookmarks-toolbar-customize {
d3d79c39 500 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png");
e8fc8e8e
RK
501 display: none;
502 max-width: 15em !important;
503}
504
d3d79c39
RK
505#wrapper-personal-bookmarks[place="palette"] > .toolbarpaletteitem-box {
506 width: 16px;
507 height: 16px;
508 background: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") no-repeat;
e8fc8e8e
RK
509}
510
1b3c8528
RK
511/* ::::: star button ::::: */
512
513#star-button {
514 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark.png");
515 -moz-image-region: rect(16px 16px 32px 0px);
516}
517
518#star-button:hover {
519 -moz-image-region: rect(16px 32px 32px 16px);
520}
521
522#star-button:hover:active {
523 -moz-image-region: rect(16px 48px 32px 32px);
524}
525
526#star-button[starred="true"] {
527 -moz-image-region: rect(0px 16px 16px 0px);
528}
529
530#star-button[starred="true"]:hover {
531 -moz-image-region: rect(0px 32px 16px 16px);
532}
533
534#star-button[starred="true"]:hover:active {
535 -moz-image-region: rect(0px 48px 16px 32px);
536}
537
a3b6328b
RK
538#editBookmarkPanelStarIcon {
539 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark.png");
540 -moz-image-region: rect(0px 16px 16px 0px);
541}
542
6082be94
RK
543/* ::::: feeds ::::: */
544
cf3319d7
RK
545.feedsMenu {
546 list-style-image: url("chrome://navigator/skin/linkButtons/feeds.png");
6082be94
RK
547 -moz-image-region: rect(0px 16px 16px 0px);
548}
549
cf3319d7 550.feedsMenu[disabled="true"] {
6082be94
RK
551 -moz-image-region: rect(32px 16px 48px 0px);
552}
553
cf3319d7 554.feedsButton {
6082be94
RK
555 list-style-image: url("chrome://navigator/skin/linkButtons/feeds.png");
556 -moz-image-region: rect(0px 32px 16px 16px);
557}
558
cf3319d7 559.feedsButton:hover {
6082be94
RK
560 -moz-image-region: rect(16px 32px 32px 16px);
561}
562
cf3319d7 563.feedsButton:hover:active {
6082be94
RK
564 -moz-image-region: rect(48px 32px 64px 16px);
565}