History

loki5512344 ab86078ca3 perf(frontend): stop theme switches from janking the whole page Two inherited-custom-property transitions were forcing a full style recalculation on every animation frame during a theme switch: - html transitioned --color-ice/--page-accent-glow (inherits: true), both read by dozens of selectors site-wide (buttons, links, glows, color-mix() gradients) -- animating them recomputed style for every element that references them, across the whole page, not just the swatch that was clicked. - .lv-gui (the ClickGui replica used in ThemeStrip, HudPlayground, the login backdrop and the theme editor panel) transitioned 21 inherited custom properties at once, including per-row/per-tab ones (--gui-row-, --gui-tab-, --gui-menu-*) -- with a long module list that's the same cost multiplied by every row/tab in the tree. Both now snap instantly instead of transitioning; .lv-gui keeps a 300ms cross-fade but only on the ~8 properties that read as "the theme" (window/header/stroke/text/accent/panel), not per-row state. Claude-Session: https://claude.ai/code/session_01F1M1Jic1wTSn4igUENynmZ		2026-09-30 10:37:40 +02:00
..
public	feat(frontend): add a proper 1200x630 og:image for link previews	2026-09-28 22:26:38 +02:00
scripts	chore(history): squash 67 commit(s) from 2026-09-25	2026-09-25 20:22:13 +02:00
src	perf(frontend): stop theme switches from janking the whole page	2026-09-30 10:37:40 +02:00
.env.example	chore(history): squash 67 commit(s) from 2026-09-25	2026-09-25 20:22:13 +02:00
.gitignore	test(frontend): lock the style invariants a QA pass keeps re-finding	2026-09-28 13:27:15 +02:00
.oxlintrc.json	chore(history): squash 59 commit(s) from 2026-09-23	2026-09-23 22:38:08 +02:00
ARCHITECTURE.md	refactor(frontend): bring shared/ui and pages/public under the 4-file rule	2026-09-28 13:21:18 +02:00
bun.lock	feat(frontend): avatar upload QOL — feedback, re-crop, drop, progress, history	2026-09-28 22:56:01 +02:00
index.html	feat(frontend): add a proper 1200x630 og:image for link previews	2026-09-28 22:26:38 +02:00
package.json	feat(frontend): avatar upload QOL — feedback, re-crop, drop, progress, history	2026-09-28 22:56:01 +02:00
PLAN.md	feat(frontend): avatar upload QOL — feedback, re-crop, drop, progress, history	2026-09-28 22:56:01 +02:00
README.md	docs: add a real root README and rewrite the frontend one	2026-09-28 17:28:41 +02:00
tsconfig.app.json	feat(frontend): avatar upload QOL — feedback, re-crop, drop, progress, history	2026-09-28 22:56:01 +02:00
tsconfig.json	test(frontend): lock the style invariants a QA pass keeps re-finding	2026-09-28 13:27:15 +02:00
tsconfig.node.json	chore(history): squash 67 commit(s) from 2026-09-25	2026-09-25 20:22:13 +02:00
tsconfig.test.json	feat(frontend): avatar upload QOL — feedback, re-crop, drop, progress, history	2026-09-28 22:56:01 +02:00
vite.config.ts	feat(frontend): avatar upload QOL — feedback, re-crop, drop, progress, history	2026-09-28 22:56:01 +02:00

README.md

LoVisual Website

The frontend for LoVisual - a marketing site with a live in-game GUI demo, download page, documentation, themes/showcase pages, and an account dashboard with a cloud config manager. UI is fully bilingual (Russian default, English toggle, persisted in the URL).

Stack

React 19 + TypeScript + Vite, package manager: bun
Tailwind CSS v4 with custom design tokens (radii, glass panels, control sizing)
TanStack Query for backend calls, react-router for pages
react-i18next - ru/en resources per feature, compile-time key parity via satisfies
motion/react for animation, vitest + Testing Library for tests
oxlint for linting

Layout

src/
├── app/         router, providers, App shell
├── features/    one folder per domain (account, cloud, demo, themes, ...)
│   └── <f>/     api.ts · i18n/{ru,en}.ts · components/ · tests/
├── pages/       route-level pages composing features
├── shared/      ui primitives, i18n bootstrap, easter eggs, helpers
└── test/        vitest setup and utilities

Feature-folder rules: API calls, translations and components live together; no cross-feature imports except through shared/.

Scripts

bun install        # install dependencies
bun run dev        # dev server on http://localhost:5173 (proxies /api to the backend)
bun run test       # vitest run
bun run build      # tsc -b + vite build → dist/
bun run lint       # oxlint
bun run gen:themes # regenerate theme tokens from the mod palette (scripts/extract-themes.ts)

The dev server expects the Rust gateway on 127.0.0.1:8080 (see backend/); without it, API-backed pages degrade to demo/offline states by design.

Testing

Unit and component tests are colocated in features/*/tests/ and shared/**/tests/; run a single file with bunx vitest run src/features/account/tests/account.test.tsx. Translation parity (ru ↔ en key sets) is enforced at compile time and in tests.