loki5512344
756ebc6d86
Owner's complaint: the two-pane layout's decorative right-side panel
("Твои настройки LoVisual на любом компьютере...") made no sense next
to a login form. Dropped the whole two-pane concept, not just its
visuals.
Login/register now render as the mod's own in-game account screen:
night-lake backdrop (the same Backdrop the landing hero uses), a
clock + Вход/Регистрация tab switcher styled like the mod's own
ClickGui tabs, a single glass panel on the mod's own category
colours, and a real mod-style hint row ("X - Y") instead of marketing
copy. What an account actually gets you is stated as plain hints
(4 cloud slots, share a slot's code, the mod signs itself in by code,
no account required to just use the mod) instead of a sales pitch.
- AuthSplit.tsx removed; AuthScreen.tsx + auth.css replace it
- LoginForm/RegisterForm: dropped the redundant login<->register text
link now that the tab switcher does that job; RegisterForm now
honours the original `from` redirect (previously always went to
/configs even when registration started from /link)
- Rewrote auth i18n copy to match the site's established voice
Claude-Session: https://claude.ai/code/session_01F1M1Jic1wTSn4igUENynmZ
|
||
|---|---|---|
| .. | ||
| public | ||
| scripts | ||
| src | ||
| .env.example | ||
| .gitignore | ||
| .oxlintrc.json | ||
| ARCHITECTURE.md | ||
| bun.lock | ||
| index.html | ||
| package.json | ||
| PLAN.md | ||
| README.md | ||
| tsconfig.app.json | ||
| tsconfig.json | ||
| tsconfig.node.json | ||
| tsconfig.test.json | ||
| vite.config.ts | ||
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/enresources per feature, compile-time key parity viasatisfies - 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.