Fixing colors and some bugs #27

author: ManeraKai <manerakai@protonmail.com> 2022-02-08 20:30:50 +0300
committer: ManeraKai <manerakai@protonmail.com> 2022-02-08 20:30:50 +0300
commit: b715e43553296d5380518e7d17be6b51eac0fdf7 (patch)
tree: a8b4e991ee3914d61fbe876372901fb1e551dc37
parent: Added the same regex as in the faq page in scribe #19 (diff)
download: libredirect-b715e43553296d5380518e7d17be6b51eac0fdf7.zip
15 files changed, 82 insertions, 73 deletions
diff --git a/src/pages/options/general/general.html b/src/pages/options/general/general.html
index 92cd48c5..3a9540a8 100644
--- a/src/pages/options/general/general.html
+++ b/src/pages/options/general/general.html
@@ -4,8 +4,9 @@
 <head>
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
   <link href="../../stylesheets/styles.css" rel="stylesheet" />
-  <title>LibRedirect Options</title>
+  <title>LibRedirect options</title>
 </head>
 
 <body class="option">
@@ -39,9 +40,9 @@
       </a>
     </div>
 
-  <script type="module" src="../init.js"></script>
-  <script type="module" src="./general.js"></script>
-  <!-- <script src="../../assets/javascripts/localise.js"></script> -->
+    <script type="module" src="../init.js"></script>
+    <script type="module" src="./general.js"></script>
+    <!-- <script src="../../assets/javascripts/localise.js"></script> -->
 </body>
 
 </html>
 \ No newline at end of file
