79a6567530
Tooltip, toast, and combobox popups still hardcoded light colors (bg-white, neutral-*, indigo-50) and rendered as white boxes in dark mode; the objects-table page-size select did the same in app code. Swap all of them to theme tokens (popover/accent/muted/destructive/ success) and replace the toast's literal "×" with the lucide X icon. Wire browser chrome into the theme: color-scheme via CSS on :root/.dark (follows the in-app toggle, not just the OS), a theme-color meta kept in sync by the preload script and applyTheme(), plus a unit test for the meta sync. Extend check-no-raw-colors to also flag shadeless white/black utilities outside components/ui/ so the objects-table case can't recur. Closes #68 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
28 lines
945 B
HTML
28 lines
945 B
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="color-scheme" content="light dark" />
|
|
<meta name="theme-color" content="#ffffff" />
|
|
<title>Collection</title>
|
|
<script>
|
|
try {
|
|
var t = localStorage.getItem("theme") || "system";
|
|
var dark =
|
|
t === "dark" ||
|
|
(t === "system" &&
|
|
window.matchMedia("(prefers-color-scheme: dark)").matches);
|
|
document.documentElement.classList.toggle("dark", dark);
|
|
// Keep in sync with THEME_COLORS in src/theme/theme.ts.
|
|
var meta = document.querySelector('meta[name="theme-color"]');
|
|
if (meta) meta.setAttribute("content", dark ? "#0a0a0a" : "#ffffff");
|
|
} catch (e) {}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
<script type="module" src="/src/main.tsx"></script>
|
|
</body>
|
|
</html>
|