getToggleCSS(themeColor?: string): string
Get CSS for toggle switches using hidden checkbox + label pattern.
This enables CSS-only toggle state changes for server-rendered HTML. Use with a hidden checkbox (class="sr-only peer") and label with class="toggle-track" containing a span with class="toggle-thumb".
// Include in your page's <style> section:
${getToggleCSS()}
// Include in your page's <style> section: ${getToggleCSS()}
// HTML structure:
<div class="flex items-center gap-3"> <input type="checkbox" name="enabled" class="sr-only peer" id="toggle-1" /> <label for="toggle-1" class="toggle-track w-11 h-6 rounded-full cursor-pointer"> <span class="toggle-thumb w-5 h-5 rounded-full bg-white shadow-md"></span> </label> <label for="toggle-1">Enable feature</label> </div>