/* tweaks-app.jsx — mounts the Tweaks panel and applies theme/accent to .
The page itself is static; this island only flips root attributes. */
const VLA_TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
"style": "academic",
"accent": "purpleblue"
}/*EDITMODE-END*/;
const STYLE_OPTS = [
{ value: "academic", label: "Academic" },
{ value: "technical", label: "Technical" },
{ value: "editorial", label: "Editorial" },
];
const ACCENT_OPTS = [
{ value: "purpleblue", label: "Purple + Blue" },
{ value: "crimsonslate", label: "Crimson + Slate" },
{ value: "violetteal", label: "Violet + Teal" },
];
function VLATweaks() {
const [t, setTweak] = useTweaks(VLA_TWEAK_DEFAULTS);
React.useEffect(() => {
document.documentElement.setAttribute("data-theme", t.style);
}, [t.style]);
React.useEffect(() => {
document.documentElement.setAttribute("data-accent", t.accent);
}, [t.accent]);
return (
setTweak("style", v)}
/>
setTweak("accent", v)}
/>
);
}
ReactDOM.createRoot(document.getElementById("tweaks-root")).render();