12 files changed, 52 insertions, 28 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">