diff --git a/assets/build.js b/assets/build.js
index a1d8d11..b993d1a 100644
--- a/assets/build.js
+++ b/assets/build.js
@@ -14,7 +14,7 @@ const plugins = [
 ]
 
 let opts = {
-  entryPoints: ['js/app.js'],
+  entryPoints: ['js/app.js', 'js/public.js'],
   bundle: true,
   target: 'es2017',
   outdir: '../priv/static/assets',
diff --git a/assets/js/public.js b/assets/js/public.js
new file mode 100644
index 0000000..3af215d
--- /dev/null
+++ b/assets/js/public.js
@@ -0,0 +1,17 @@
+import lolight from "../vendor/lolight"
+
+lolight("pre code")
+
+document
+	.querySelector("#dark-mode-toggle")
+	.addEventListener("click", (e) => {
+		e.preventDefault()
+		const data = document.documentElement.dataset
+		if (data["mode"] && data["mode"] == "dark") {
+			delete data["mode"]
+			window.localStorage.removeItem("theme")
+		} else {
+			data["mode"] = "dark"
+			window.localStorage.setItem("theme", "dark")
+		}
+	})
\ No newline at end of file
diff --git a/lib/chiya_web/components/layouts/root_public.html.heex b/lib/chiya_web/components/layouts/root_public.html.heex
index 3769f47..2ebbecd 100644
--- a/lib/chiya_web/components/layouts/root_public.html.heex
+++ b/lib/chiya_web/components/layouts/root_public.html.heex
@@ -11,7 +11,7 @@
     <.favicon />
 
     <link phx-track-static rel="stylesheet" href={~p"/assets/app.css"} />
-    <script defer phx-track-static type="text/javascript" src={~p"/assets/app.js"}>
+    <script defer phx-track-static type="text/javascript" src={~p"/assets/public.js"}>
     </script>
     <script>
       if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {