fourth part of syncing LCARStrek with Firefox 42-44 windows theme changes
[themes.git] / LCARStrek / browser / controlcenter / panel.css
CommitLineData
2e389898
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 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-ev] [when-connection~=secure-ev],
15#identity-popup[connection=secure] [when-connection~=secure],
16#identity-popup[connection=chrome] [when-connection~=chrome],
17#identity-popup[connection=file] [when-connection~=file],
18/* Show insecure login forms messages when needed. */
19#identity-popup[loginforms=insecure] [when-loginforms=insecure],
20/* Show weak cipher messages when needed. */
21#identity-popup[ciphers=weak] [when-ciphers~=weak],
22/* Show mixed content warnings when needed */
23#identity-popup[mixedcontent~=active-loaded] [when-mixedcontent=active-loaded],
24#identity-popup[mixedcontent~=passive-loaded]:not([mixedcontent~=active-loaded]) [when-mixedcontent=passive-loaded],
25#identity-popup[mixedcontent~=active-blocked]:not([mixedcontent~=passive-loaded]) [when-mixedcontent=active-blocked],
26/* Show the right elements when there is mixed passive content loaded and active blocked. */
27#identity-popup[mixedcontent~=active-blocked][mixedcontent~=passive-loaded] [when-mixedcontent~=active-blocked][when-mixedcontent~=passive-loaded],
28/* Show 'disable MCB' button always when there is mixed active content blocked. */
29#identity-popup-securityView-body[mixedcontent~=active-blocked] > button[when-mixedcontent=active-blocked] {
30 display: inherit;
31}
32
33/* Hide redundant messages based on insecure login forms presence. */
34#identity-popup[loginforms=secure] [and-when-loginforms=insecure] {
35 display: none;
36}
37#identity-popup[loginforms=insecure] [and-when-loginforms=secure] {
470b6552
RK
38 display: none;
39}
40
2e389898
RK
41/* Hide 'not secure' message in subview when weak cipher or mixed content messages are shown. */
42#identity-popup-securityView-body:-moz-any([mixedcontent],[ciphers]) > description[when-connection=not-secure],
43/* Hide 'passive-loaded (only)' message when there is mixed passive content loaded and active blocked. */
44#identity-popup-securityView-body[mixedcontent~=passive-loaded][mixedcontent~=active-blocked] > description[when-mixedcontent=passive-loaded] {
45 display: none;
46}
47
48/* Make sure hidden elements don't accidentally become visible from one of the
49 above selectors (see Bug 1194258) */
50#identity-popup [hidden] {
51 display: none !important;
52}
470b6552
RK
53
54#identity-popup,
2e389898 55#identity-popup:not([panelopen]) .panel-viewstack[viewtype="main"]:not([transitioning]) #identity-popup-mainView {
470b6552
RK
56 /* Tiny hack to ensure the panel shrinks back to its original
57 size after closing a subview that is bigger than the main view. */
58 max-height: 0;
59}
60
2e389898
RK
61.panel-mainview[panelid=identity-popup][viewtype=subview] > #identity-popup-mainView menulist,
62.panel-mainview[panelid=identity-popup][viewtype=subview] > #identity-popup-mainView button:not([panel-multiview-anchor]) {
63 -moz-user-focus: ignore;
64}
65
470b6552
RK
66#identity-popup > .panel-arrowcontainer > .panel-arrowcontent {
67 padding: 0;
68}
69
70.panel-mainview[panelid=identity-popup] {
71 min-width: 30em;
72}
73
74#identity-popup-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="main"] > .panel-subviews {
75 transform: translateX(100%);
76 box-shadow: none;
77}
78
79#identity-popup-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="main"] > .panel-subviews:-moz-locale-dir(rtl) {
80 transform: translateX(-100%);
81}
82
83#identity-popup-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews {
84 background: var(--panel-arrowcontent-background);
85 border-bottom-right-radius: 3.5px;
86 padding: 0;
87}
88
89#identity-popup-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews:-moz-locale-dir(rtl) {
90 border-bottom-right-radius: 0;
91 border-bottom-left-radius: 3.5px;
92}
93
94.identity-popup-section:not(:first-child) {
c9b0a396 95 border-top: 1px solid var(--panel-separator-color);
470b6552
RK
96}
97
98#identity-popup-securityView,
99#identity-popup-security-content,
100#identity-popup-permissions-content,
101#tracking-protection-content {
b336389b 102 padding: 0.5em 0 1em;
470b6552
RK
103 -moz-padding-start: calc(2em + 24px);
104 -moz-padding-end: 1em;
105 background-repeat: no-repeat;
106 background-position: 1em 1em;
107 background-size: 24px auto;
108}
109
110#identity-popup-securityView:-moz-locale-dir(rtl),
111#identity-popup-security-content:-moz-locale-dir(rtl),
112#identity-popup-permissions-content:-moz-locale-dir(rtl),
113#tracking-protection-content:-moz-locale-dir(rtl) {
114 background-position: calc(100% - 1em) 1em;
115}
116
470b6552
RK
117/* EXPAND BUTTON */
118
119.identity-popup-expander {
120 margin: 0;
121 min-width: auto;
122 width: 38px;
123 background-image: url("chrome://browser/skin/controlcenter/arrow-subview.svg#arrow");
124 background-size: 16px, auto;
125 background-position: center;
126 background-repeat: no-repeat;
127 background-color: transparent;
128 border-radius: 0 5px 5px 0;
129}
130
131.identity-popup-expander:-moz-locale-dir(rtl) {
132 transform: scaleX(-1);
133}
134
135.identity-popup-expander[panel-multiview-anchor] {
136 transition: background-color 250ms ease-in;
137 background-color: #008484;
b336389b 138 background-image: url("chrome://browser/skin/controlcenter/arrow-subview-back.svg");
b1dfcf32 139 color: #000000;
470b6552
RK
140}
141
142.identity-popup-expander > .button-box,
143.identity-popup-expander > .button-box:focus {
144 padding: 4px 0;
145 border-radius: 0 5px 5px 0;
146}
147
148.identity-popup-expander[panel-multiview-anchor] > .button-box,
149.identity-popup-expander[panel-multiview-anchor] > .button-box:focus {
150}
151
152.identity-popup-expander:hover {
153 background-image: url("chrome://browser/skin/controlcenter/arrow-subview.svg#arrow-active");
154 background-color: #FFCF00;
155}
156
157.identity-popup-expander:hover:active {
158 background-image: url("chrome://browser/skin/controlcenter/arrow-subview.svg#arrow-active");
159 background-color: #FF9F00;
160}
161
162/* CONTENT */
163
b336389b
RK
164#identity-popup-security-content > description,
165#identity-popup-security-descriptions > description,
166#identity-popup-securityView-header > description,
167#identity-popup-securityView-body > description,
168#identity-popup-permissions-content > description,
169#tracking-protection-content > label,
470b6552
RK
170.identity-popup-text {
171 white-space: pre-wrap;
172 font-size: 110%;
173 margin: 0;
174}
175
176.identity-popup-headline {
024a65e9 177 margin: 3px 0 4px;
470b6552
RK
178 font-size: 150%;
179}
b336389b
RK
180.identity-popup-warning-gray {
181 -moz-padding-start: 24px;
182 background: url(chrome://browser/skin/controlcenter/warning-gray.svg) no-repeat 0 50%;
183}
184
185.identity-popup-warning-yellow {
186 -moz-padding-start: 24px;
187 background: url(chrome://browser/skin/controlcenter/warning-yellow.svg) no-repeat 0 50%;
188}
189
190.identity-popup-warning-gray:-moz-locale-dir(rtl),
191.identity-popup-warning-yellow:-moz-locale-dir(rtl) {
192 background-position: 100% 50%;
193}
470b6552
RK
194
195/* SECURITY */
196
197#identity-popup-securityView > .identity-popup-text:not(#identity-popup-content-owner) {
198 margin: 2px 0 4px;
199}
200
201.identity-popup-connection-secure {
202 color: #008484;
203}
204
205.identity-popup-connection-not-secure {
206 color: #9C9CFF;
207}
208
209#identity-popup-security-content.chromeUI {
210 background-image: url(chrome://branding/content/icon48.png);
211}
212
213/* SECURITY SUBVIEW */
214
215#identity-popup-securityView {
216 padding-bottom: 2em;
217 overflow: hidden;
218}
219
220#identity-popup-securityView,
221#identity-popup-security-content {
222 background-image: url(chrome://browser/skin/controlcenter/conn-not-secure.svg);
223}
224
024a65e9
RK
225#identity-popup[connection=chrome] #identity-popup-securityView,
226#identity-popup[connection=chrome] #identity-popup-security-content {
227 background-image: url(chrome://branding/content/icon48.png);
228}
229
230#identity-popup[connection^=secure] #identity-popup-securityView,
231#identity-popup[connection^=secure] #identity-popup-security-content {
c9b0a396 232 background-image: url(chrome://browser/skin/controlcenter/conn-secure.svg);
470b6552
RK
233}
234
024a65e9
RK
235/* Use [isbroken] to make sure we don't show a lock on an http page. See Bug 1192162. */
236#identity-popup[ciphers=weak] #identity-popup-securityView,
237#identity-popup[ciphers=weak] #identity-popup-security-content,
238#identity-popup[mixedcontent~=passive-loaded][isbroken] #identity-popup-securityView,
239#identity-popup[mixedcontent~=passive-loaded][isbroken] #identity-popup-security-content {
19988d2d
RK
240 background-image: url(chrome://browser/skin/controlcenter/conn-degraded.svg);
241}
242
024a65e9
RK
243#identity-popup[connection=secure-cert-user-overridden] #identity-popup-securityView,
244#identity-popup[connection=secure-cert-user-overridden] #identity-popup-security-content {
245 background-image: url(chrome://browser/skin/identity-mixed-passive-loaded.svg);
246}
247
248#identity-popup[loginforms=insecure] #identity-popup-securityView,
249#identity-popup[loginforms=insecure] #identity-popup-security-content,
250#identity-popup[mixedcontent~=active-loaded][isbroken] #identity-popup-securityView,
251#identity-popup[mixedcontent~=active-loaded][isbroken] #identity-popup-security-content {
470b6552
RK
252 background-image: url(chrome://browser/skin/controlcenter/mcb-disabled.svg);
253}
254
024a65e9
RK
255#identity-popup-security-descriptions > description {
256 margin-top: 6px;
257 color: #A09090;
258}
259
260#identity-popup-securityView-header,
261#identity-popup-securityView-body {
262 -moz-margin-start: calc(2em + 24px);
263 -moz-margin-end: 1em;
264}
265
470b6552 266#identity-popup-securityView-header {
024a65e9 267 margin-top: 0.5em;
c9b0a396 268 border-bottom: 1px solid var(--panel-separator-color);
470b6552 269 padding-bottom: 1em;
470b6552
RK
270}
271
024a65e9
RK
272#identity-popup-securityView-body {
273 -moz-padding-end: 1em;
274}
275
276#identity-popup-securityView-footer {
277 margin-top: 1em;
278 background-color: hsla(210,4%,10%,.07);
279}
280
281#identity-popup-securityView-footer > button {
282}
283
284#identity-popup-securityView-footer > button:hover,
285#identity-popup-securityView-footer > button:focus {
470b6552
RK
286}
287
024a65e9
RK
288#identity-popup-securityView-footer > button:hover:active {
289}
290
291#identity-popup-content-verifier ~ description {
292 margin-top: 1em;
470b6552
RK
293 color: #A09090;
294}
295
024a65e9
RK
296description#identity-popup-content-verified-by,
297description#identity-popup-content-owner,
298description#identity-popup-content-verifier,
299#identity-popup-securityView-body > button {
470b6552
RK
300 margin-top: 1em;
301}
302
024a65e9
RK
303#identity-popup-securityView-body > button {
304 margin-inline-start: 0;
305 margin-inline-end: 0;
306}
307
470b6552
RK
308/* TRACKING PROTECTION */
309
310#tracking-protection-content {
311 background-image: url("chrome://browser/skin/controlcenter/tracking-protection.svg");
312}
313
19988d2d 314#tracking-protection-content[state="loaded-tracking-content"] {
470b6552
RK
315 background-image: url("chrome://browser/skin/controlcenter/tracking-protection-disabled.svg");
316}
317
318#tracking-action-block,
b336389b 319#tracking-action-unblock,
b1dfcf32
RK
320#tracking-action-unblock-private,
321#identity-popup-securityView-body > button {
470b6552
RK
322 margin: 1em 0 0;
323}
324
b336389b
RK
325#tracking-protection-content[state] > #tracking-not-detected,
326#tracking-protection-content:not([state="blocked-tracking-content"]) > #tracking-blocked,
327#main-window[privatebrowsingmode] #tracking-action-unblock,
328#main-window:not([privatebrowsingmode]) #tracking-action-unblock-private,
329#tracking-protection-content:not([state="blocked-tracking-content"]) #tracking-action-unblock,
330#tracking-protection-content:not([state="blocked-tracking-content"]) #tracking-action-unblock-private,
331#tracking-protection-content:not([state="loaded-tracking-content"]) > #tracking-loaded,
332#tracking-protection-content:not([state="loaded-tracking-content"]) #tracking-action-block,
19988d2d 333#tracking-protection-content:not([state]) > #tracking-actions {
470b6552
RK
334 display: none;
335}
336
337/* PERMISSIONS */
338
339#identity-popup-permissions-content {
340 background-image: url(chrome://browser/skin/controlcenter/permissions.svg);
341}
342
024a65e9
RK
343#identity-popup-permission-list menulist {
344 min-width: 60px;
345}
346
470b6552
RK
347#identity-popup-permission-list {
348 margin-top: 5px;
349}
350
351.identity-popup-permission-label {
352 -moz-margin-start: 0;
024a65e9 353 word-wrap: break-word;
470b6552
RK
354}
355
2e389898
RK
356/* === END panel.inc.css === */
357
b336389b
RK
358.identity-popup-expander:-moz-focusring {
359 padding: 1px;
2e389898
RK
360}
361
b336389b
RK
362.identity-popup-expander:-moz-focusring > .button-box {
363 outline: 1px #008484 dotted;
2e389898 364}