/* Murphy Insulation — Tweaks panel.
Applies theme via data-* attributes on ; CSS does the rest. */
const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
"accent": "orange",
"tone": "navy",
"header": "dark",
"hero": "photo",
"display": "archivo",
"showPanel": true
}/*EDITMODE-END*/;
function MurphyTweaks() {
const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);
React.useEffect(() => {
const r = document.documentElement;
r.setAttribute("data-accent", t.accent);
r.setAttribute("data-tone", t.tone);
r.setAttribute("data-header", t.header);
r.setAttribute("data-hero", t.hero);
r.setAttribute("data-display", t.display);
}, [t.accent, t.tone, t.header, t.hero, t.display]);
return (
setTweak("accent", HEX_ACCENT[hex] || "orange")}
/>
setTweak("tone", v)}
/>
setTweak("header", v)}
/>
setTweak("hero", v)}
/>
setTweak("display", v)}
/>
);
}
const ACCENT_HEX = { orange: "#f2591d", red: "#e23217", copper: "#c47a3d", amber: "#f0a431" };
const HEX_ACCENT = Object.fromEntries(Object.entries(ACCENT_HEX).map(([k, v]) => [v, k]));
ReactDOM.createRoot(document.getElementById("tweaks-root")).render();