Files
Checkmate/client/src/main.tsx
T
gorkem-bwl e69a2f05af feat(client): define the neutral palette and switch to Geist
The palette declared a brand green and six chart hues but never defined
the neutrals, so MUI's defaults filled the gap: body text at 60% black,
dividers at 12%, and background.default equal to background.paper. That
is the "washed out" everything sat on - table cells render through
text.secondary, and cards had no ground to sit on.

- Opaque neutral ramp, biased slightly green so it sits with the brand.
  background.default is now off-white so paper separates from the page.
- Semantic success/error/warning derived from the brand instead of
  Material's stock red/green/orange. Only `main` is set: `light` is
  consumed as a saturated colour by status dots, histogram bars and
  heatmap cells, so MUI must keep deriving it.
- Dark mode gets the same treatment; it defined background and secondary
  but its text and divider were still MUI defaults.
- Geist Variable, self-hosted via @fontsource-variable so air-gapped
  installs keep the typeface. Base size stays at 13px.
- h1 700 / h2 600 against 400 body, and table headers 500 -> 600. Two
  weights was why everything read at the same visual weight.

All contrast pairs pass WCAG AA in both themes (lowest 5.98:1).
No component markup changed.

Claude-Session: https://claude.ai/code/session_01AbYLvwpEaZFXktHVcqrFRd
2026-09-03 00:45:40 -04:00

28 lines
782 B
TypeScript

import ReactDOM from "react-dom/client";
import App from "./App.jsx";
// Self-hosted so the app keeps its typeface on air-gapped installs
import "@fontsource-variable/geist";
import "./index.css";
import { BrowserRouter as Router } from "react-router-dom";
import { Provider } from "react-redux";
import { persistor, store } from "@/store.js";
import { PersistGate } from "redux-persist/integration/react";
import I18nLoader from "./Components/i18nLoader/index.js";
import { initApiClient } from "./Utils/ApiClient.js";
initApiClient(store);
ReactDOM.createRoot(document.getElementById("root")!).render(
<Provider store={store}>
<PersistGate
loading={null}
persistor={persistor}
>
<I18nLoader />
<Router>
<App />
</Router>
</PersistGate>
</Provider>
);