diff --git a/src/pages/options/general/general.js b/src/pages/options/general/general.js
index 17b7a843..07097aaf 100644
--- a/src/pages/options/general/general.js
+++ b/src/pages/options/general/general.js
@@ -49,19 +49,6 @@ browser.storage.sync.get(
 
 themeElement.addEventListener("change", (event) => {
   const value = event.target.options[theme.selectedIndex].value;
-  switch (value) {
-    case "dark-theme":
-      document.body.classList.add("dark-theme");
-      document.body.classList.remove("light-theme");
-      break;
-    case "light-theme":
-      document.body.classList.add("light-theme");
-      document.body.classList.remove("dark-theme");
-      break;
-    default:
-      document.body.classList.remove("light-theme");
-      document.body.classList.remove("dark-theme");
-  }
   browser.storage.sync.set({ theme: value });
 });
 
diff --git a/src/pages/options/init.js b/src/pages/options/init.js
index 09b41fd8..deabd92f 100644
--- a/src/pages/options/init.js
+++ b/src/pages/options/init.js
@@ -1,3 +1,30 @@
-browser.storage.sync.get("theme", (result) => {
-    if (result.theme) document.body.classList.add(result.theme);
-})
-\ No newline at end of file
+function changeTheme() {
+    browser.storage.sync.get("theme", (result) => {
+        console.log("Chaning Theme")
+        switch (result.theme) {
+            case "dark-theme":
+                document.body.classList.add("dark-theme");
+                document.body.classList.remove("light-theme");
+                break;
+            case "light-theme":
+                document.body.classList.add("light-theme");
+                document.body.classList.remove("dark-theme");
+                break;
+            default:
+                if (matchMedia("(prefers-color-scheme: light)").matches) {
+                    document.body.classList.add("light-theme");
+                    document.body.classList.remove("dark-theme");
+                } else {
+                    document.body.classList.add("dark-theme");
+                    document.body.classList.remove("light-theme");
+                }
+
+        }
+    })
+}
+
+changeTheme()
+
+browser.storage.onChanged.addListener(changeTheme)
+
+window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", changeTheme)
diff --git a/src/pages/options/instagram/instagram.html b/src/pages/options/instagram/instagram.html
index c7a5fbb7..94abd2e8 100644
--- a/src/pages/options/instagram/instagram.html
+++ b/src/pages/options/instagram/instagram.html
@@ -5,6 +5,7 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
     <link href="../../stylesheets/styles.css" rel="stylesheet" />
 </head>
 
diff --git a/src/pages/options/maps/maps.html b/src/pages/options/maps/maps.html
index 79aa08ea..293a5e02 100644
--- a/src/pages/options/maps/maps.html
+++ b/src/pages/options/maps/maps.html
@@ -5,8 +5,9 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
     <link href="../../stylesheets/styles.css" rel="stylesheet" />
-    <title>LibRedirect Options: Twitter</title>
+    <title>LibRedirect options: Twitter</title>
 </head>
 
 <body class="option">
diff --git a/src/pages/options/medium/medium.html b/src/pages/options/medium/medium.html
index 4f3f853d..fc987d8c 100644
--- a/src/pages/options/medium/medium.html
+++ b/src/pages/options/medium/medium.html
@@ -5,8 +5,9 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
     <link href="../../stylesheets/styles.css" rel="stylesheet" />
-    <title>LibRedirect Options: Twitter</title>
+    <title>LibRedirect options: Twitter</title>
 </head>
 
 <body class="option">
diff --git a/src/pages/options/reddit/reddit.html b/src/pages/options/reddit/reddit.html
index 2e898895..92dd6696 100644
--- a/src/pages/options/reddit/reddit.html
+++ b/src/pages/options/reddit/reddit.html
@@ -5,8 +5,9 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
     <link href="../../stylesheets/styles.css" rel="stylesheet" />
-    <title>LibRedirect Options: Twitter</title>
+    <title>LibRedirect options: Twitter</title>
 </head>
 
 <body class="option">
diff --git a/src/pages/options/search/search.html b/src/pages/options/search/search.html
index 654292a8..53a72b57 100644
--- a/src/pages/options/search/search.html
+++ b/src/pages/options/search/search.html
@@ -5,8 +5,9 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
     <link href="../../stylesheets/styles.css" rel="stylesheet" />
-    <title>LibRedirect Options: Twitter</title>
+    <title>LibRedirect options: Twitter</title>
 </head>
 
 <body class="option">
diff --git a/src/pages/options/translate/translate.html b/src/pages/options/translate/translate.html
index efc43058..b9eed8e3 100644
--- a/src/pages/options/translate/translate.html
+++ b/src/pages/options/translate/translate.html
@@ -5,8 +5,9 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
     <link href="../../stylesheets/styles.css" rel="stylesheet" />
-    <title>LibRedirect Options: Twitter</title>
+    <title>LibRedirect options: Twitter</title>
 </head>
 
 <body class="option">
diff --git a/src/pages/options/twitter/twitter.html b/src/pages/options/twitter/twitter.html
index bd0b37e0..267a93ca 100644
--- a/src/pages/options/twitter/twitter.html
+++ b/src/pages/options/twitter/twitter.html
@@ -5,8 +5,9 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
     <link href="../../stylesheets/styles.css" rel="stylesheet" />
-    <title>LibRedirect Options: Twitter</title>
+    <title>LibRedirect options: Twitter</title>
 </head>
 
 <body class="option">
diff --git a/src/pages/options/wikipedia/wikipedia.html b/src/pages/options/wikipedia/wikipedia.html
index 72989228..a3eafc15 100644
--- a/src/pages/options/wikipedia/wikipedia.html
+++ b/src/pages/options/wikipedia/wikipedia.html
@@ -5,8 +5,9 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
     <link href="../../stylesheets/styles.css" rel="stylesheet" />
-    <title>LibRedirect Options: Twitter</title>
+    <title>LibRedirect options: Twitter</title>
 </head>
 
 <body class="option">
diff --git a/src/pages/options/youtube/youtube.html b/src/pages/options/youtube/youtube.html
index bc0e8ef2..6bb213ac 100644
--- a/src/pages/options/youtube/youtube.html
+++ b/src/pages/options/youtube/youtube.html
@@ -5,8 +5,9 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
     <link href="../../stylesheets/styles.css" rel="stylesheet" />
-    <title>LibRedirect Options: Twitter</title>
+    <title>LibRedirect options: Twitter</title>
 </head>
 
 <body class="option">
diff --git a/src/pages/popup/popup.html b/src/pages/popup/popup.html
index 52aa11f1..4a1e9874 100644
--- a/src/pages/popup/popup.html
+++ b/src/pages/popup/popup.html
@@ -84,6 +84,7 @@
   </div>
 
 
+  <script type="module" src="../options/init.js"></script>
   <script type="module" src="./popup.js"></script>
   <script src="../../assets/javascripts/localise.js"></script>
 </body>
diff --git a/src/pages/popup/popup.js b/src/pages/popup/popup.js
index 11561d7b..8625cf9b 100644
--- a/src/pages/popup/popup.js
+++ b/src/pages/popup/popup.js
@@ -25,7 +25,6 @@ let disableMediumElement = document.querySelector("#disable-scribe");
 window.browser = window.browser || window.chrome;
 
 async function wholeInit() {
-  console.log("staring async func")
   await youtubeHelper.init();
   await twitterHelper.init();
   await instagramHelper.init();
diff --git a/src/pages/stylesheets/styles.css b/src/pages/stylesheets/styles.css
index 1d2e9428..deabdc92 100644
--- a/src/pages/stylesheets/styles.css
+++ b/src/pages/stylesheets/styles.css
@@ -10,11 +10,6 @@ body {
   --light-grey: #c3c3c3;
 }
 
-body.light-theme {
-  --text: #000;
-  --bg-main: #e3e7ea;
-  --bg-secondary: #fff;
-}
 
 body {
   margin: auto;
@@ -130,29 +125,6 @@ hr {
   border: none;
 }
 
-.light-theme.popup,
-.light-theme .popup {
-  background-color: var(--bg-secondary);
-}
-
-body.light-theme {
-  --text: #000;
-  --bg-main: #e3e7ea;
-  --bg-secondary: #fff;
-}
-
-body.light-theme textarea {
-  color: black;
-  border: 1px solid #767676;
-}
-
-body.light-theme textarea:focus {
-  outline: none;
-}
-
-body.light-theme a {
-  color: black;
-}
 
 div.some-block {
   padding: 0 15px;
@@ -301,22 +273,35 @@ button.add {
   cursor: pointer;
 }
 
-@media (prefers-color-scheme: light) {
-  body {
-    --text: #000;
-    --text-secondary: #fff;
-    --bg-main: #e3e7ea;
-    --bg-secondary: #fff;
-  }
 
-  body.dark-theme {
-    --text: #fff;
-    --text-secondary: #000;
-    --bg-main: #3c4043;
-    --bg-secondary: #292a2d;
-  }
+.light-theme.popup,
+.light-theme .popup {
+  background-color: var(--bg-secondary);
+}
+
+body.light-theme {
+  --text: black;
+  --bg-main: white;
+  --bg-secondary: #fff;
+  --active: #fb9817;
+}
+
+body.light-theme select {
+  border: 1px solid black;
+}
+
+body.light-theme textarea {
+  color: black;
+  border: 1px solid #767676;
+}
+
+body.light-theme textarea:focus {
+  outline: none;
+}
+
+body.light-theme a {
+  color: black;
+}
 
-  .popup {
-    background-color: var(--bg-secondary);
-  }
+@media (prefers-color-scheme: light) {
 }
 \ No newline at end of file
author	ManeraKai <manerakai@protonmail.com>	2022-02-08 20:30:50 +0300
committer	ManeraKai <manerakai@protonmail.com>	2022-02-08 20:30:50 +0300
commit	b715e43553296d5380518e7d17be6b51eac0fdf7 (patch)
tree	a8b4e991ee3914d61fbe876372901fb1e551dc37
parent	Added the same regex as in the faq page in scribe #19 (diff)
download	libredirect-b715e43553296d5380518e7d17be6b51eac0fdf7.zip