Le
7ed53050b7
index.css had a hand-written reset (`*, *::before, *::after { margin: 0;
padding: 0; box-sizing: border-box; }`) left over from before Tailwind was
added, sitting outside any `@layer` block. Per the CSS Cascade Layers spec,
unlayered rules always beat layered rules regardless of selector
specificity — since every Tailwind utility class lives inside `@layer
utilities`, this one `*`-selector rule was silently overriding every
single margin/padding utility (p-*, m-*, mx-auto, etc.) across the entire
app. Other properties (colors, borders, gap) weren't affected, which is
why this went unnoticed through the whole Tailwind migration — only
spacing/centering was silently broken, not colors or general layout.
Tailwind's own preflight (already loaded via `@import "tailwindcss"`,
correctly placed inside `@layer base`) provides the identical reset, so
the duplicate unlayered copy was simply deleted.
Also fixed two smaller, related issues found while investigating: an
inline `style={{ maxWidth: '100vw' }}` on Login/Register's auth-card
overrode its CSS class's `max-width: 400px`, stretching it to near full
viewport width on screens wider than ~400px (invisible on mobile, obvious
on laptop/desktop — probably what originally looked like "responsive
wasn't fixed"). And BacktestPage.tsx, unlike every other page, rendered
its `mx-auto`-centered container as a direct child of #root (which has
`display: flex; flex-direction: column`), so flexbox's default
align-items: stretch overrode the centering; wrapped it in the same
min-h-screen container pattern every other page already uses.
Verified via direct getComputedStyle()/getBoundingClientRect() measurement
(screenshots in this environment don't reliably reflect true layout) —
margin-inline resolved to 0px before the fix, 183px (correctly centered)
after. Frontend build clean, 170 backend tests unaffected (CSS-only change).
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
React + TypeScript + Vite
This template provides a minimal setup to get React working in Vite with HMR and some Oxlint rules.
Currently, two official plugins are available:
- @vitejs/plugin-react uses Oxc
- @vitejs/plugin-react-swc uses SWC
React Compiler
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.
Expanding the Oxlint configuration
If you are developing a production application, we recommend enabling type-aware lint rules by installing oxlint-tsgolint and editing .oxlintrc.json:
{
"$schema": "./node_modules/oxlint/configuration_schema.json",
"plugins": ["react", "typescript", "oxc"],
"options": {
"typeAware": true
},
"rules": {
"react/rules-of-hooks": "error",
"react/only-export-components": ["warn", { "allowConstantExport": true }]
}
}
See the Oxlint rules documentation for the full list of rules and categories.