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/. */
5 /* === BEGIN panel.inc.css === */
7 /* Hide all conditional elements by default. */
8 :-moz-any([when-connection],[when-mixedcontent],[when-ciphers],[when-loginforms]) {
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] {
33 /* Hide redundant messages based on insecure login forms presence. */
34 #identity-popup[loginforms=secure] [and-when-loginforms=insecure] {
37 #identity-popup[loginforms=insecure] [and-when-loginforms=secure] {
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] {
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;
55 #identity-popup:not([panelopen]) .panel-viewstack[viewtype="main"]:not([transitioning]) #identity-popup-mainView {
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. */
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;
66 #identity-popup > .panel-arrowcontainer > .panel-arrowcontent {
70 .panel-mainview[panelid=identity-popup] {
74 #identity-popup-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="main"] > .panel-subviews {
75 transform: translateX(100%);
79 #identity-popup-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="main"] > .panel-subviews:-moz-locale-dir(rtl) {
80 transform: translateX(-100%);
83 #identity-popup-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews {
84 background: var(--panel-arrowcontent-background);
85 border-bottom-right-radius: 3.5px;
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;
94 .identity-popup-section:not(:first-child) {
95 border-top: 1px solid var(--panel-separator-color);
98 #identity-popup-securityView,
99 #identity-popup-security-content,
100 #identity-popup-permissions-content,
101 #tracking-protection-content {
102 padding: 0.5em 0 1em;
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;
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;
119 .identity-popup-expander {
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;
131 .identity-popup-expander:-moz-locale-dir(rtl) {
132 transform: scaleX(-1);
135 .identity-popup-expander[panel-multiview-anchor] {
136 transition: background-color 250ms ease-in;
137 background-color: #008484;
138 background-image: url("chrome://browser/skin/controlcenter/arrow-subview-back.svg");
142 .identity-popup-expander > .button-box,
143 .identity-popup-expander > .button-box:focus {
145 border-radius: 0 5px 5px 0;
148 .identity-popup-expander[panel-multiview-anchor] > .button-box,
149 .identity-popup-expander[panel-multiview-anchor] > .button-box:focus {
152 .identity-popup-expander:hover {
153 background-image: url("chrome://browser/skin/controlcenter/arrow-subview.svg#arrow-active");
154 background-color: #FFCF00;
157 .identity-popup-expander:hover:active {
158 background-image: url("chrome://browser/skin/controlcenter/arrow-subview.svg#arrow-active");
159 background-color: #FF9F00;
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,
170 .identity-popup-text {
171 white-space: pre-wrap;
176 .identity-popup-headline {
181 .identity-popup-warning-gray {
182 -moz-padding-start: 24px;
183 background: url(chrome://browser/skin/controlcenter/warning-gray.svg) no-repeat 0 50%;
186 .identity-popup-warning-yellow {
187 -moz-padding-start: 24px;
188 background: url(chrome://browser/skin/controlcenter/warning-yellow.svg) no-repeat 0 50%;
191 .identity-popup-warning-gray:-moz-locale-dir(rtl),
192 .identity-popup-warning-yellow:-moz-locale-dir(rtl) {
193 background-position: 100% 50%;
198 #identity-popup-securityView > .identity-popup-text:not(#identity-popup-content-owner) {
202 .identity-popup-connection-secure {
206 .identity-popup-connection-not-secure {
210 #identity-popup-security-content.chromeUI {
211 background-image: url(chrome://branding/content/icon48.png);
214 /* SECURITY SUBVIEW */
216 #identity-popup-securityView {
221 #identity-popup-securityView,
222 #identity-popup-security-content {
223 background-image: url(chrome://browser/skin/controlcenter/conn-not-secure.svg);
226 #identity-popup[connection=chrome] #identity-popup-securityView,
227 #identity-popup[connection=chrome] #identity-popup-security-content {
228 background-image: url(chrome://branding/content/icon48.png);
231 #identity-popup[connection^=secure] #identity-popup-securityView,
232 #identity-popup[connection^=secure] #identity-popup-security-content {
233 background-image: url(chrome://browser/skin/controlcenter/conn-secure.svg);
236 /* Use [isbroken] to make sure we don't show a lock on an http page. See Bug 1192162. */
237 #identity-popup[ciphers=weak] #identity-popup-securityView,
238 #identity-popup[ciphers=weak] #identity-popup-security-content,
239 #identity-popup[mixedcontent~=passive-loaded][isbroken] #identity-popup-securityView,
240 #identity-popup[mixedcontent~=passive-loaded][isbroken] #identity-popup-security-content {
241 background-image: url(chrome://browser/skin/controlcenter/conn-degraded.svg);
244 #identity-popup[connection=secure-cert-user-overridden] #identity-popup-securityView,
245 #identity-popup[connection=secure-cert-user-overridden] #identity-popup-security-content {
246 background-image: url(chrome://browser/skin/identity-mixed-passive-loaded.svg);
249 #identity-popup[loginforms=insecure] #identity-popup-securityView,
250 #identity-popup[loginforms=insecure] #identity-popup-security-content,
251 #identity-popup[mixedcontent~=active-loaded][isbroken] #identity-popup-securityView,
252 #identity-popup[mixedcontent~=active-loaded][isbroken] #identity-popup-security-content {
253 background-image: url(chrome://browser/skin/controlcenter/mcb-disabled.svg);
256 #identity-popup-security-descriptions > description {
261 #identity-popup-securityView-header,
262 #identity-popup-securityView-body {
263 -moz-margin-start: calc(2em + 24px);
264 -moz-margin-end: 1em;
267 #identity-popup-securityView-header {
269 border-bottom: 1px solid var(--panel-separator-color);
273 #identity-popup-securityView-body {
274 -moz-padding-end: 1em;
277 #identity-popup-securityView-footer {
279 background-color: hsla(210,4%,10%,.07);
282 #identity-popup-securityView-footer > button {
285 #identity-popup-securityView-footer > button:hover,
286 #identity-popup-securityView-footer > button:focus {
289 #identity-popup-securityView-footer > button:hover:active {
292 #identity-popup-content-verifier ~ description {
297 description#identity-popup-content-verified-by,
298 description#identity-popup-content-owner,
299 description#identity-popup-content-verifier,
300 #identity-popup-securityView-body > button {
304 #identity-popup-securityView-body > button {
305 margin-inline-start: 0;
306 margin-inline-end: 0;
309 /* TRACKING PROTECTION */
311 #tracking-protection-content {
312 background-image: url("chrome://browser/skin/controlcenter/tracking-protection.svg");
315 #tracking-protection-content[state="loaded-tracking-content"] {
316 background-image: url("chrome://browser/skin/controlcenter/tracking-protection-disabled.svg");
319 #tracking-action-block,
320 #tracking-action-unblock,
321 #tracking-action-unblock-private,
322 #identity-popup-securityView-body > button {
326 #tracking-protection-content[state] > #tracking-not-detected,
327 #tracking-protection-content:not([state="blocked-tracking-content"]) > #tracking-blocked,
328 #main-window[privatebrowsingmode] #tracking-action-unblock,
329 #main-window:not([privatebrowsingmode]) #tracking-action-unblock-private,
330 #tracking-protection-content:not([state="blocked-tracking-content"]) #tracking-action-unblock,
331 #tracking-protection-content:not([state="blocked-tracking-content"]) #tracking-action-unblock-private,
332 #tracking-protection-content:not([state="loaded-tracking-content"]) > #tracking-loaded,
333 #tracking-protection-content:not([state="loaded-tracking-content"]) #tracking-action-block,
334 #tracking-protection-content:not([state]) > #tracking-actions {
340 #identity-popup-permissions-content {
341 background-image: url(chrome://browser/skin/controlcenter/permissions.svg);
344 #identity-popup-permission-list menulist {
348 #identity-popup-permission-list:not(:empty) {
352 #identity-popup-permission-list:not(:empty) + description {
356 .identity-popup-permission-label {
357 -moz-margin-start: 0;
358 word-wrap: break-word;
361 /* === END panel.inc.css === */
363 .identity-popup-expander:-moz-focusring {
367 .identity-popup-expander:-moz-focusring > .button-box {
368 outline: 1px #008484 dotted;