From 992aafd1400772b13f7cadb2cae1bb298be644e0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?D=C3=A3o=20Gottwald?= Date: Thu, 11 Aug 2016 19:50:54 +0200 Subject: [PATCH] Bug 1022601 - Fix up identity block styling for high contrast mode. r=felipe --HG-- extra : rebase_source : d43ff15d005a7cbe4b79761decbab8567e30f054 --- browser/themes/linux/browser.css | 8 +------ browser/themes/shared/devedition.inc.css | 1 - .../identity-block/identity-block.inc.css | 18 ++++++++++----- .../shared/identity-block/identity-icon.svg | 1 - .../identity-block/tracking-protection-16.svg | 2 +- .../themes/shared/notification-icons.inc.css | 22 ++++++++++--------- browser/themes/windows/browser.css | 8 +------ 7 files changed, 28 insertions(+), 32 deletions(-) diff --git a/browser/themes/linux/browser.css b/browser/themes/linux/browser.css index 9dfa257e0917..4b9137753f5a 100644 --- a/browser/themes/linux/browser.css +++ b/browser/themes/linux/browser.css @@ -32,11 +32,9 @@ --toolbarbutton-checkedhover-backgroundcolor: rgba(200,200,200,.5); - --identity-box-verified-background-color: #fff; - --panel-separator-color: ThreeDShadow; - --urlbar-separator-color: hsla(0,0%,16%,.2); + --urlbar-separator-color: ThreeDShadow; } #menubar-items { @@ -1010,10 +1008,6 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { border-bottom-right-radius: 1.5px; } -#identity-box.verifiedIdentity:not(:-moz-lwtheme):not(:hover):not([open=true]) { - background-color: var(--identity-box-verified-background-color); -} - #identity-box:-moz-focusring { outline: 1px dotted #000; outline-offset: -3px; diff --git a/browser/themes/shared/devedition.inc.css b/browser/themes/shared/devedition.inc.css index 837b189f8fc9..300e0bfdefd7 100644 --- a/browser/themes/shared/devedition.inc.css +++ b/browser/themes/shared/devedition.inc.css @@ -60,7 +60,6 @@ :root[devtoolstheme="dark"] #identity-box { --identity-box-chrome-color: #46afe3; - --identity-box-verified-background-color: transparent; } :root[devtoolstheme="light"] { diff --git a/browser/themes/shared/identity-block/identity-block.inc.css b/browser/themes/shared/identity-block/identity-block.inc.css index ee88e5389a5a..dfa782ed4d3f 100644 --- a/browser/themes/shared/identity-block/identity-block.inc.css +++ b/browser/themes/shared/identity-block/identity-block.inc.css @@ -19,9 +19,9 @@ font-size: .9em; padding: 3px 5px; overflow: hidden; - /* The latter two properties have a transition to handle the delayed hiding of + /* The padding-left and padding-right transitions handle the delayed hiding of the forward button when hovered. */ - transition: background-color 150ms ease, padding-left, padding-right; + transition: padding-left, padding-right; } #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity { @@ -62,6 +62,9 @@ width: 16px; height: 16px; list-style-image: url(chrome://browser/skin/identity-icon.svg#normal); + filter: url(chrome://browser/skin/filters.svg#fill); + fill: currentColor; + opacity: .5; } #identity-box:hover > #identity-icon:not(.no-hover), @@ -80,10 +83,11 @@ #urlbar[pageproxystate="valid"] > #identity-box.chromeUI > #identity-icon { list-style-image: url(chrome://branding/content/identity-icons-brand.svg); + opacity: 1; } #urlbar[pageproxystate="invalid"] > #identity-box > #identity-icon { - opacity: 0.3; + opacity: .2; } #urlbar[actiontype="searchengine"] > #identity-box > #identity-icon { @@ -91,7 +95,7 @@ list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); width: 16px; height: 16px; - opacity: 1; + opacity: .5; } /* SHARING ICON */ @@ -145,11 +149,15 @@ margin-inline-start: 2px; margin-inline-end: 0; list-style-image: url(chrome://browser/skin/tracking-protection-16.svg); - opacity: 1; + filter: url(chrome://browser/skin/filters.svg#fill); + fill: currentColor; + opacity: .5; } #tracking-protection-icon[state="loaded-tracking-content"] { list-style-image: url(chrome://browser/skin/tracking-protection-disabled-16.svg); + filter: none; + opacity: 1; } #tracking-protection-icon[animate] { diff --git a/browser/themes/shared/identity-block/identity-icon.svg b/browser/themes/shared/identity-block/identity-icon.svg index c19765a9d943..502e60f49300 100755 --- a/browser/themes/shared/identity-block/identity-icon.svg +++ b/browser/themes/shared/identity-block/identity-icon.svg @@ -8,7 +8,6 @@ diff --git a/browser/themes/shared/identity-block/tracking-protection-16.svg b/browser/themes/shared/identity-block/tracking-protection-16.svg index ebe6b5f9b5c2..2813256a6685 100755 --- a/browser/themes/shared/identity-block/tracking-protection-16.svg +++ b/browser/themes/shared/identity-block/tracking-protection-16.svg @@ -17,5 +17,5 @@ - + diff --git a/browser/themes/shared/notification-icons.inc.css b/browser/themes/shared/notification-icons.inc.css index 6452f0d73b35..d2253f8e73ac 100644 --- a/browser/themes/shared/notification-icons.inc.css +++ b/browser/themes/shared/notification-icons.inc.css @@ -41,12 +41,6 @@ margin-inline-end: 10px; } -#notification-popup-box > .notification-anchor-icon:hover { - fill: #606060; -} - -/* INDIVIDUAL NOTIFICATIONS */ - .camera-icon, .geo-icon, .indexedDB-icon, @@ -67,9 +61,16 @@ .popup-notification-icon[popupid="webRTC-shareScreen"], .popup-notification-icon[popupid="web-notifications"] { filter: url(chrome://browser/skin/filters.svg#fill); - fill: #999; + fill: currentColor; + opacity: .4; } +.notification-anchor-icon:hover { + opacity: .6; +} + +/* INDIVIDUAL NOTIFICATIONS */ + .popup-notification-icon[popupid="web-notifications"], .desktop-notification-icon { list-style-image: url(chrome://browser/skin/notification-icons.svg#desktop-notification); @@ -252,7 +253,8 @@ .plugin-icon.plugin-blocked { list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin-blocked); - fill: #d92215 !important; /* important! to override the default hover color */ + fill: #d92215; + opacity: 1 !important; /* !important to override the default hover opacity */ } #notification-popup-box[hidden] { @@ -268,10 +270,10 @@ @keyframes pluginBlockedNotification { from { - opacity: 0; + opacity: 0 !important; } to { - opacity: 1; + opacity: 1 !important; } } diff --git a/browser/themes/windows/browser.css b/browser/themes/windows/browser.css index b8e54eba72d8..8bf1f3ec7eb0 100644 --- a/browser/themes/windows/browser.css +++ b/browser/themes/windows/browser.css @@ -36,8 +36,6 @@ --toolbarbutton-checkedhover-backgroundcolor: rgba(0,0,0,.1); - --identity-box-verified-background-color: #fff; - --urlbar-dropmarker-url: url("chrome://browser/skin/urlbar-history-dropmarker.png"); --urlbar-dropmarker-region: rect(0px, 11px, 14px, 0px); --urlbar-dropmarker-hover-region: rect(0px, 22px, 14px, 11px); @@ -49,7 +47,7 @@ --panel-separator-color: ThreeDLightShadow; - --urlbar-separator-color: hsla(0,0%,16%,.2); + --urlbar-separator-color: ThreeDLightShadow; } #nav-bar[brighttext] { @@ -1420,10 +1418,6 @@ html|*.urlbar-input:-moz-lwtheme::-moz-placeholder, /* identity box */ -#identity-box.verifiedIdentity:not(:-moz-lwtheme):not(:hover):not([open=true]) { - background-color: var(--identity-box-verified-background-color); -} - #identity-box:-moz-focusring { outline: 1px dotted #000; outline-offset: -3px;