redesign(ui): спортивная палитра Strava + полная адаптивность
== Цветовая гамма == Сменили esports cyan+violet на спортивную Strava-палитру: - accent: orange-500 (#F97316) — энергия, движение, "GO" - accent-2: rose-500 (#F43F5E) — интенсивность, gradient pair - victory: lime-500 — личный рекорд / готово - defeat: red-600 - xp: amber-500 Dark theme переведена с холодного navy на тёплый графит, light theme очищена в "athletic paper" feel. == Репозиционирование текста == Убрали esports-сленг в пользу спортивной лексики: - Sidebar: "Play hard · Train harder" → "Move every day" - Sidebar footer: "GSI-трекинг матчей" → "Трекинг активности" - Dashboard микрозаголовок: "Mission control" → "Тренировка дня" - Dashboard HUD: "Cooldown / READY" → "До следующего / СЕЙЧАС", "Game tracking / LIVE / OFF" → "Трекинг матчей / LIVE / OFF" - Exercises: "Loadout" → "Программа" - Games: "Game integrations" → "Трекинг матчей" - Challenges: "Match rules" → "Правила за матч" - Settings: "Config" → "Конфигурация" - ExerciseCard: "Cooldown / PAUSED" → "Через / пауза" - ReminderApp: "Cooldown ready" → "Время тренировки", "Время размяться" → "Двигайся", "Next drop" → "Следующее", "Victory · упражнения заработаны" → "Победа · тренировка заработана", "Defeat · но тело — нет" → "Проигрыш · но тело не сдаётся", "all clear" → "готово", "Total / reps" → "Всего / повторов", "GG" → "Готово" == Адаптивная вёрстка == - App.tsx: state mobileNavOpen, авто-закрытие drawer на route change - Sidebar: три режима через CSS breakpoints — * lg+ (≥1024px): полная ширина w-60 с лейблами * md (768-1023px): icon-only w-16 с title-тултипами * <md (<768px): скрыта, открывается drawer-ом по hamburger - Titlebar: hamburger button слева на <md, title скрывается на <sm - Все hero-блоки страниц: flex-col на sm, flex-row sm:items-end sm:justify-between с stack gap-4 - Padding страниц: p-4 sm:p-6 lg:p-8 вместо p-8 - Hero h1: text-3xl sm:text-4xl - Dashboard HUD strip: grid-cols-2 lg:grid-cols-4 (было 1/2/4) - Action buttons в карточках/строках: opacity-100 lg:opacity-0 lg:group-hover (на узких экранах всегда видны) - GameRow buttons: flex-wrap для длинных лейблов - Dashboard challenges shortcut: hint hidden sm:block - Sidebar mobile drawer: framer-motion слайд + backdrop с blur Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -86,14 +86,14 @@ export default function Dashboard(): JSX.Element {
|
||||
const paused = !settings?.globalEnabled
|
||||
|
||||
return (
|
||||
<div className="p-8 overflow-y-auto h-full">
|
||||
<div className="p-4 sm:p-6 lg:p-8 overflow-y-auto h-full">
|
||||
{/* Hero header */}
|
||||
<div className="flex items-end justify-between mb-6">
|
||||
<div>
|
||||
<div className="flex flex-col sm:flex-row sm:items-end sm:justify-between gap-4 mb-6">
|
||||
<div className="min-w-0">
|
||||
<div className="text-[10px] uppercase tracking-[0.22em] text-muted font-semibold mb-2">
|
||||
Mission control
|
||||
Тренировка дня
|
||||
</div>
|
||||
<h1 className="font-display font-bold text-4xl leading-none uppercase tracking-wide">
|
||||
<h1 className="font-display font-bold text-3xl sm:text-4xl leading-none uppercase tracking-wide">
|
||||
<span className="text-gradient-brand">Дашборд</span>
|
||||
</h1>
|
||||
<p className="text-sm text-muted mt-2">
|
||||
@@ -104,7 +104,7 @@ export default function Dashboard(): JSX.Element {
|
||||
повторов за цикл
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="flex items-center gap-2 flex-shrink-0">
|
||||
<Button variant="secondary" onClick={togglePause}>
|
||||
{!paused ? (
|
||||
<>
|
||||
@@ -123,15 +123,15 @@ export default function Dashboard(): JSX.Element {
|
||||
</div>
|
||||
|
||||
{/* HUD stat strip */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-3 mb-6">
|
||||
<div className="grid grid-cols-2 lg:grid-cols-4 gap-3 mb-6">
|
||||
<HudStat
|
||||
icon={<Timer size={18} />}
|
||||
label="Cooldown"
|
||||
label="До следующего"
|
||||
value={
|
||||
stats.nextMs === Infinity
|
||||
? '—'
|
||||
: stats.nextMs <= 0
|
||||
? 'READY'
|
||||
? 'СЕЙЧАС'
|
||||
: formatCountdown(stats.nextMs)
|
||||
}
|
||||
accent={stats.nextMs <= 0 && stats.nextMs !== Infinity}
|
||||
@@ -148,7 +148,7 @@ export default function Dashboard(): JSX.Element {
|
||||
/>
|
||||
<HudStat
|
||||
icon={<Gamepad2 size={18} />}
|
||||
label="Game tracking"
|
||||
label="Трекинг матчей"
|
||||
value={gamesEnabled ? 'LIVE' : 'OFF'}
|
||||
accent={gamesEnabled}
|
||||
tone={gamesEnabled ? 'victory' : 'muted'}
|
||||
@@ -187,7 +187,7 @@ export default function Dashboard(): JSX.Element {
|
||||
{challenges.length} правил привязано к матчам
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-xs text-muted">
|
||||
<div className="hidden sm:block text-xs text-muted">
|
||||
См. вкладку <span className="text-accent font-semibold">Челленджи</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user