Bug 1382187 - Theme specific filter added to devtools notification bar 'close' icon. r=Honza draft
authorabhinav <abhinav.koppula@gmail.com>
Sun, 17 Sep 2017 13:38:48 +0530
changeset 667466 1cb59fa926c5475be1f12eee13e6f4443bbc1c3c
parent 665623 7aceaf8bcb9f582db0f93488b48ef7019e348dba
child 732390 a2af91eb3f00d592dac47aac9789ab7a2563ede0
push id80717
push userbmo:abhinav.koppula@gmail.com
push dateWed, 20 Sep 2017 04:06:55 +0000
reviewersHonza
bugs1382187
milestone57.0a1
Bug 1382187 - Theme specific filter added to devtools notification bar 'close' icon. r=Honza MozReview-Commit-ID: LpWRhJpUW24
devtools/client/shared/components/notification-box.css
devtools/client/themes/variables.css
--- a/devtools/client/shared/components/notification-box.css
+++ b/devtools/client/shared/components/notification-box.css
@@ -78,17 +78,17 @@
   height: 20px;
   margin: 4px;
   margin-inline-end: 8px;
   background-image: url("chrome://devtools/skin/images/close.svg");
   background-position: center;
   background-color: transparent;
   background-repeat: no-repeat;
   border-radius: 11px;
-  filter: invert(0);
+  filter: var(--theme-messageCloseButtonFilter);
 }
 
 .notificationbox .messageCloseButton:hover {
   background-color: gray;
   filter: invert(1);
 }
 
 .notificationbox .messageCloseButton:active {
--- a/devtools/client/themes/variables.css
+++ b/devtools/client/themes/variables.css
@@ -91,16 +91,17 @@
   --theme-tooltip-background: rgba(255, 255, 255, .9);
   --theme-tooltip-shadow: rgba(155, 155, 155, 0.26);
 
   /* Command line */
   --theme-command-line-image: url(chrome://devtools/skin/images/commandline-icon.svg#light-theme);
   --theme-command-line-image-focus: url(chrome://devtools/skin/images/commandline-icon.svg#light-theme-focus);
 
   --theme-codemirror-gutter-background: #f4f4f4;
+  --theme-messageCloseButtonFilter: invert(0);
 }
 
 :root.theme-dark {
   --theme-body-background: var(--grey-80);
   --theme-sidebar-background: var(--grey-90);
   --theme-contrast-background: #ffb35b;
 
   /* Toolbar */
@@ -173,16 +174,17 @@
   --theme-tooltip-background: rgba(19, 28, 38, .9);
   --theme-tooltip-shadow: rgba(25, 25, 25, 0.76);
 
   /* Command line */
   --theme-command-line-image: url(chrome://devtools/skin/images/commandline-icon.svg#dark-theme);
   --theme-command-line-image-focus: url(chrome://devtools/skin/images/commandline-icon.svg#dark-theme-focus);
 
   --theme-codemirror-gutter-background: #262b37;
+  --theme-messageCloseButtonFilter: invert(1);
 }
 
 :root.theme-firebug {
   --theme-body-background: #fff;
   --theme-sidebar-background: #fcfcfc;
   --theme-contrast-background: #e6b064;
 
   --theme-tab-toolbar-background: rgb(240, 240, 240) linear-gradient(rgba(255, 255, 255, 0.8), transparent);