From b46dab194b60687e5b698564bd4adccecb8b2271 Mon Sep 17 00:00:00 2001
From: h <h@kotikot.com>
Date: Sat, 29 Aug 2026 19:25:25 +0200
Subject: [PATCH] fix(theme): switches take obsidian's toggle look, thumb
 visible on dark themes

---
 src/tailwind.css | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/src/tailwind.css b/src/tailwind.css
index 7683602..490c0e5 100644
--- a/src/tailwind.css
+++ b/src/tailwind.css
@@ -360,6 +360,29 @@
   .beaver-root [data-slot="select-content"]::before {
     display: none !important;
   }
+  /* Obsidian's own toggle: border-hover track, accent when on, a white thumb. */
+  .beaver-root [data-slot="switch"] {
+    width: 40px !important;
+    height: 20px !important;
+    background: var(--background-modifier-border-hover) !important;
+    border: 0 !important;
+    border-radius: var(--toggle-radius, 18px) !important;
+  }
+  .beaver-root [data-slot="switch"][data-state="checked"] {
+    background: var(--interactive-accent) !important;
+  }
+  .beaver-root [data-slot="switch-thumb"] {
+    display: block !important;
+    width: 16px !important;
+    height: 16px !important;
+    margin-left: 2px !important;
+    background: var(--toggle-thumb-color, white) !important;
+    border-radius: 50% !important;
+    box-shadow: var(--shadow-s) !important;
+  }
+  .beaver-root [data-slot="switch-thumb"][data-state="checked"] {
+    transform: translateX(20px) !important;
+  }
   .beaver-root [data-slot="button"][data-variant="default"],
   .beaver-root [data-slot="button"]:not([class*="bg-"]) {
     font-weight: var(--font-medium, 500) !important;