add some support for Australis without harming pre-Australis display
[themes.git] / LCARStrek / browser / customizableui / panelUIOverlay.css
CommitLineData
43cc2806
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/. */
4
5/* === BEGIN panelUIOverlay.inc.css === */
6
7.panel-subviews {
8 background-color: #000000;
9 -moz-margin-start: 38px;
10}
11
12.panel-subviews:-moz-locale-dir(rtl) {
13}
14
15.panel-viewstack[viewtype="main"] > .panel-subviews {
16 transform: translateX(21em);
17}
18
19.panel-viewstack[viewtype="main"] > .panel-subviews:-moz-locale-dir(rtl) {
20 transform: translateX(-21em);
21}
22
23.panel-viewstack:not([viewtype="main"]) > .panel-mainview > #PanelUI-mainView {
24 -moz-box-flex: 1;
25}
26
27#PanelUI-mainView {
28 display: flex;
29 flex-direction: column;
30}
31
32#app-extension-point-end > #PanelUI-menu-button {
33 padding: 2px 5px;
34}
35#app-extension-point-end > #PanelUI-menu-button .toolbarbutton-text {
36 display: none;
37}
38#app-extension-point-end > #PanelUI-menu-button .toolbarbutton-icon {
39 margin: 0;
40}
41
42#PanelUI-popup > arrowscrollbox > autorepeatbutton {
43 display: none;
44}
45#PanelUI-popup > arrowscrollbox > scrollbox {
46 overflow: visible;
47}
48
49#PanelUI-popup > .panel-arrowcontainer > .panel-arrowcontent {
50 overflow: hidden;
51 padding: 0;
52}
53
54#PanelUI-contents {
55 padding: .5em 0;
56}
57
58toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text,
59#bookmarks-menu-button > toolbarbutton > .toolbarbutton-text,
60:-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarpaletteitem > toolbaritem > toolbarbutton > .toolbarbutton-text,
61:-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbaritem > toolbarbutton > .toolbarbutton-text,
62:-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarpaletteitem > toolbarbutton > .toolbarbutton-text,
63:-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarbutton > .toolbarbutton-text {
64 font-size: 10px;
65}
66
67#wrapper-edit-controls:-moz-any([place="palette"],[place="panel"]) > #edit-controls,
68#wrapper-zoom-controls:-moz-any([place="palette"],[place="panel"]) > #zoom-controls {
69 -moz-margin-start: 0;
70}
71
72#PanelUI-contents,
73.panel-mainview:not([panelid="PanelUI-popup"]) {
74 max-width: 21em;
75}
76
77panelview:not([mainview]) .toolbarbutton-text,
78#customizationui-widget-panel toolbarbutton > .toolbarbutton-text {
79 text-align: start;
80 -moz-padding-start: 8px;
81 display: -moz-box;
82}
83
84#PanelUI-contents {
85 display: block;
86 flex: auto;
87 margin-left: auto;
88 margin-right: auto;
89 max-width: 21em;
90}
91
92#PanelUI-contents-scroller {
93 overflow-y: auto;
94 overflow-x: hidden;
95 width: 21em;
96 padding-left: 5px;
97 padding-right: 5px;
98 flex: auto;
99}
100
101#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton > .toolbarbutton-icon,
102#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton > .toolbarbutton-icon {
103 min-width: 0;
104 min-height: 0;
105 margin: 0;
106}
107
108toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item),
109#PanelUI-contents toolbarbutton,
110toolbarpaletteitem[place="panel"] > toolbarbutton,
111toolbarpaletteitem[place="palette"] > toolbarbutton,
112toolbarpaletteitem[place="panel"] > toolbaritem > toolbarbutton,
113toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton,
114.panel-customization-placeholder {
115 -moz-appearance: none;
116 -moz-box-orient: vertical;
117 min-width: 7em;
118 max-width: 7em;
119 height: 6em;
120 max-height: 6em;
121 padding: 0;
122 margin: 0;
123}
124
125.panel-customization-placeholder[expand],
126.panel-customization-placeholder[contract] {
127 transition-property: width;
128 transition-duration: 170ms;
129 transition-delay: 20ms;
130 transition-timing-function: ease-in-out;
131 min-width: 0;
132 max-width: none;
133}
134
135.panel-combined-button[disabled] > .toolbarbutton-icon {
136 opacity: .5;
137}
138
139toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] {
140 width: 7em;
141 margin: 0 !important;
142}
143
144toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-widget) {
145 -moz-box-align: center;
146 -moz-box-pack: center;
147}
148
149toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] > iframe {
150 margin: calc(5em / 12) auto;
151}
152
153toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text {
154 text-align: center;
155}
156
157.panel-customization-placeholder-child > .toolbarbutton-icon,
158#bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
159toolbarbutton[cui-areatype="menu-panel"] > .toolbarbutton-icon,
160toolbaritem[cui-areatype="menu-panel"] > toolbarbutton > .toolbarbutton-icon,
161toolbarpaletteitem[place="palette"] > #bookmarks-menu-button > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
162toolbarpaletteitem[place="palette"] > toolbarbutton > .toolbarbutton-icon,
163toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton > .toolbarbutton-icon {
164 min-width: calc(8em / 3);
165 min-height: calc(8em / 3);
166 margin: calc(5em / 12);
167}
168
169toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
170 -moz-box-flex: 1;
171}
172
173#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button,
174#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-reset-button {
175 border-left: none;
176 border-right: none;
177 border-radius: 0;
178}
179
180#zoom-in-button > .toolbarbutton-text,
181#zoom-out-button > .toolbarbutton-text,
182#zoom-reset-button > .toolbarbutton-icon {
183 display: none;
184}
185
186#PanelUI-footer {
187 display: flex;
188 background-color: #000000;
189 border-top: 1px solid #9C9CFF;
190 padding: 0;
191 margin: 0;
192 min-height: 4em;
193}
194
195#PanelUI-help,
196#PanelUI-customize,
197#PanelUI-quit {
198 margin: 0;
199 padding: 10px 0;
200 -moz-appearance: none;
201 box-shadow: none;
202 background-image: none;
203 border: 1px solid transparent;
204 border-bottom-style: none;
205 border-radius: 0;
206 transition: background-color;
207 -moz-box-orient: vertical;
208 flex: 1 1 33.33%;
209}
210:-moz-any(#PanelUI-help, #PanelUI-customize, #PanelUI-quit) > .toolbarbutton-icon {
211 margin: 0 0 3px;
212}
213
214#PanelUI-customize {
215 list-style-image: url("chrome://browser/skin/menuPanel-customize.png");
216}
217
218#PanelUI-help {
219 -moz-border-start-style: none;
220 list-style-image: url("chrome://browser/skin/menuPanel-help.png");
221}
222
223#PanelUI-quit {
224 -moz-border-end-style: none;
225 list-style-image: url("chrome://browser/skin/menuPanel-exit.png");
226}
227
228#PanelUI-customize,
229#PanelUI-help,
230#PanelUI-quit {
231 -moz-image-region: rect(0, 16px, 16px, 0);
232}
233
234#PanelUI-customize:hover,
235#PanelUI-help:not([disabled]):hover,
236#PanelUI-quit:not([disabled]):hover,
237#PanelUI-customize:hover:active,
238#PanelUI-help:not([disabled]):hover:active,
239#PanelUI-quit:not([disabled]):hover:active {
240 -moz-image-region: rect(0, 32px, 16px, 16px);
241}
242
243#PanelUI-help[disabled],
244#PanelUI-quit[disabled] {
245 -moz-image-region: rect(0, 48px, 16px, 32px);
246}
247
248#PanelUI-help:not([disabled]):hover,
249#PanelUI-customize:hover,
250#PanelUI-quit:not([disabled]):hover {
251/* border-color: rgba(8,25,42,0.2);
252 border-top-color: rgba(8,25,42,0.1);
253 background-color: rgba(0,0,0,0.1);
254 box-shadow: none;*/
255}
256
257#main-window[customize-entered] #PanelUI-customize {
258 color: #FFCF00;
259 background-color: #008484;
260}
261
262#main-window[customize-entered] #PanelUI-customize:hover,
263#main-window[customize-entered] #PanelUI-customize:hover:active {
264 color: #000000;
265 background-color: #FFCF00;
266}
267
268#customization-palette .toolbarbutton-text {
269 display: none;
270}
271
272panelview toolbarbutton,
273#widget-overflow-list > toolbarbutton,
274.customizationmode-button,
275#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
276#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
277#BMB_bookmarksPopup > menu,
278#BMB_bookmarksPopup > menuitem {
279 -moz-appearance: none;
280 padding: 2px 6px;
281/* background-color: hsla(210,4%,10%,0);
282 border-radius: 2px;
283 border: 1px solid;
284 border-color: hsla(210,4%,10%,0);*/
285 transition-property: background-color, border-color;
286 transition-duration: 150ms;
287}
288
289panelview .toolbarbutton-1,
290#widget-overflow-list > toolbarbutton {
291 margin-top: 6px;
292}
293/*
294panelview toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
295#widget-overflow-list > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
296.customizationmode-button,
297#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
298#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
299#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem):not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
300#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem):not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
301#BMB_bookmarksPopup > menu:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover,
302#BMB_bookmarksPopup > menuitem:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover {
303 background-color: hsla(210,4%,10%,.08);
304 border-color: hsla(210,4%,10%,.1);
305}
306
307panelview toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
308.customizationmode-button:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
309#widget-overflow-list > toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
310#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
311#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
312#BMB_bookmarksPopup > menu:not([disabled]):-moz-any([open],[checked="true"],:hover:active),
313#BMB_bookmarksPopup > menuitem:not([disabled]):-moz-any([open],[checked="true"],:hover:active) {
314 background-color: hsla(210,4%,10%,.15);
315 border-color: hsla(210,4%,10%,.15);
316 box-shadow: 0 1px 0 0 hsla(210,4%,10%,.05) inset;
317}
318*/
319#BMB_bookmarksPopup > menu,
320#BMB_bookmarksPopup > menuitem {
321 font: inherit;
322}
323
324#BMB_bookmarksPopup > menu:not([disabled="true"]),
325#BMB_bookmarksPopup > menuitem:not([disabled="true"]) {
326 color: inherit;
327}
328
329#BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-up,
330#BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-down {
331 -moz-appearance: none;
332 margin-top: 0;
333 margin-bottom: 0;
334}
335
336panelview toolbarseparator,
337#BMB_bookmarksPopup > menuseparator {
338 -moz-appearance: none;
339 min-height: 0;
340 border-top: 1px solid ThreeDShadow;
341 margin: 5px 0;
342}
343
344#PanelUI-historyItems > toolbarbutton {
345 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
346}
347
348#PanelUI-recentlyClosedWindows > toolbarbutton > .toolbarbutton-icon,
349#PanelUI-recentlyClosedTabs > toolbarbutton > .toolbarbutton-icon,
350#PanelUI-historyItems > toolbarbutton > .toolbarbutton-icon {
351 width: 16px;
352 height: 16px;
353}
354
355#PanelUI-footer.panel-multiview-anchor,
356#PanelUI-footer.panel-multiview-anchor > #PanelUI-help,
357toolbarbutton.panel-multiview-anchor {
358/* background-color: Highlight;
359 background-image: linear-gradient(rgba(255,255,255,0.3), rgba(255,255,255,0));
360 background-repeat: repeat-x;
361 color: HighlightText;*/
362}
363
364toolbarpaletteitem[place="palette"] > #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker,
365#bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-dropmarker {
366 display: none;
367}
368
369#search-container[cui-areatype="menu-panel"] {
370 width: 21em;
371}
372
373toolbarpaletteitem[place="palette"] > #search-container {
374 min-width: 7em;
375 width: 7em;
376}
377
378#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem),
379#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) {
380/* background-color: hsla(210,4%,10%,0);
381 border-radius: 2px;
382 border: 1px solid;
383 border-color: hsla(210,4%,10%,0);
384 border-bottom-color: hsla(210,4%,10%,.1);*/
385 padding: 0;
386 margin-bottom: -1px;
387 transition-property: background-color, border-color;
388 transition-duration: 150ms;
389}
390
391#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton,
392#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton {
393 border: 0;
394 padding: .5em;
395 margin: 0;
396 -moz-box-flex: 1;
397 /* reduce the width with 2px for each button to compensate for two separators
398 of 3px. */
399 min-width: calc(7em - 2px);
400 max-width: calc(7em - 2px);
401 height: auto;
402 max-height: none;
403 -moz-box-orient: horizontal;
404}
405
406#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton[disabled] > .toolbarbutton-icon,
407#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton[disabled] > .toolbarbutton-icon {
408 opacity: .25;
409}
410
411#zoom-controls[cui-areatype="toolbar"] > #zoom-reset-button > .toolbarbutton-text {
412 min-width: 7ch;
413}
414
415#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button:-moz-locale-dir(ltr),
416#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button:-moz-locale-dir(rtl),
417#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button:-moz-locale-dir(ltr),
418#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button:-moz-locale-dir(rtl) {
419 border-top-right-radius: 0;
420 border-bottom-right-radius: 0;
421}
422
423#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #cut-button:-moz-locale-dir(rtl),
424#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #paste-button:-moz-locale-dir(ltr),
425#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-out-button:-moz-locale-dir(rtl),
426#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-in-button:-moz-locale-dir(ltr) {
427 border-top-left-radius: 0;
428 border-bottom-left-radius: 0;
429}
430
431#edit-controls > separator,
432#zoom-controls > separator {
433 width: 3px;
434 -moz-box-align: stretch;
435/* background-image: linear-gradient(to bottom, hsla(0,0%,100%,0), hsla(0,0%,100%,.3) 40%, hsla(0,0%,100%,.3) 60%, hsla(0,0%,100%,0)),
436 linear-gradient(to bottom, hsla(210,54%,20%,0), hsla(210,54%,20%,.15) 40%, hsla(210,54%,20%,.15) 60%, hsla(210,54%,20%,0)),
437 linear-gradient(to bottom, hsla(0,0%,100%,0), hsla(0,0%,100%,.3) 40%, hsla(0,0%,100%,.3) 60%, hsla(0,0%,100%,0));
438 background-size: 1px, 1px, 1px;
439 background-position: 0 0, 1px 0, 2px 0;
440 background-repeat: no-repeat;*/
441}
442
443#widget-overflow > .panel-arrowcontainer > .panel-arrowcontent {
444 padding: 0;
445}
446
447#widget-overflow-scroller {
448 max-height: 30em;
449 overflow-y: auto;
450 overflow-x: hidden;
451 margin-top: 10px;
452 margin-bottom: 10px;
453}
454
455#widget-overflow-list {
456 width: 21em;
457 padding-left: 10px;
458 padding-right: 10px;
459}
460
461#widget-overflow-list > .overflowedItem {
462 width: 100%;
463 max-width: 21em;
464 min-height: 36px;
465 background-repeat: no-repeat;
466 background-position: 0 center;
467}
468
469#widget-overflow-list > toolbarbutton,
470#widget-overflow-list > toolbarbutton > toolbarbutton {
471 -moz-box-align: center;
472 -moz-box-orient: horizontal;
473}
474
475#widget-overflow-list > toolbarbutton > .toolbarbutton-text,
476#widget-overflow-list > #bookmarks-menu-button > toolbarbutton > .toolbarbutton-text {
477 text-align: start;
478 -moz-padding-start: .5em;
479}
480
481#widget-overflow-list > #edit-controls,
482#widget-overflow-list > #zoom-controls {
483 min-height: 28px;
484}
485
486#PanelUI-developerItems > toolbarbutton[checked="true"],
487#PanelUI-bookmarks > toolbarbutton[checked="true"],
488.PanelUI-characterEncodingView-list > toolbarbutton[current] {
489 -moz-padding-start: 4px;
490}
491
492#PanelUI-developerItems > toolbarbutton[checked="true"] > .toolbarbutton-text,
493#PanelUI-bookmarks > toolbarbutton[checked="true"] > .toolbarbutton-text,
494.PanelUI-characterEncodingView-list > toolbarbutton[current] > .toolbarbutton-text,
495#customizationui-widget-panel .PanelUI-characterEncodingView-list > toolbarbutton[current] > .toolbarbutton-text {
496 -moz-padding-start: 0px;
497}
498
499#BMB_bookmarksPopup > menuitem[checked="true"]::before,
500#PanelUI-bookmarks > toolbarbutton[checked="true"]::before,
501#PanelUI-developerItems > toolbarbutton[checked="true"]::before,
502.PanelUI-characterEncodingView-list > toolbarbutton[current]::before {
503 content: "✓";
504 display: -moz-box;
505 width: 12px;
506}
507
508#PanelUI-bookmarks > toolbarbutton[checked="true"]::before,
509#PanelUI-developerItems > toolbarbutton[checked="true"]::before,
510.PanelUI-characterEncodingView-list > toolbarbutton[current]::before {
511 -moz-margin-end: -2px;
512}
513
514#BMB_bookmarksPopup > menuitem[checked="true"] > .menu-iconic-left {
515 display: none;
516}
517
518/* === END panelUIOverlay.inc.css === */
519
520#PanelUI-contents #zoom-out-btn {
521 padding-left: 12px;
522 padding-right: 12px;
523}
524
525#PanelUI-contents #zoom-in-btn {
526 padding-left: 12px;
527 padding-right: 12px;
528}
529
530#BMB_bookmarksPopup > menu,
531#BMB_bookmarksPopup > menuitem {
532 padding-top: 1px;
533 padding-bottom: 1px;
534}
535
536#BMB_bookmarksPopup > menu > .menu-text,
537#BMB_bookmarksPopup > menuitem > .menu-text,
538#BMB_bookmarksPopup > menu > .menu-iconic-text,
539#BMB_bookmarksPopup > menuitem > .menu-iconic-text,
540#BMB_bookmarksPopup > menuseparator {
541 padding-top: 0;
542 padding-bottom: 0;
543}