Kyle Pope
e7be762198
The inline script's style.setProperty values on <html> were being stripped during Vite's CSS injection. Switch to injecting a <style> tag with :root vars which persists in the DOM. Restore CSS defaults as safety fallback. Update useTheme to sync both the style tag and inline styles when settings load. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
41 lines
1.6 KiB
HTML
41 lines
1.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="dark">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
|
<meta name="theme-color" content="#09090b" />
|
|
<meta name="mobile-web-app-capable" content="yes" />
|
|
<title>UMBRA</title>
|
|
<script>
|
|
// Inject a <style> tag with accent color vars before React hydrates.
|
|
// Uses a style element (not inline style attr) because Vite's CSS
|
|
// injection strips the html element's style attribute.
|
|
(function() {
|
|
var h = '187', s = '85.7%', l = '53.3%';
|
|
try {
|
|
var c = localStorage.getItem('umbra-accent-color');
|
|
if (c) {
|
|
var p = JSON.parse(c);
|
|
if (p.h) h = p.h;
|
|
if (p.s) s = p.s;
|
|
if (p.l) l = p.l;
|
|
}
|
|
} catch(e) {}
|
|
var el = document.createElement('style');
|
|
el.id = 'umbra-accent';
|
|
el.textContent = ':root{--accent-h:' + h + ';--accent-s:' + s + ';--accent-l:' + l + '}';
|
|
document.head.appendChild(el);
|
|
})();
|
|
</script>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link href="https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700&family=DM+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap" rel="stylesheet" />
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
<script type="module" src="/src/main.tsx"></script>
|
|
</body>
|
|
</html>
|