From 1639cef5867d1e88ebc96dbb46cf6afdaee9c515 Mon Sep 17 00:00:00 2001
From: davidfloyd91 <davidfloyd91@gmail.com>
Date: Wed, 5 Jun 2019 15:12:10 -0400
Subject: [PATCH] Change qrBackgroundColor to ternary, move dark theme changes
 back to CSS

---
 src/common/modules/data/DefaultSettings.js | 15 ++++-----------
 src/popup/modules/UserInterface.js         |  6 ------
 src/popup/qrcode.css                       |  8 ++++++++
 3 files changed, 12 insertions(+), 17 deletions(-)

diff --git a/src/common/modules/data/DefaultSettings.js b/src/common/modules/data/DefaultSettings.js
index a35192f6..d8f3d03b 100644
--- a/src/common/modules/data/DefaultSettings.js
+++ b/src/common/modules/data/DefaultSettings.js
@@ -4,6 +4,9 @@
  * @module data/DefaultSettings
  */
 
+// checks for OS dark theme
+const darkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
+
 /**
  * An object of all default settings.
  *
@@ -11,22 +14,12 @@
  * @const
  * @type {Object}
  */
-
-// checks for OS dark theme and returns the appropriate background color
- const setQrBackgroundColor = () => {
-     if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
-        return "#d7d7db"; // Photon Grey 30
-     } else {
-        return "ffffff";
-     }
- };
-
 const defaultSettings = Object.freeze({
     debugMode: false,
     popupIconColored: false,
     qrCodeType: "svg",
     qrColor: "#0c0c0d",
-    qrBackgroundColor: setQrBackgroundColor(),
+    qrBackgroundColor: (darkTheme ? "#d7d7db" : "#ffffff"),
     qrErrorCorrection: "Q",
     autoGetSelectedText: false,
     monospaceFont: false,
diff --git a/src/popup/modules/UserInterface.js b/src/popup/modules/UserInterface.js
index d93571d5..def3b179 100644
--- a/src/popup/modules/UserInterface.js
+++ b/src/popup/modules/UserInterface.js
@@ -532,12 +532,6 @@ export function init() {
     const applyingQrColor = AddonSettings.get("qrBackgroundColor").then((qrBackgroundColor) => {
         if (qrBackgroundColor) {
             document.body.style.backgroundColor = qrBackgroundColor;
-
-            // checks for OS dark theme and sets sets colors in text field
-            if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
-                qrCodeText.style.backgroundColor = "#4a4a4f"; // Photon Grey 60 -- FF dark theme popup color
-                qrCodeText.style.color = "#ffffff";
-            }
         }
     });
 
diff --git a/src/popup/qrcode.css b/src/popup/qrcode.css
index 41b6ca43..0c49a387 100644
--- a/src/popup/qrcode.css
+++ b/src/popup/qrcode.css
@@ -117,3 +117,11 @@ html, body {
   /* override inerhited from browser-style */
   margin: 0px;
 }
+
+/* shift popup colors if user has specified dark mode */
+@media (prefers-color-scheme: dark) {
+  #qrcodetext {
+      background-color: var(--grey-60);
+      color: var(--white-100);
+  }
+}