From ca51fddea398900b2350399ffcdabd95e6e7f2ee Mon Sep 17 00:00:00 2001
From: Towsty <ianjmcarr@gmail.com>
Date: Tue, 25 Aug 2026 18:09:34 -0500
Subject: [PATCH] Relabel the library thumbnail control as a positive Thumbnail
 toggle.

On keeps the still visible; off still hides it and uses the sensitive glow until play.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 pages/index.vue | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/pages/index.vue b/pages/index.vue
index 3152963..69cf197 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -94,11 +94,12 @@
               >
               <button type="button" class="rounded-xl border border-white/15 px-3 py-2 text-sm hover:border-amber-300/50" @click="addFolder">Add</button>
             </div>
-            <label class="flex items-start gap-3 rounded-2xl border border-white/10 bg-zinc-950/40 px-4 py-3 text-sm">
-              <input v-model="hideThumbnail" type="checkbox" class="mt-1 accent-amber-400">
-              <span>
-                <span class="block font-medium text-zinc-200">Hide thumbnail</span>
-                <span class="text-xs text-zinc-500">For sensitive prompts. The preview glows when ready until you play the clip.</span>
+            <label class="flex cursor-pointer items-center justify-between gap-3 rounded-2xl border border-white/10 bg-zinc-950/40 px-4 py-3 text-sm">
+              <span class="font-medium text-zinc-200">Thumbnail</span>
+              <span class="relative inline-flex h-6 w-11 shrink-0 items-center">
+                <input v-model="showThumbnail" type="checkbox" class="peer sr-only" role="switch">
+                <span class="absolute inset-0 rounded-full bg-zinc-700 transition peer-checked:bg-amber-400" />
+                <span class="absolute left-0.5 top-0.5 h-5 w-5 rounded-full bg-white transition peer-checked:translate-x-5" />
               </span>
             </label>
           </div>
@@ -334,6 +335,10 @@ const turbo = ref(true)
 const duration = ref(5)
 const seedInput = ref('random')
 const hideThumbnail = ref(false)
+const showThumbnail = computed({
+  get: () => !hideThumbnail.value,
+  set: (value: boolean) => { hideThumbnail.value = !value }
+})
 const busy = ref(false)
 const progress = ref(0)
 const statusMessage = ref('Waiting for a still.')