also remove devtools from list of directories to process
[themes.git] / LCARStrek / browser / controlcenter / panel.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 panel.inc.css === */
6
7 /* Hide all conditional elements by default. */
8 :-moz-any([when-connection],[when-mixedcontent],[when-ciphers],[when-loginforms]) {
9   display: none;
10 }
11
12 /* Show the right elements for the right connection states. */
13 #identity-popup[connection=not-secure] [when-connection~=not-secure],
14 #identity-popup[connection=secure-cert-user-overridden] [when-connection~=secure-cert-user-overridden],
15 #identity-popup[connection=secure-ev] [when-connection~=secure-ev],
16 #identity-popup[connection=secure] [when-connection~=secure],
17 #identity-popup[connection=chrome] [when-connection~=chrome],
18 #identity-popup[connection=file] [when-connection~=file],
19 /* Show insecure login forms messages when needed. */
20 #identity-popup[loginforms=insecure] [when-loginforms=insecure],
21 /* Show weak cipher messages when needed. */
22 #identity-popup[ciphers=weak] [when-ciphers~=weak],
23 /* Show mixed content warnings when needed */
24 #identity-popup[mixedcontent~=active-loaded] [when-mixedcontent=active-loaded],
25 #identity-popup[mixedcontent~=passive-loaded]:not([mixedcontent~=active-loaded]) [when-mixedcontent=passive-loaded],
26 #identity-popup[mixedcontent~=active-blocked]:not([mixedcontent~=passive-loaded]) [when-mixedcontent=active-blocked],
27 /* Show the right elements when there is mixed passive content loaded and active blocked. */
28 #identity-popup[mixedcontent~=active-blocked][mixedcontent~=passive-loaded] [when-mixedcontent~=active-blocked][when-mixedcontent~=passive-loaded],
29 /* Show 'disable MCB' button always when there is mixed active content blocked. */
30 #identity-popup-securityView-body[mixedcontent~=active-blocked] > button[when-mixedcontent=active-blocked] {
31   display: inherit;
32 }
33
34 /* Hide redundant messages based on insecure login forms presence. */
35 #identity-popup[loginforms=secure] [and-when-loginforms=insecure] {
36   display: none;
37 }
38 #identity-popup[loginforms=insecure] [and-when-loginforms=secure] {
39   display: none;
40 }
41
42 /* Hide 'not secure' message in subview when weak cipher or mixed content messages are shown. */
43 #identity-popup-securityView-body:-moz-any([mixedcontent],[ciphers]) > description[when-connection=not-secure],
44 /* Hide 'passive-loaded (only)' message when there is mixed passive content loaded and active blocked. */
45 #identity-popup-securityView-body[mixedcontent~=passive-loaded][mixedcontent~=active-blocked] > description[when-mixedcontent=passive-loaded] {
46   display: none;
47 }
48
49 /* Make sure hidden elements don't accidentally become visible from one of the
50    above selectors (see Bug 1194258) */
51 #identity-popup [hidden] {
52   display: none !important;
53 }
54
55 #identity-popup,
56 #identity-popup:not([panelopen]) .panel-viewstack[viewtype="main"]:not([transitioning]) #identity-popup-mainView {
57   /* Tiny hack to ensure the panel shrinks back to its original
58      size after closing a subview that is bigger than the main view. */
59   max-height: 0;
60 }
61
62 .panel-mainview[panelid=identity-popup][viewtype=subview] > #identity-popup-mainView menulist,
63 .panel-mainview[panelid=identity-popup][viewtype=subview] > #identity-popup-mainView button:not([panel-multiview-anchor]) {
64   -moz-user-focus: ignore;
65 }
66
67 #identity-popup > .panel-arrowcontainer > .panel-arrowcontent {
68   padding: 0;
69 }
70
71 .panel-mainview[panelid=identity-popup] {
72   min-width: 30em;
73 }
74
75 #identity-popup-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="main"] > .panel-subviews {
76   transform: translateX(100%);
77   box-shadow: none;
78 }
79
80 #identity-popup-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="main"] > .panel-subviews:-moz-locale-dir(rtl) {
81   transform: translateX(-100%);
82 }
83
84 #identity-popup-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews {
85   background: var(--arrowpanel-background);
86   padding: 0;
87 }
88
89 .identity-popup-section:not(:first-child) {
90   border-top: 1px solid var(--panel-separator-color);
91 }
92
93 #identity-popup-securityView,
94 #identity-popup-security-content,
95 #identity-popup-permissions-content,
96 #tracking-protection-content {
97   background-repeat: no-repeat;
98   background-position: 1em 1em;
99   background-size: 24px auto;
100 }
101
102 #identity-popup-security-content,
103 #identity-popup-permissions-content,
104 #tracking-protection-content {
105   padding: 0.5em 0 1em;
106   /* .identity-popup-headline.host depends on this width */
107   padding-inline-start: calc(2em + 24px);
108   padding-inline-end: 1em;
109 }
110
111 #identity-popup-securityView:-moz-locale-dir(rtl),
112 #identity-popup-security-content:-moz-locale-dir(rtl),
113 #identity-popup-permissions-content:-moz-locale-dir(rtl),
114 #tracking-protection-content:-moz-locale-dir(rtl) {
115   background-position: calc(100% - 1em) 1em;
116 }
117
118 /* EXPAND BUTTON */
119
120 .identity-popup-expander {
121   margin: 0;
122   min-width: auto;
123   width: var(--identity-popup-expander-width);
124   background: url("chrome://browser/skin/controlcenter/arrow-subview.svg") center no-repeat;
125   background-size: 16px;
126   border-radius: 0 5px 5px 0;
127 }
128
129 .identity-popup-expander:-moz-locale-dir(rtl) {
130   transform: scaleX(-1);
131 }
132
133 .identity-popup-expander[panel-multiview-anchor] {
134   transition: background-color 250ms ease-in;
135   background-color: #008484;
136   background-image: url("chrome://browser/skin/controlcenter/arrow-subview-back.svg");
137   color: #000000;
138 }
139
140 .identity-popup-expander > .button-box,
141 .identity-popup-expander > .button-box:focus {
142   padding: 4px 0;
143   border-radius: 0 5px 5px 0;
144 }
145
146 .identity-popup-expander[panel-multiview-anchor] > .button-box,
147 .identity-popup-expander[panel-multiview-anchor] > .button-box:focus {
148 }
149
150 .identity-popup-expander:hover {
151   background-image: url("chrome://browser/skin/controlcenter/arrow-subview.svg#arrow-active");
152   background-color: var(--arrowpanel-hover);
153 }
154
155 .identity-popup-expander:hover > .button-box > .button-icon {
156   filter: url(chrome://global/skin/filters.svg#fill);
157   fill: #000000;
158 }
159
160 .identity-popup-expander:hover:active {
161   background-image: url("chrome://browser/skin/controlcenter/arrow-subview.svg#arrow-active");
162   background-color: var(--arrowpanel-active);
163 }
164
165 /* CONTENT */
166
167 .identity-popup-permission-label,
168 .identity-popup-permission-state-label,
169 #identity-popup-security-content > description,
170 #identity-popup-security-descriptions > description,
171 #identity-popup-securityView-header > description,
172 #identity-popup-securityView-body > description,
173 #identity-popup-permissions-content > description,
174 #tracking-protection-content > label,
175 .identity-popup-text {
176   white-space: pre-wrap;
177   font-size: 110%;
178   margin: 0;
179 }
180
181 .identity-popup-headline {
182   margin: 3px 0 4px;
183   font-size: 150%;
184 }
185
186 .identity-popup-headline.host {
187   word-wrap: break-word;
188   /* 1em + 2em + 24px is #identity-popup-security-content padding
189    * 30em is .panel-mainview:not([panelid="PanelUI-popup"]) width */
190   max-width: calc(30rem - 3rem - 24px - var(--identity-popup-expander-width))
191 }
192
193 .identity-popup-warning-gray {
194   padding-inline-start: 24px;
195   background: url(chrome://browser/skin/controlcenter/warning-gray.svg) no-repeat 0 50%;
196 }
197
198 .identity-popup-warning-yellow {
199   padding-inline-start: 24px;
200   background: url(chrome://browser/skin/controlcenter/warning-yellow.svg) no-repeat 0 50%;
201 }
202
203 .identity-popup-warning-gray:-moz-locale-dir(rtl),
204 .identity-popup-warning-yellow:-moz-locale-dir(rtl) {
205   background-position: 100% 50%;
206 }
207
208 /* SECURITY */
209
210 #identity-popup-securityView > .identity-popup-text:not(#identity-popup-content-owner) {
211   margin: 2px 0 4px;
212 }
213
214 .identity-popup-connection-secure {
215   color: #008484;
216 }
217
218 .identity-popup-connection-not-secure {
219   color: #9C9CFF;
220 }
221
222 #identity-popup-security-content.chromeUI {
223   background-image: url(chrome://branding/content/icon48.png);
224 }
225
226 /* SECURITY SUBVIEW */
227
228 #identity-popup-securityView {
229   overflow: hidden;
230 }
231
232 #identity-popup-securityView,
233 #identity-popup-security-content {
234   background-image: url(chrome://browser/skin/controlcenter/conn-not-secure.svg);
235 }
236
237 #identity-popup[connection=chrome] #identity-popup-securityView,
238 #identity-popup[connection=chrome] #identity-popup-security-content {
239   background-image: url(chrome://branding/content/icon48.png);
240 }
241
242 #identity-popup[connection^=secure] #identity-popup-securityView,
243 #identity-popup[connection^=secure] #identity-popup-security-content {
244   background-image: url(chrome://browser/skin/controlcenter/connection.svg#connection-secure);
245 }
246
247 /* Use [isbroken] to make sure we don't show a lock on an http page. See Bug 1192162. */
248 #identity-popup[ciphers=weak] #identity-popup-securityView,
249 #identity-popup[ciphers=weak] #identity-popup-security-content,
250 #identity-popup[mixedcontent~=passive-loaded][isbroken] #identity-popup-securityView,
251 #identity-popup[mixedcontent~=passive-loaded][isbroken] #identity-popup-security-content {
252   background-image: url(chrome://browser/skin/controlcenter/connection.svg#connection-degraded);
253 }
254
255 #identity-popup[connection=secure-cert-user-overridden] #identity-popup-securityView,
256 #identity-popup[connection=secure-cert-user-overridden] #identity-popup-security-content {
257   background-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon);
258 }
259
260 #identity-popup[loginforms=insecure] #identity-popup-securityView,
261 #identity-popup[loginforms=insecure] #identity-popup-security-content,
262 #identity-popup[mixedcontent~=active-loaded][isbroken] #identity-popup-securityView,
263 #identity-popup[mixedcontent~=active-loaded][isbroken] #identity-popup-security-content {
264   background-image: url(chrome://browser/skin/controlcenter/mcb-disabled.svg);
265 }
266
267 #identity-popup-security-descriptions > description {
268   margin-top: 6px;
269   color: #A09090;
270 }
271
272 #identity-popup-securityView-header,
273 #identity-popup-securityView-body {
274   margin-inline-start: calc(2em + 24px);
275   margin-inline-end: 1em;
276 }
277
278 #identity-popup-securityView-header {
279   margin-top: 0.5em;
280   border-bottom: 1px solid var(--panel-separator-color);
281   padding-bottom: 1em;
282 }
283
284 #identity-popup-securityView-body {
285   padding-inline-end: 1em;
286 }
287
288 #identity-popup-securityView-footer {
289   margin-top: 1em;
290   background-color: var(--arrowpanel-dimmed);
291 }
292
293 #identity-popup-securityView-footer > button {
294 }
295
296 #identity-popup-securityView-footer > button:hover,
297 #identity-popup-securityView-footer > button:focus {
298 }
299
300 #identity-popup-securityView-footer > button:hover:active {
301 }
302
303 #identity-popup-content-verifier ~ description {
304   margin-top: 1em;
305   color: #A09090;
306 }
307
308 description#identity-popup-content-verified-by,
309 description#identity-popup-content-owner,
310 description#identity-popup-content-verifier,
311 #identity-popup-securityView-body > button {
312   margin-top: 1em;
313 }
314
315 #identity-popup-securityView-body > button {
316   margin-inline-start: 0;
317   margin-inline-end: 0;
318 }
319
320 /* TRACKING PROTECTION */
321
322 #tracking-protection-content {
323   background-image: url("chrome://browser/skin/controlcenter/tracking-protection.svg#enabled");
324 }
325
326 #tracking-protection-content[state="loaded-tracking-content"]  {
327   background-image: url("chrome://browser/skin/controlcenter/tracking-protection.svg#disabled");
328 }
329
330 #tracking-action-block,
331 #tracking-action-unblock,
332 #tracking-action-unblock-private,
333 #identity-popup-securityView-body > button {
334   margin: 1em 0 0;
335 }
336
337 #tracking-protection-content[state] > #tracking-not-detected,
338 #tracking-protection-content:not([state="blocked-tracking-content"]) > #tracking-blocked,
339 #main-window[privatebrowsingmode] #tracking-action-unblock,
340 #main-window:not([privatebrowsingmode]) #tracking-action-unblock-private,
341 #tracking-protection-content:not([state="blocked-tracking-content"]) #tracking-action-unblock,
342 #tracking-protection-content:not([state="blocked-tracking-content"]) #tracking-action-unblock-private,
343 #tracking-protection-content:not([state="loaded-tracking-content"]) > #tracking-loaded,
344 #tracking-protection-content:not([state="loaded-tracking-content"]) #tracking-action-block,
345 #tracking-protection-content:not([state]) > #tracking-actions {
346   display: none;
347 }
348
349 /* PERMISSIONS */
350
351 #identity-popup-permissions-content {
352   background-image: url(chrome://browser/skin/controlcenter/permissions.svg);
353 }
354
355 #identity-popup-permissions-headline {
356   /* Make sure the label is as tall as the icon so that the permission list
357      which is aligned with the icon doesn't cover it up. */
358   min-height: 24px;
359 }
360
361 #identity-popup-permission-list {
362   /* Offset the padding set on #identity-popup-permissions-content so that it
363      shows up just below the section. The permission icons are 16px wide and
364      should be right aligned with the section icon. */
365   margin-inline-start: calc(-1em - 16px);
366 }
367
368 .identity-popup-permission-item {
369   min-height: 24px;
370 }
371
372 #identity-popup-permission-list:not(:empty) {
373   margin-top: 5px;
374 }
375
376 .identity-popup-permission-icon {
377   width: 16px;
378   height: 16px;
379 }
380
381 .identity-popup-permission-icon.in-use {
382   animation: 1.5s ease in-use-blink infinite;
383 }
384
385 @keyframes in-use-blink {
386   50% { opacity: 0; }
387 }
388
389 .identity-popup-permission-label,
390 .identity-popup-permission-state-label {
391   /* We need to align the action buttons and permission icons with the text.
392      This is tricky because the icon height is defined in pixels, while the
393      font height can vary with platform and system settings, and at least on
394      Windows the default font metrics reserve more extra space for accents.
395      This value is a good compromise for different platforms and font sizes. */
396   margin-top: -0.1em;
397 }
398
399 .identity-popup-permission-label {
400   margin-inline-start: 1em;
401 }
402
403 .identity-popup-permission-state-label {
404   margin-inline-end: 5px;
405   text-align: end;
406   color: #A09090;
407 }
408
409 .identity-popup-permission-remove-button {
410   margin: 0;
411   border-width: 0;
412   border-radius: 50%;
413   min-width: 0;
414   padding: 2px;
415   background-color: transparent;
416 }
417
418 .identity-popup-permission-remove-button > .button-box {
419   padding: 0;
420 }
421
422 .identity-popup-permission-remove-button > .button-box > .button-icon {
423   margin: 0;
424   width: 16px;
425   height: 16px;
426   list-style-image: url(chrome://browser/skin/panel-icons.svg#cancel);
427   filter: url(chrome://global/skin/filters.svg#fill);
428   fill: #A09090;
429 }
430
431 .identity-popup-permission-remove-button > .button-box > .button-text {
432   display: none;
433 }
434
435 .identity-popup-permission-remove-button:not(:-moz-focusring):hover {
436   background-color: #FFCF00;
437 }
438
439 .identity-popup-permission-remove-button:not(:-moz-focusring):hover > .button-box > .button-icon {
440   fill: #000000;
441 }
442
443 .identity-popup-permission-remove-button:not(:-moz-focusring):hover:active {
444   background-color: #FF9F00;
445 }
446
447 /* === END panel.inc.css === */
448
449 .identity-popup-expander:-moz-focusring {
450   padding: 1px;
451 }
452
453 .identity-popup-expander:-moz-focusring > .button-box {
454   outline: 1px #008484 dotted;
455 }