X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fcontrolcenter%2Fpanel.css;h=7f06234e8cfec28c691026a81fb25257e5340559;hp=ebc5a8e878b554dfc74aa906d70140fddefa7a00;hb=11ddc40545d65c5dd6bb376206dbba998d43a5ab;hpb=2e389898f68ebe2e0fd7c7b50ead1dbd3c082405 diff --git a/LCARStrek/browser/controlcenter/panel.css b/LCARStrek/browser/controlcenter/panel.css index ebc5a8e8..7f06234e 100644 --- a/LCARStrek/browser/controlcenter/panel.css +++ b/LCARStrek/browser/controlcenter/panel.css @@ -11,6 +11,7 @@ /* Show the right elements for the right connection states. */ #identity-popup[connection=not-secure] [when-connection~=not-secure], +#identity-popup[connection=secure-cert-user-overridden] [when-connection~=secure-cert-user-overridden], #identity-popup[connection=secure-ev] [when-connection~=secure-ev], #identity-popup[connection=secure] [when-connection~=secure], #identity-popup[connection=chrome] [when-connection~=chrome], @@ -82,31 +83,31 @@ #identity-popup-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews { background: var(--panel-arrowcontent-background); - border-bottom-right-radius: 3.5px; padding: 0; } -#identity-popup-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews:-moz-locale-dir(rtl) { - border-bottom-right-radius: 0; - border-bottom-left-radius: 3.5px; -} - .identity-popup-section:not(:first-child) { - border-top: 1px solid #A09090; /*var(--panel-separator-color);*/ + border-top: 1px solid var(--panel-separator-color); } #identity-popup-securityView, #identity-popup-security-content, #identity-popup-permissions-content, #tracking-protection-content { - padding: 0.75em 0 1em; - -moz-padding-start: calc(2em + 24px); - -moz-padding-end: 1em; background-repeat: no-repeat; background-position: 1em 1em; background-size: 24px auto; } +#identity-popup-security-content, +#identity-popup-permissions-content, +#tracking-protection-content { + padding: 0.5em 0 1em; + /* .identity-popup-headline.host depends on this width */ + padding-inline-start: calc(2em + 24px); + padding-inline-end: 1em; +} + #identity-popup-securityView:-moz-locale-dir(rtl), #identity-popup-security-content:-moz-locale-dir(rtl), #identity-popup-permissions-content:-moz-locale-dir(rtl), @@ -114,38 +115,12 @@ background-position: calc(100% - 1em) 1em; } -/* IN-CONTENT-PREF STYLE BUTTONS */ -/* -.identity-popup-button { - -moz-appearance: none; - margin: 5px 0; - height: 30px; - color: #333; - line-height: 20px; - border: 1px solid #c1c1c1; - border-radius: 2px; - background-color: #fbfbfb; -} - -.identity-popup-button:not([disabled="true"]):hover { - background-color: #ebebeb; -} - -.identity-popup-button:not([disabled="true"]):hover:active { - background-color: #dadada; -} - -.identity-popup-button[disabled="true"] { - cursor: not-allowed; - opacity: 0.5; -} -*/ /* EXPAND BUTTON */ .identity-popup-expander { margin: 0; min-width: auto; - width: 38px; + width: var(--identity-popup-expander-width); background-image: url("chrome://browser/skin/controlcenter/arrow-subview.svg#arrow"); background-size: 16px, auto; background-position: center; @@ -161,13 +136,8 @@ .identity-popup-expander[panel-multiview-anchor] { transition: background-color 250ms ease-in; background-color: #008484; - background-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted.png"); -} - -@media (min-resolution: 1.1dppx) { - .identity-popup-expander[panel-multiview-anchor] { - background-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted@2x.png"); - } + background-image: url("chrome://browser/skin/controlcenter/arrow-subview-back.svg"); + color: #000000; } .identity-popup-expander > .button-box, @@ -192,6 +162,14 @@ /* CONTENT */ +.identity-popup-permission-label, +.identity-popup-permission-state-label, +#identity-popup-security-content > description, +#identity-popup-security-descriptions > description, +#identity-popup-securityView-header > description, +#identity-popup-securityView-body > description, +#identity-popup-permissions-content > description, +#tracking-protection-content > label, .identity-popup-text { white-space: pre-wrap; font-size: 110%; @@ -199,10 +177,32 @@ } .identity-popup-headline { - margin: 2px 0 4px; + margin: 3px 0 4px; font-size: 150%; } +.identity-popup-headline.host { + word-wrap: break-word; + /* 1em + 2em + 24px is #identity-popup-security-content padding + * 30em is .panel-mainview:not([panelid="PanelUI-popup"]) width */ + max-width: calc(30rem - 3rem - 24px - var(--identity-popup-expander-width)) +} + +.identity-popup-warning-gray { + padding-inline-start: 24px; + background: url(chrome://browser/skin/controlcenter/warning-gray.svg) no-repeat 0 50%; +} + +.identity-popup-warning-yellow { + padding-inline-start: 24px; + background: url(chrome://browser/skin/controlcenter/warning-yellow.svg) no-repeat 0 50%; +} + +.identity-popup-warning-gray:-moz-locale-dir(rtl), +.identity-popup-warning-yellow:-moz-locale-dir(rtl) { + background-position: 100% 50%; +} + /* SECURITY */ #identity-popup-securityView > .identity-popup-text:not(#identity-popup-content-owner) { @@ -224,7 +224,6 @@ /* SECURITY SUBVIEW */ #identity-popup-securityView { - padding-bottom: 2em; overflow: hidden; } @@ -233,62 +232,115 @@ background-image: url(chrome://browser/skin/controlcenter/conn-not-secure.svg); } -#identity-popup-securityView.verifiedDomain, -#identity-popup-security-content.verifiedDomain { - background-image: url(chrome://browser/skin/controlcenter/conn-secure-dv.svg); +#identity-popup[connection=chrome] #identity-popup-securityView, +#identity-popup[connection=chrome] #identity-popup-security-content { + background-image: url(chrome://branding/content/icon48.png); +} + +#identity-popup[connection^=secure] #identity-popup-securityView, +#identity-popup[connection^=secure] #identity-popup-security-content { + background-image: url(chrome://browser/skin/controlcenter/conn-secure.svg); } -#identity-popup-securityView.verifiedIdentity, -#identity-popup-security-content.verifiedIdentity { - background-image: url(chrome://browser/skin/controlcenter/conn-secure-ev.svg); +/* Use [isbroken] to make sure we don't show a lock on an http page. See Bug 1192162. */ +#identity-popup[ciphers=weak] #identity-popup-securityView, +#identity-popup[ciphers=weak] #identity-popup-security-content, +#identity-popup[mixedcontent~=passive-loaded][isbroken] #identity-popup-securityView, +#identity-popup[mixedcontent~=passive-loaded][isbroken] #identity-popup-security-content { + background-image: url(chrome://browser/skin/controlcenter/conn-degraded.svg); } -#identity-popup-securityView.mixedActiveContent, -#identity-popup-security-content.mixedActiveContent { +#identity-popup[connection=secure-cert-user-overridden] #identity-popup-securityView, +#identity-popup[connection=secure-cert-user-overridden] #identity-popup-security-content { + background-image: url(chrome://browser/skin/identity-mixed-passive-loaded.svg); +} + +#identity-popup[loginforms=insecure] #identity-popup-securityView, +#identity-popup[loginforms=insecure] #identity-popup-security-content, +#identity-popup[mixedcontent~=active-loaded][isbroken] #identity-popup-securityView, +#identity-popup[mixedcontent~=active-loaded][isbroken] #identity-popup-security-content { background-image: url(chrome://browser/skin/controlcenter/mcb-disabled.svg); } +#identity-popup-security-descriptions > description { + margin-top: 6px; + color: #A09090; +} + +#identity-popup-securityView-header, +#identity-popup-securityView-body { + margin-inline-start: calc(2em + 24px); + margin-inline-end: 1em; +} + #identity-popup-securityView-header { - border-bottom: 1px solid #A09090; + margin-top: 0.5em; + border-bottom: 1px solid var(--panel-separator-color); padding-bottom: 1em; - margin-bottom: 1em; } -#identity-popup-content-owner { - font-weight: 700; +#identity-popup-securityView-body { + padding-inline-end: 1em; } -#identity-popup-content-verifier { +#identity-popup-securityView-footer { + margin-top: 1em; + background-color: #402000; +} + +#identity-popup-securityView-footer > button { +} + +#identity-popup-securityView-footer > button:hover, +#identity-popup-securityView-footer > button:focus { +} + +#identity-popup-securityView-footer > button:hover:active { +} + +#identity-popup-content-verifier ~ description { + margin-top: 1em; color: #A09090; } -#identity-popup-content-owner, -#identity-popup-securityView > #identity-popup-securityView-connection.identity-popup-text { +description#identity-popup-content-verified-by, +description#identity-popup-content-owner, +description#identity-popup-content-verifier, +#identity-popup-securityView-body > button { margin-top: 1em; } +#identity-popup-securityView-body > button { + margin-inline-start: 0; + margin-inline-end: 0; +} + /* TRACKING PROTECTION */ #tracking-protection-content { background-image: url("chrome://browser/skin/controlcenter/tracking-protection.svg"); } -#tracking-protection-content[block-disabled] { +#tracking-protection-content[state="loaded-tracking-content"] { background-image: url("chrome://browser/skin/controlcenter/tracking-protection-disabled.svg"); } #tracking-action-block, -#tracking-action-unblock { +#tracking-action-unblock, +#tracking-action-unblock-private, +#identity-popup-securityView-body > button { margin: 1em 0 0; } -#tracking-protection-content[block-active] > #tracking-not-detected, -#tracking-protection-content[block-disabled] > #tracking-not-detected, -#tracking-protection-content:not([block-active]) > #tracking-blocked, -#tracking-protection-content:not([block-active]) #tracking-action-unblock, -#tracking-protection-content:not([block-disabled]) > #tracking-loaded, -#tracking-protection-content:not([block-disabled]) #tracking-action-block, -#tracking-protection-content:not([block-active]):not([block-disabled]) > #tracking-actions { +#tracking-protection-content[state] > #tracking-not-detected, +#tracking-protection-content:not([state="blocked-tracking-content"]) > #tracking-blocked, +#main-window[privatebrowsingmode] #tracking-action-unblock, +#main-window:not([privatebrowsingmode]) #tracking-action-unblock-private, +#tracking-protection-content:not([state="blocked-tracking-content"]) #tracking-action-unblock, +#tracking-protection-content:not([state="blocked-tracking-content"]) #tracking-action-unblock-private, +#tracking-protection-content:not([state="loaded-tracking-content"]) > #tracking-loaded, +#tracking-protection-content:not([state="loaded-tracking-content"]) #tracking-action-block, +#tracking-protection-content:not([state]) > #tracking-actions { display: none; } @@ -298,107 +350,90 @@ background-image: url(chrome://browser/skin/controlcenter/permissions.svg); } -#identity-popup-permission-list { - margin-top: 5px; +#identity-popup-permissions-headline { + /* Make sure the label is as tall as the icon so that the permission list + which is aligned with the icon doesn't cover it up. */ + min-height: 24px; } -.identity-popup-permission-label { - -moz-margin-start: 0; +#identity-popup-permission-list { + /* Offset the padding set on #identity-popup-permissions-content so that it + shows up just below the section. The permission icons are 16px wide and + should be right aligned with the section icon. */ + margin-inline-start: calc(-1em - 16px); } -/* FOOTER BUTTONS */ - -#identity-popup-button-container { - background: #000000; - border-top: 1px solid #A09090; +.identity-popup-permission-item { + min-height: 24px; } -#identity-popup-more-info-button { +#identity-popup-permission-list:not(:empty) { margin-top: 5px; } -/* -#identity-popup-more-info-button:hover { -} - -#identity-popup-more-info-button:hover:active { -} -*/ -/* === END panel.inc.css === */ - -/* Popup Icons */ -#identity-popup-icon { - height: 64px; - width: 64px; - padding: 0; - list-style-image: url("chrome://browser/skin/identity.png"); - -moz-image-region: rect(0px, 64px, 64px, 0px); +#identity-popup-permission-list:not(:empty) + description { + display: none; } -#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon { - -moz-image-region: rect(64px, 64px, 128px, 0px); +.identity-popup-permission-icon { + width: 16px; + height: 16px; } -#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon { - -moz-image-region: rect(128px, 64px, 192px, 0px); +.identity-popup-permission-label { + margin-inline-start: 1em; } -/* Popup Body Text */ -.identity-popup-description { - white-space: pre-wrap; - -moz-padding-start: 15px; - margin: 2px 0 4px; +.identity-popup-permission-state-label { + margin-inline-end: 5px; + text-align: end; + opacity: 0.6; } -.identity-popup-label { - white-space: pre-wrap; - -moz-padding-start: 15px; +.identity-popup-permission-remove-button { margin: 0; + border-width: 0; + border-radius: 50%; + min-width: 0; + padding: 2px; + background-color: transparent; } -#identity-popup-content-host, -#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner { - font-size: 1.2em; +.identity-popup-permission-remove-button > .button-box { + padding: 0; } -#identity-popup-content-host { - margin-top: 3px; - margin-bottom: 5px; - font-weight: bold; - max-width: 300px; +.identity-popup-permission-remove-button > .button-box > .button-icon { + margin: 0; + width: 16px; + height: 16px; + list-style-image: url(chrome://browser/skin/panel-icons.svg#cancel); + filter: url(chrome://global/skin/filters.svg#fill); + fill: #A09090; } -#identity-popup-content-owner { - margin-top: 4px; - margin-bottom: 0 !important; - font-weight: bold; - max-width: 300px; +.identity-popup-permission-remove-button > .button-box > .button-text { + display: none; } -.verifiedDomain > #identity-popup-content-owner { - font-weight: normal; +.identity-popup-permission-remove-button:not(:-moz-focusring):hover { + background-color: #FFCF00; } -#identity-popup-content-verifier { - margin: 4px 0 2px; +.identity-popup-permission-remove-button:not(:-moz-focusring):hover > .button-box > .button-icon { + fill: #000000; } -#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption , -#identity-popup-content-box.verifiedDomain > #identity-popup-encryption { - margin-top: 10px; - -moz-margin-start: -24px; +.identity-popup-permission-remove-button:not(:-moz-focusring):hover:active { + background-color: #FF9F00; } -#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon , -#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon { - list-style-image: url("chrome://browser/skin/Secure24.png"); -} +/* === END panel.inc.css === */ -#identity-popup > .panel-arrowcontainer > .panel-arrowcontent { - padding: 0; +.identity-popup-expander:-moz-focusring { + padding: 1px; } -#identity-popup-container { - min-width: 280px; - padding: 10px; +.identity-popup-expander:-moz-focusring > .button-box { + outline: 1px #008484 dotted; }