From 72430cf1e27906312908d5a14aabad552e5a711c Mon Sep 17 00:00:00 2001
From: rebornix <penn.lv@gmail.com>
Date: Mon, 10 Jan 2022 08:48:53 -0800
Subject: [PATCH] Add flat theme.

---
 sass/popup.scss          | 57 ++++++++++++++++++++++++++++++++++++++++
 src/components/Popup.vue |  4 ++-
 src/models/storage.ts    | 32 +++++++++++-----------
 3 files changed, 76 insertions(+), 17 deletions(-)

diff --git a/sass/popup.scss b/sass/popup.scss
index 18d88466a..d2c8ab477 100644
--- a/sass/popup.scss
+++ b/sass/popup.scss
@@ -1306,3 +1306,60 @@ svg {
     border: 2px solid black !important;
   }
 }
+
+// Flat overrides
+.theme-flat {
+  .header {
+    color: black;
+    background: white;
+    border-bottom: #f5f4f7 1px solid;
+  }
+
+  #codes {
+    background: #fcfbff;
+
+    .entry {
+      border: #f5f4f7 1px solid;
+      border-radius: 8px;
+    }
+  }
+
+  #menu {
+    #menuBody {
+      background: #fcfbff;
+
+      .menuList {
+        margin: 10px;
+        border-radius: 8px;
+        border: #f5f4f7 1px solid;
+        background: white;
+
+        p {
+          color: #727272;
+
+          span svg {
+            fill: #727272;
+          }
+        }
+      }
+    }
+
+    #version {
+      bottom: 0px;
+      position: relative;
+      margin: 10px auto;
+      width: 100%;
+      color: #727272;
+      font-size: 0.9em;
+    }
+
+    #info {
+      border-radius: 8px;
+      border: #f5f4f7 1px solid;
+
+      .control-group {
+        border-bottom: #f5f4f7 1px solid;
+      }
+    }
+  }
+}
diff --git a/src/components/Popup.vue b/src/components/Popup.vue
index ea315f579..5ef9d0fd8 100644
--- a/src/components/Popup.vue
+++ b/src/components/Popup.vue
@@ -6,11 +6,13 @@
         theme !== 'accessibility' &&
         theme !== 'dark' &&
         theme !== 'simple' &&
-        theme !== 'compact',
+        theme !== 'compact' &&
+        theme !== 'flat',
       'theme-accessibility': theme === 'accessibility',
       'theme-dark': theme === 'dark',
       'theme-simple': theme === 'simple',
       'theme-compact': theme === 'compact',
+      'theme-flat': theme === 'flat',
       hideoutline,
     }"
     v-on:mousedown="hideoutline = true"
diff --git a/src/models/storage.ts b/src/models/storage.ts
index 4bba8c8fe..eb06d4f4e 100644
--- a/src/models/storage.ts
+++ b/src/models/storage.ts
@@ -660,22 +660,22 @@ export class ManagedStorage {
   static get<T>(key: string, defaultValue: T): T;
   static get<T>(key: string, defaultValue?: T) {
     return new Promise((resolve: (result: T | undefined) => void) => {
-        if (chrome.storage.managed) {
-            chrome.storage.managed.get((data) => {
-              if (chrome.runtime.lastError) {
-                return resolve(defaultValue);
-              }
-              if (data) {
-                if (data[key]) {
-                  return resolve(data[key]);
-                }
-              }
-              return resolve(defaultValue);
-            });
-        } else {
-            // no available in Safari
-            resolve(defaultValue);
-        }
+      if (chrome.storage.managed) {
+        chrome.storage.managed.get((data) => {
+          if (chrome.runtime.lastError) {
+            return resolve(defaultValue);
+          }
+          if (data) {
+            if (data[key]) {
+              return resolve(data[key]);
+            }
+          }
+          return resolve(defaultValue);
+        });
+      } else {
+        // no available in Safari
+        resolve(defaultValue);
+      }
     });
   }
 }