From 119d476d5cb6af8bcd53ddce35c91a5fb22cd6ca Mon Sep 17 00:00:00 2001
From: Bauke <me@bauke.xyz>
Date: Fri, 25 Nov 2022 19:15:40 +0100
Subject: [PATCH] Move background color to a custom property so the :hover
 color cascades correctly.

---
 source/options/scss/components/editor.scss    | 6 +++---
 source/options/scss/components/page-main.scss | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/source/options/scss/components/editor.scss b/source/options/scss/components/editor.scss
index 030658f..77e3480 100644
--- a/source/options/scss/components/editor.scss
+++ b/source/options/scss/components/editor.scss
@@ -25,15 +25,15 @@
     padding: 0;
 
     &.enabled {
-      background-color: var(--da-4);
+      --button-background-color: var(--da-4);
     }
 
     &.disabled {
-      background-color: var(--da-2);
+      --button-background-color: var(--da-2);
     }
 
     &.share {
-      background-color: var(--da-7);
+      --button-background-color: var(--da-7);
     }
   }
 
diff --git a/source/options/scss/components/page-main.scss b/source/options/scss/components/page-main.scss
index 8ff8dee..1073e6c 100644
--- a/source/options/scss/components/page-main.scss
+++ b/source/options/scss/components/page-main.scss
@@ -8,7 +8,7 @@
   margin-bottom: 16px;
 
   .button {
-    background-color: var(--da-3);
+    background-color: var(--button-background-color, var(--da-3));
     border: none;
     color: var(--db-1);
     cursor: pointer;