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