fix: change to customclasses, add inspector

henrikvilhelmberglund · henrikvilhelmberglund · commit aa5311fb2287 · 2026-02-14T13:09:16.000+01:00
diff --git a/examples/vite-svelte/src/App.svelte b/examples/vite-svelte/src/App.svelte
@@ -27,6 +27,8 @@
 
   <h1 class="animate-bounce">Hello Typescript!</h1>
 
+  <h2 class="text-lg font-semibold text-orange-600">Use shift+ctrl for the inspector</h2>
+
   <br/>
 
   <div class:bg-red-400={red}>BG Color should change</div>
@@ -46,7 +48,7 @@
 
 <Footer />
 <Footer foo={true} name=Footer2 />
-<Footer customclass={"bg-blue-500"} name=Footer3 />
+<Footer customclasses={"bg-blue-500 text-xl"} name=Footer3 />
 
 
 <style>
diff --git a/examples/vite-svelte/src/Footer.svelte b/examples/vite-svelte/src/Footer.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
-  const { foo = false, customclass = "", name = "Footer" } = $props()
+  const { foo = false, customclasses = "", name = "Footer" } = $props()
 </script>
 
 <footer>
-  <div class="bar {customclass}" class:foo>{name}</div>
+  <div class="bar {customclasses}" class:foo>{name}</div>
 </footer>
diff --git a/examples/vite-svelte/vite.config.js b/examples/vite-svelte/vite.config.js
@@ -6,6 +6,12 @@ import { defineConfig } from 'vite'
 export default defineConfig({
   plugins: [
     UnoCSS(),
-    svelte(),
+    svelte({
+      inspector: {
+        toggleKeyCombo: 'control-shift',
+        showToggleButton: 'always',
+        toggleButtonPos: 'bottom-right',
+      },
+    }),
   ],
 })
