More dark mode issues

2 files changed, 18 insertions, 0 deletions

diff --git a/js/background.js b/js/background.js
index fbf2572..4bdba26 100644
--- a/js/background.js
+++ b/js/background.js
@@ -290,6 +290,8 @@ chrome.runtime.onMessage.addListener(
 				});
 			}
 			});
+		} else if (request.type == 'update-icon') {
+			updateIcon();
 		} else if (request.type == 'toggle-sync') {
 			// Notes on Toggle Sync feature here https://github.com/einaregilsson/Redirector/issues/86#issuecomment-389943854
 			// This provides for feature request - issue 86
@@ -463,4 +465,8 @@ function handleStartup(){
 	});
 
 	updateIcon(); //To set dark/light icon...
+
+	//This doesn't work yet in Chrome, but we'll put it here anyway, in case it starts working...
+	let darkModeMql = window.matchMedia('(prefers-color-scheme: dark)');
+	darkModeMql.onchange = updateIcon;
 }
\ No newline at end of file
diff --git a/js/redirectorpage.js b/js/redirectorpage.js
index 30e27a9..f82b0b7 100644
--- a/js/redirectorpage.js
+++ b/js/redirectorpage.js
@@ -202,4 +202,16 @@ function pageLoad() {
 	});
 }
 
+
+function updateFavicon(e) {
+	let type = e.matches ? 'dark' : 'light'
+	el('link[rel="shortcut icon"]').href = `images/icon-${type}-theme-32.png`;
+	chrome.runtime.sendMessage({type: "update-icon"}); //Only works if this page is open, but still, better than nothing...
+}
+
+let mql = window.matchMedia('(prefers-color-scheme:dark)');
+
+mql.onchange = updateFavicon;
+updateFavicon(mql);
+
 pageLoad();
\ No newline at end of file