cb88b3977c
Implements #17, #18, #19, #20, #21 - Add CSS custom properties for density-dependent spacing (--d-* vars) in theme.css with comfortable (default) and compact modes - Create useDensity hook with localStorage persistence and DOM attribute sync - Add FOUC prevention in main.tsx (sync density before first paint) - Create shared PageFooter component merging stats + pagination - Refactor AppShell to flex layout with density toggle button (COM/CMP) - Consolidate inline pagination from ItemsPage/AuditPage into PageFooter - Delete FooterStats.tsx (replaced by PageFooter) - Replace all hardcoded padding/font/gap values in ItemTable, AuditTable, ItemsToolbar, and AuditToolbar with var(--d-*) references Comfortable mode is already tighter than the previous hardcoded values. Compact mode reduces further for power-user density.
26 lines
765 B
TypeScript
26 lines
765 B
TypeScript
import { StrictMode } from "react";
|
|
import { createRoot } from "react-dom/client";
|
|
import { BrowserRouter } from "react-router-dom";
|
|
import { AuthProvider } from "./context/AuthContext";
|
|
import { App } from "./App";
|
|
import "./styles/global.css";
|
|
|
|
// Apply saved density before first paint to prevent FOUC
|
|
try {
|
|
const saved = localStorage.getItem("silo-density");
|
|
const density = saved ? JSON.parse(saved) : "comfortable";
|
|
document.documentElement.setAttribute("data-density", density);
|
|
} catch {
|
|
document.documentElement.setAttribute("data-density", "comfortable");
|
|
}
|
|
|
|
createRoot(document.getElementById("root")!).render(
|
|
<StrictMode>
|
|
<BrowserRouter>
|
|
<AuthProvider>
|
|
<App />
|
|
</AuthProvider>
|
|
</BrowserRouter>
|
|
</StrictMode>,
|
|
);
|