make all menubuttons have a black and visible dropmarker
[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
cc4b0b0d
RK
7#customization-panelHolder {
8 border-radius: 4px;
9}
10
43cc2806
RK
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 display: flex;
33 flex-direction: column;
cc4b0b0d 34 border-radius: 4px;
43cc2806
RK
35}
36
37#app-extension-point-end > #PanelUI-menu-button {
38 padding: 2px 5px;
39}
40#app-extension-point-end > #PanelUI-menu-button .toolbarbutton-text {
41 display: none;
42}
43#app-extension-point-end > #PanelUI-menu-button .toolbarbutton-icon {
44 margin: 0;
45}
46
47#PanelUI-popup > arrowscrollbox > autorepeatbutton {
48 display: none;
49}
50#PanelUI-popup > arrowscrollbox > scrollbox {
51 overflow: visible;
52}
53
54#PanelUI-popup > .panel-arrowcontainer > .panel-arrowcontent {
55 overflow: hidden;
56 padding: 0;
57}
58
59#PanelUI-contents {
60 padding: .5em 0;
61}
62
63toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text,
64#bookmarks-menu-button > toolbarbutton > .toolbarbutton-text,
65:-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarpaletteitem > toolbaritem > toolbarbutton > .toolbarbutton-text,
66:-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbaritem > toolbarbutton > .toolbarbutton-text,
67:-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarpaletteitem > toolbarbutton > .toolbarbutton-text,
68:-moz-any(#PanelUI-contents,#widget-overflow-list) > toolbarbutton > .toolbarbutton-text {
69 font-size: 10px;
70}
71
72#wrapper-edit-controls:-moz-any([place="palette"],[place="panel"]) > #edit-controls,
73#wrapper-zoom-controls:-moz-any([place="palette"],[place="panel"]) > #zoom-controls {
74 -moz-margin-start: 0;
75}
76
77#PanelUI-contents,
78.panel-mainview:not([panelid="PanelUI-popup"]) {
79 max-width: 21em;
80}
81
82panelview:not([mainview]) .toolbarbutton-text,
83#customizationui-widget-panel toolbarbutton > .toolbarbutton-text {
84 text-align: start;
85 -moz-padding-start: 8px;
86 display: -moz-box;
87}
88
89#PanelUI-contents {
90 display: block;
91 flex: auto;
92 margin-left: auto;
93 margin-right: auto;
94 max-width: 21em;
95}
96
97#PanelUI-contents-scroller {
98 overflow-y: auto;
99 overflow-x: hidden;
100 width: 21em;
101 padding-left: 5px;
102 padding-right: 5px;
103 flex: auto;
104}
105
106#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton > .toolbarbutton-icon,
107#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > toolbarbutton > .toolbarbutton-icon {
108 min-width: 0;
109 min-height: 0;
110 margin: 0;
111}
112
113toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item),
114#PanelUI-contents toolbarbutton,
115toolbarpaletteitem[place="panel"] > toolbarbutton,
116toolbarpaletteitem[place="palette"] > toolbarbutton,
117toolbarpaletteitem[place="panel"] > toolbaritem > toolbarbutton,
118toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton,
119.panel-customization-placeholder {
120 -moz-appearance: none;
121 -moz-box-orient: vertical;
122 min-width: 7em;
123 max-width: 7em;
124 height: 6em;
125 max-height: 6em;
126 padding: 0;
127 margin: 0;
128}
129
130.panel-customization-placeholder[expand],
131.panel-customization-placeholder[contract] {
132 transition-property: width;
133 transition-duration: 170ms;
134 transition-delay: 20ms;
135 transition-timing-function: ease-in-out;
136 min-width: 0;
137 max-width: none;
138}
139
140.panel-combined-button[disabled] > .toolbarbutton-icon {
cc4b0b0d 141/* opacity: .5; */
43cc2806
RK
142}
143
144toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] {
145 width: 7em;
146 margin: 0 !important;
147}
148
149toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-widget) {
150 -moz-box-align: center;
151 -moz-box-pack: center;
152}
153
154toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] > iframe {
155 margin: calc(5em / 12) auto;
156}
157
158toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text {
159 text-align: center;
160}
161
162.panel-customization-placeholder-child > .toolbarbutton-icon,
163#bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
164toolbarbutton[cui-areatype="menu-panel"] > .toolbarbutton-icon,
165toolbaritem[cui-areatype="menu-panel"] > toolbarbutton > .toolbarbutton-icon,
166toolbarpaletteitem[place="palette"] > #bookmarks-menu-button > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
167toolbarpaletteitem[place="palette"] > toolbarbutton > .toolbarbutton-icon,
168toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton > .toolbarbutton-icon {
169 min-width: calc(8em / 3);
170 min-height: calc(8em / 3);
171 margin: calc(5em / 12);
172}
173
174toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
175 -moz-box-flex: 1;
176}
177
178#edit-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #copy-button,
179#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]),.overflowedItem) > #zoom-reset-button {
180 border-left: none;
181 border-right: none;
182 border-radius: 0;
183}
184
185#zoom-in-button > .toolbarbutton-text,
186#zoom-out-button > .toolbarbutton-text,
187#zoom-reset-button > .toolbarbutton-icon {
188 display: none;
189}
190
191#PanelUI-footer {
192 display: flex;
193 background-color: #000000;
194 border-top: 1px solid #9C9CFF;
195 padding: 0;
196 margin: 0;
197 min-height: 4em;
cc4b0b0d
RK
198 border-bottom-right-radius: 4px;
199 border-bottom-left-radius: 4px;
43cc2806
RK
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;
cc4b0b0d 214 -moz-box-orient: horizontal;
43cc2806 215}
cc4b0b0d
RK
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;
43cc2806
RK
234}
235
236#PanelUI-customize {
cc4b0b0d
RK
237 flex: 1;
238 -moz-padding-start: 15px;
239 -moz-border-start-style: none;
43cc2806
RK
240 list-style-image: url("chrome://browser/skin/menuPanel-customize.png");
241}
242
243#PanelUI-help {
43cc2806
RK
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
296panelview 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
313panelview .toolbarbutton-1,
314#widget-overflow-list > toolbarbutton {
315 margin-top: 6px;
316}
317/*
318panelview 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
331panelview 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
360panelview 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,
381toolbarbutton.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
388toolbarpaletteitem[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
397toolbarpaletteitem[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 {
cc4b0b0d 432/* opacity: .25; */
43cc2806
RK
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}