first commit

.gitignore

@@ -0,0 +1,3 @@
+__pycache__
+.vscode
+.directory

javascript/Readme.md

@@ -0,0 +1,5 @@
+# Toggle light and dark themes
+
+![](/img.png)
+
+An extension for [sd-webui](https://github.com/AUTOMATIC1111/stable-diffusion-webui). If your systems' theme is dark, it will add and remove `?__theme=light` automatically, and `?__theme=dark` if your system is light

javascript/toggle_dark_light.js

@@ -0,0 +1,43 @@
+
+onUiLoaded(() => {
+	function updateUrlParameter(key, value) {
+		var url = new URL(window.location.href);
+		url.searchParams.set(key, value);
+		history.replaceState(null, '', url.href);
+	}
+
+	function deleteUrlParameter(key) {
+		var url = new URL(window.location.href);
+		url.searchParams.delete(key);
+		history.replaceState(null, '', url.href);
+	}
+
+	function syncArgAndClass() {
+		if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+			if (!document.body.classList.contains('dark')) {
+				updateUrlParameter('__theme', 'light');
+			} else {
+				deleteUrlParameter('__theme');
+			}
+		} else {
+			if (document.body.classList.contains('dark')) {
+				updateUrlParameter('__theme', 'dark');
+			} else {
+				deleteUrlParameter('__theme');
+			}
+		}
+	}
+
+    function toggleDarkMode() {
+        document.body.classList.toggle('dark');
+		syncArgAndClass();
+    }
+
+    const button = document.createElement('button');
+    button.textContent = '☀️/🌙';
+    button.className = 'toggle-dark-mode';
+    button.onclick = toggleDarkMode;
+
+    document.body.appendChild(button);
+
+});

style.css

@@ -0,0 +1,13 @@
+
+.toggle-dark-mode {
+    font-family: monospace;
+    position: absolute;
+    background-color: transparent;
+    color: var(--button-secondary-text-color);
+    top: 10px;
+    right: 10px;
+    border: none;
+    cursor: pointer;
+    padding: 5px 10px;
+    font-size: 16px;
+}