1 Commits

Author SHA1 Message Date
AnRil
9b488164e0 release(v0.3.3): акцентная типография — все надписи крупнее и контрастнее
Some checks failed
CI / Typecheck + Tests (push) Has been cancelled
CI / Build (Windows) (push) Has been cancelled
Release / Build installer + publish release (push) Has been cancelled
Жалоба: вторичные подписи (Активных / До следующего / Трекинг матчей /
Возобнови чтобы продолжить отсчёт) выглядели мелко и плохо читались.

Сделан sweep по всему UI:
- Базовая шкала secondary text: 12px → 13-14px
- Контрастность подписей: text-text/45 → text-text/65 (или /75 для лейблов)
- font-medium → font-semibold для метаданных карточек

Dashboard:
- Дата: 13/font-medium → 14/font-semibold
- HeroStat label: 12/medium/55 → 14/semibold/75 (вот эти "Активных" и пр.)
- HeroStat value: 26/semibold → 28/bold
- HeroStat subvalue: 12/45 → 13/60/medium
- HeroStat icon plaque: 24px → 28px
- Paused banner title: 14 → 16, hint: 12 → 14/70
- Иконка баннера 36→40px

Settings:
- ToggleRow/SelectRow label: medium → semibold
- Hint: 12/55 → 13/65/medium
- "Конфигурация": 13/45/medium → 14/65/semibold

Exercises/Challenges (row + page):
- Row title: 15/medium → 16/semibold
- Row subtitle: 13/55 → 14/65/medium
- Стат-метрики bold
- Empty state: 14/55 → 15/65/medium
- Warning banner: 13/80 → 14/85/medium + иконка крупнее

Games:
- Game title: 17/semibold → 18/bold
- Install path subtitle: 12/45 → 13/55/medium
- Queue/error banners: 13/80 → 14/85/medium + крупнее иконки и code

ExerciseCard:
- Title: 17/semibold → 18/bold
- Reps meta: 13/55 → 14/65/medium
- Countdown label "Через/Сейчас": 11/45 → 12/60/semibold
- Countdown value: 22/semibold → 24/bold
- "Готово" CTA: 14/semibold → 15/bold, h-10 → h-11

ReminderApp:
- "Время тренировки" label: 12/45 → 13 + accent цвет + bold
- "Раз" подпись: 14/55 → 15/65/semibold
- "Следующее через": 12/45 → 13/65/medium
- Match summary header: 11/45 → 12/65/semibold
- Match summary subtitle: 12/45 → 13/65/medium
- Match summary total: 12/55 → 13/65/medium + 14 → 16 для числа
- ChallengeRow title: 14/medium → 15/semibold
- ChallengeRow subtitle: 12/55 → 13/65/medium
- CTA Готово: 15/semibold → 16/bold

UpdaterCard:
- Cell title medium → semibold
- Cell subtitle: 12/55 → 13/65/medium
- Иконка ячеек 36→40px
- Progress download title medium → semibold + 18px процент

Card SectionHeader:
- 12/medium/45 → 13/semibold/60

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-17 18:00:52 +07:00
10 changed files with 92 additions and 82 deletions

View File

@@ -1,6 +1,6 @@
{
"name": "laude",
"version": "0.3.2",
"version": "0.3.3",
"description": "Exercise reminder — Windows desktop app",
"main": "out/main/index.js",
"author": "AnRil",

View File

@@ -139,7 +139,7 @@ function ExerciseReminder({
</div>
</motion.div>
<div className="text-[12px] uppercase tracking-[0.18em] text-text/45 font-medium">
<div className="text-[13px] uppercase tracking-[0.18em] text-accent font-bold">
Время тренировки
</div>
<h1 className="font-serif text-[28px] leading-tight tracking-tight mt-2 mb-3 font-medium">
@@ -150,11 +150,11 @@ function ExerciseReminder({
<span className="text-[56px] font-semibold tracking-tight text-text leading-none">
{exercise.reps}
</span>
<span className="text-[14px] text-text/55">раз</span>
<span className="text-[15px] text-text/65 font-semibold">раз</span>
</div>
<div className="text-[12px] text-text/45 mt-4 inline-flex items-center gap-1.5">
<Clock size={11} strokeWidth={2.4} />
<div className="text-[13px] text-text/65 mt-4 inline-flex items-center gap-1.5 font-medium">
<Clock size={12} strokeWidth={2.4} />
Следующее через {formatInterval(exercise.intervalMinutes)}
</div>
</div>
@@ -163,20 +163,20 @@ function ExerciseReminder({
<div className="px-4 pb-4 space-y-2">
<button
onClick={done}
className="w-full h-12 rounded-2xl bg-accent text-white text-[15px] font-semibold inline-flex items-center justify-center gap-1.5 active:scale-[0.98] transition-transform"
className="w-full h-12 rounded-2xl bg-accent text-white text-[16px] font-bold inline-flex items-center justify-center gap-1.5 active:scale-[0.98] transition-transform"
>
<Check size={16} strokeWidth={2.5} /> Готово
<Check size={17} strokeWidth={2.5} /> Готово
</button>
<div className="grid grid-cols-2 gap-2">
<button
onClick={snooze}
className="h-11 rounded-2xl bg-surface-2 text-text text-[14px] font-medium inline-flex items-center justify-center gap-1.5 active:scale-[0.98] transition-transform"
className="h-11 rounded-2xl bg-surface-2 text-text text-[15px] font-semibold inline-flex items-center justify-center gap-1.5 active:scale-[0.98] transition-transform"
>
<Clock size={14} strokeWidth={2.5} /> {snoozeMinutes} мин
<Clock size={15} strokeWidth={2.5} /> {snoozeMinutes} мин
</button>
<button
onClick={skip}
className="h-11 rounded-2xl bg-surface-2 text-text/55 text-[14px] font-medium inline-flex items-center justify-center gap-1.5 active:scale-[0.98] transition-transform"
className="h-11 rounded-2xl bg-surface-2 text-text/65 text-[15px] font-semibold inline-flex items-center justify-center gap-1.5 active:scale-[0.98] transition-transform"
>
Пропустить
</button>
@@ -208,8 +208,8 @@ function MatchSummaryView({
return (
<div className="reminder-shell flex flex-col h-full">
<div className="titlebar-drag h-9 px-2 flex items-center justify-between">
<div className="text-[11px] text-text/45 font-medium inline-flex items-center gap-1.5 px-2">
<Gamepad2 size={11} strokeWidth={2.4} /> {summary.gameName}
<div className="text-[12px] text-text/65 font-semibold inline-flex items-center gap-1.5 px-2">
<Gamepad2 size={12} strokeWidth={2.4} /> {summary.gameName}
</div>
<button
onClick={onClose}
@@ -241,16 +241,16 @@ function MatchSummaryView({
<h1 className="font-serif text-[24px] tracking-tight font-medium">
{won ? 'Победа' : lost ? 'Поражение' : 'Матч завершён'}
</h1>
<p className="text-[12px] text-text/45 mt-1">
<span className="font-mono-num font-medium text-text/65">
<p className="text-[13px] text-text/65 mt-1.5 font-medium">
<span className="font-mono-num font-bold text-text">
{Math.floor(summary.durationMs / 60_000)}
</span>{' '}
мин · {summary.results.length} челлендж
{summary.results.length === 1 ? '' : 'а'} ·{' '}
{allDone ? (
<span className="text-success font-medium">всё готово</span>
<span className="text-success font-bold">всё готово</span>
) : (
<span className="text-accent font-mono-num font-semibold">
<span className="text-accent font-mono-num font-bold">
{remainingReps} осталось
</span>
)}
@@ -269,9 +269,9 @@ function MatchSummaryView({
</div>
<div className="px-4 pb-4 pt-3 flex items-center gap-3">
<div className="flex-1 text-[12px] text-text/55">
<div className="flex-1 text-[13px] text-text/65 font-medium">
Всего ·{' '}
<span className="text-text font-mono-num font-semibold text-[14px]">
<span className="text-text font-mono-num font-bold text-[16px]">
{totalReps}
</span>{' '}
повторов
@@ -326,14 +326,14 @@ function ChallengeRow({
<div className="flex-1 min-w-0">
<div
className={[
'text-[14px] font-medium truncate',
'text-[15px] font-semibold truncate',
done ? 'line-through opacity-55' : ''
].join(' ')}
>
{result.exerciseName}
</div>
<div className="text-[12px] text-text/55 mt-0.5">
<span className="font-mono-num font-semibold text-text/75">
<div className="text-[13px] text-text/65 mt-0.5 font-medium">
<span className="font-mono-num font-bold text-text">
{result.statValue}
</span>{' '}
{result.statLabel} <span>{result.name}</span>

View File

@@ -97,7 +97,7 @@ export function ExerciseCard({
<div className="flex-1 min-w-0">
<div className="flex items-center justify-between gap-2">
<h3 className="font-display text-[17px] font-semibold leading-tight truncate">
<h3 className="font-display text-[18px] font-bold leading-tight truncate">
{exercise.name}
</h3>
<div className="relative">
@@ -138,19 +138,19 @@ export function ExerciseCard({
)}
</div>
</div>
<div className="text-[13px] text-text/55 mt-0.5">
<div className="text-[14px] text-text/65 mt-1 font-medium">
{exercise.reps} раз · каждые {formatInterval(exercise.intervalMinutes)}
</div>
{/* Countdown + switch */}
<div className="flex items-end justify-between mt-3.5">
<div>
<div className="text-[11px] text-text/45 uppercase tracking-wider font-medium">
<div className="text-[12px] text-text/60 uppercase tracking-wider font-semibold">
{isDue ? 'Сейчас' : 'Через'}
</div>
<div
className={[
'font-mono-num text-[22px] font-semibold leading-none mt-0.5 tracking-tight',
'font-mono-num text-[24px] font-bold leading-none mt-1 tracking-tight',
isDue ? 'text-accent' : 'text-text'
].join(' ')}
>
@@ -172,7 +172,7 @@ export function ExerciseCard({
initial={{ opacity: 0, y: 4 }}
animate={{ opacity: 1, y: 0 }}
onClick={onMarkDone}
className="mt-4 w-full h-10 rounded-xl bg-accent text-white text-[14px] font-semibold inline-flex items-center justify-center gap-1.5 active:scale-[0.98] transition-transform"
className="mt-4 w-full h-11 rounded-xl bg-accent text-white text-[15px] font-bold inline-flex items-center justify-center gap-1.5 active:scale-[0.98] transition-transform"
>
<Check size={15} strokeWidth={2.5} /> Готово
</motion.button>

View File

@@ -126,19 +126,19 @@ function Body({
return (
<div className="px-4 py-4">
<div className="flex items-center gap-3 mb-3">
<div className="w-9 h-9 rounded-xl bg-accent/12 text-accent grid place-items-center">
<Download size={16} strokeWidth={2.4} />
<div className="w-10 h-10 rounded-xl bg-accent/12 text-accent grid place-items-center">
<Download size={17} strokeWidth={2.4} />
</div>
<div className="flex-1 min-w-0">
<div className="text-[15px] font-medium leading-tight">
<div className="text-[15px] font-semibold leading-tight">
Загружаем обновление
</div>
<div className="text-[12px] text-text/55 mt-0.5 font-mono-num">
<div className="text-[13px] text-text/65 mt-1 font-mono-num font-medium">
{mb(status.transferred)} / {mb(status.total)} МБ ·{' '}
{(status.bytesPerSecond / 1024 / 1024).toFixed(2)} МБ/с
</div>
</div>
<div className="font-mono-num font-semibold text-[17px] text-accent">
<div className="font-mono-num font-bold text-[18px] text-accent">
{pct.toFixed(0)}%
</div>
</div>
@@ -218,19 +218,19 @@ function Cell({
muted: 'bg-surface-2 text-text/55'
}[tone]
return (
<div className="flex items-center gap-3 px-4 py-3.5">
<div className="flex items-center gap-3 px-4 py-4">
<div
className={[
'w-9 h-9 rounded-xl grid place-items-center shrink-0',
'w-10 h-10 rounded-xl grid place-items-center shrink-0',
cls
].join(' ')}
>
{icon}
</div>
<div className="flex-1 min-w-0">
<div className="text-[15px] font-medium leading-tight">{title}</div>
<div className="text-[15px] font-semibold leading-tight">{title}</div>
{subtitle && (
<div className="text-[12px] text-text/55 mt-0.5 truncate">
<div className="text-[13px] text-text/65 mt-1 truncate font-medium">
{subtitle}
</div>
)}

View File

@@ -39,12 +39,16 @@ export function SectionHeader({
action?: ReactNode
}): JSX.Element {
return (
<div className="flex items-end justify-between px-4 mb-2">
<div className="flex items-end justify-between px-4 mb-2.5">
<div>
<div className="text-[12px] font-medium uppercase tracking-[0.06em] text-text/45">
<div className="text-[13px] font-semibold uppercase tracking-[0.06em] text-text/60">
{title}
</div>
{hint && <div className="text-[12px] text-text/45 mt-0.5">{hint}</div>}
{hint && (
<div className="text-[13px] text-text/55 mt-0.5 font-medium">
{hint}
</div>
)}
</div>
{action}
</div>

View File

@@ -48,14 +48,14 @@ export default function ChallengesPage(): JSX.Element {
<div className="max-w-3xl mx-auto px-4 sm:px-6 lg:px-10 pt-8 pb-12">
<div className="flex flex-col sm:flex-row sm:items-end sm:justify-between gap-4 mb-8">
<div>
<div className="text-[13px] text-text/45 font-medium">
<div className="text-[14px] text-text/65 font-semibold">
Правила за матч
</div>
<h1 className="font-serif text-[32px] sm:text-[36px] leading-[1.05] tracking-tight mt-1 font-medium">
Челленджи
</h1>
<p className="text-[14px] text-text/55 mt-2">
Повторов = <span className="font-mono-num">статистика × коэффициент</span>
<p className="text-[15px] text-text/65 mt-2 font-medium">
Повторов = <span className="font-mono-num font-semibold text-text">статистика × коэффициент</span>
</p>
</div>
<Button
@@ -70,12 +70,12 @@ export default function ChallengesPage(): JSX.Element {
{noGamesActive && (
<div className="mb-6 rounded-2xl bg-warning/12 p-4 flex items-start gap-3">
<div className="w-9 h-9 rounded-xl bg-warning/15 text-warning grid place-items-center shrink-0">
<AlertTriangle size={16} strokeWidth={2.5} />
<div className="w-10 h-10 rounded-xl bg-warning/18 text-warning grid place-items-center shrink-0">
<AlertTriangle size={18} strokeWidth={2.5} />
</div>
<div className="text-[13px] text-text/80 leading-relaxed">
<div className="text-[14px] text-text/85 leading-relaxed font-medium">
Челленджи срабатывают после матча. Подключи игру во вкладке{' '}
<span className="font-semibold">«Игры»</span>.
<span className="font-semibold text-text">«Игры»</span>.
</div>
</div>
)}
@@ -104,13 +104,13 @@ export default function ChallengesPage(): JSX.Element {
<Icon name={c.icon} size={18} strokeWidth={2.2} />
</div>
<div className="flex-1 min-w-0">
<div className="text-[15px] font-medium truncate leading-tight">
<div className="text-[16px] font-semibold truncate leading-tight">
{c.name}
</div>
<div className="text-[13px] text-text/55 mt-0.5 inline-flex items-center gap-1.5">
<Gamepad2 size={11} />
<div className="text-[14px] text-text/65 mt-1 inline-flex items-center gap-1.5 font-medium">
<Gamepad2 size={12} strokeWidth={2.4} />
{GAME_NAMES[c.gameId]} ·{' '}
<span className="font-mono-num">
<span className="font-mono-num font-semibold text-text">
{STAT_LABELS[c.stat]} × {c.multiplier}
</span>{' '}
{c.exerciseName}

View File

@@ -69,7 +69,7 @@ export default function Dashboard(): JSX.Element {
{/* Hero — iOS Large Title */}
<div className="flex flex-col sm:flex-row sm:items-end sm:justify-between gap-4 mb-8">
<div className="min-w-0">
<div className="text-[13px] text-text/45 font-medium capitalize">
<div className="text-[14px] text-text/65 font-semibold capitalize">
{today}
</div>
<h1 className="font-serif text-[32px] sm:text-[36px] leading-[1.05] tracking-tight mt-1 font-medium">
@@ -139,19 +139,19 @@ export default function Dashboard(): JSX.Element {
animate={{ opacity: 1, y: 0 }}
className="mb-6 rounded-2xl bg-warning/12 p-4 flex items-center gap-3"
>
<div className="w-9 h-9 rounded-xl bg-warning/15 text-warning grid place-items-center">
<Pause size={16} strokeWidth={2.5} />
<div className="w-10 h-10 rounded-xl bg-warning/18 text-warning grid place-items-center shrink-0">
<Pause size={18} strokeWidth={2.5} />
</div>
<div className="flex-1 min-w-0">
<div className="text-[14px] font-semibold">
<div className="text-[16px] font-semibold leading-tight">
Напоминания на паузе
</div>
<div className="text-[12px] text-text/55 mt-0.5">
<div className="text-[14px] text-text/70 mt-1">
Возобнови, чтобы продолжить отсчёт
</div>
</div>
<Button variant="filled" size="sm" onClick={togglePause}>
<Play size={13} strokeWidth={2.5} /> Старт
<Play size={14} strokeWidth={2.5} /> Старт
</Button>
</motion.div>
)}
@@ -225,19 +225,21 @@ function HeroStat({
<div className="flex items-center gap-2 mb-3">
<div
className={[
'w-6 h-6 rounded-md grid place-items-center text-white',
'w-7 h-7 rounded-lg grid place-items-center text-white',
toneBg
].join(' ')}
>
{icon}
</div>
<div className="text-[12px] text-text/55 font-medium">{label}</div>
<div className="text-[14px] text-text/75 font-semibold">{label}</div>
</div>
<div className="font-display text-[26px] font-semibold tracking-tight leading-none">
<div className="font-display text-[28px] font-bold tracking-tight leading-none">
{value}
</div>
{subvalue && (
<div className="text-[12px] text-text/45 mt-1.5">{subvalue}</div>
<div className="text-[13px] text-text/60 mt-2 font-medium">
{subvalue}
</div>
)}
</div>
)

View File

@@ -22,7 +22,7 @@ export default function Exercises(): JSX.Element {
<div className="max-w-3xl mx-auto px-4 sm:px-6 lg:px-10 pt-8 pb-12">
<div className="flex flex-col sm:flex-row sm:items-end sm:justify-between gap-4 mb-8">
<div>
<div className="text-[13px] text-text/45 font-medium">
<div className="text-[14px] text-text/65 font-semibold">
Программа
</div>
<h1 className="font-serif text-[32px] sm:text-[36px] leading-[1.05] tracking-tight mt-1 font-medium">
@@ -79,7 +79,7 @@ export default function Exercises(): JSX.Element {
{exercises.length === 0 && (
<Card>
<div className="px-5 py-12 text-center text-text/55 text-[14px]">
<div className="px-5 py-12 text-center text-text/65 text-[15px] font-medium">
Программа пуста добавь первое упражнение
</div>
</Card>
@@ -126,10 +126,10 @@ function ExerciseRow({
onClick={onEdit}
className="flex-1 min-w-0 text-left active:opacity-70 transition-opacity"
>
<div className="text-[15px] font-medium truncate leading-tight">
<div className="text-[16px] font-semibold truncate leading-tight">
{exercise.name}
</div>
<div className="text-[13px] text-text/55 mt-0.5">
<div className="text-[14px] text-text/65 mt-1 font-medium">
{exercise.reps} раз · {formatInterval(exercise.intervalMinutes)}
</div>
</button>

View File

@@ -61,18 +61,18 @@ export default function GamesPage(): JSX.Element {
<div className="max-w-3xl mx-auto px-4 sm:px-6 lg:px-10 pt-8 pb-12">
<div className="flex flex-col sm:flex-row sm:items-end sm:justify-between gap-4 mb-8">
<div>
<div className="text-[13px] text-text/45 font-medium">
<div className="text-[14px] text-text/65 font-semibold">
Трекинг матчей
</div>
<h1 className="font-serif text-[32px] sm:text-[36px] leading-[1.05] tracking-tight mt-1 font-medium">
Игры
</h1>
<p className="text-[14px] text-text/55 mt-2">
<p className="text-[15px] text-text/65 mt-2 font-medium leading-relaxed">
Подключи игру челленджи сработают сразу после матча
{liveCount > 0 && (
<>
{' · '}
<span className="text-success font-mono-num font-semibold">
<span className="text-success font-mono-num font-bold">
{liveCount} live
</span>
</>
@@ -154,13 +154,13 @@ function GameCard({
</div>
<div className="flex-1 min-w-0">
<div className="flex items-center gap-2 flex-wrap">
<h3 className="font-display text-[17px] font-semibold tracking-tight">
<h3 className="font-display text-[18px] font-bold tracking-tight">
{game.name}
</h3>
<StatusBadge game={game} isLive={isLive} />
</div>
{game.installPath && (
<div className="text-[12px] text-text/45 mt-1 truncate font-mono-num">
<div className="text-[13px] text-text/55 mt-1.5 truncate font-mono-num font-medium">
{game.installPath}
</div>
)}
@@ -176,15 +176,15 @@ function GameCard({
</div>
{game.integrationActive && game.launchOptionStatus === 'queued' && (
<div className="mt-4 rounded-2xl bg-warning/12 p-3.5 text-[13px] leading-relaxed flex items-start gap-2.5">
<div className="mt-4 rounded-2xl bg-warning/12 p-4 text-[14px] leading-relaxed flex items-start gap-2.5 font-medium">
<Hourglass
size={15}
size={17}
className="text-warning shrink-0 mt-0.5"
strokeWidth={2.4}
/>
<div className="text-text/80">
<div className="text-text/85">
Steam запущен. Параметр{' '}
<code className="px-1.5 py-0.5 rounded-md bg-surface text-accent font-mono-num text-[12px]">
<code className="px-1.5 py-0.5 rounded-md bg-surface text-accent font-mono-num text-[13px] font-semibold">
{game.launchOption}
</code>{' '}
пропишется автоматически при следующем закрытии Steam.
@@ -193,15 +193,15 @@ function GameCard({
)}
{game.integrationActive && game.launchOptionStatus === 'no_user' && (
<div className="mt-4 rounded-2xl bg-destructive/10 p-3.5 text-[13px] leading-relaxed flex items-start gap-2.5">
<div className="mt-4 rounded-2xl bg-destructive/10 p-4 text-[14px] leading-relaxed flex items-start gap-2.5 font-medium">
<AlertTriangle
size={15}
size={17}
className="text-destructive shrink-0 mt-0.5"
strokeWidth={2.4}
/>
<div className="text-text/80">
<div className="text-text/85">
В Steam нет залогиненного аккаунта (нет папки{' '}
<code className="font-mono-num text-[12px]">userdata</code>).
<code className="font-mono-num text-[13px] font-semibold">userdata</code>).
Запусти Steam один раз и нажми «Установить интеграцию».
</div>
</div>
@@ -224,7 +224,7 @@ function GameCard({
</Button>
)}
{!game.installed && (
<div className="text-[13px] text-text/55">
<div className="text-[14px] text-text/65 font-medium">
Установи игру в Steam и нажми «Обновить»
</div>
)}

View File

@@ -21,7 +21,7 @@ export default function SettingsPage(): JSX.Element {
<div className="h-full overflow-y-auto">
<div className="max-w-2xl mx-auto px-4 sm:px-6 lg:px-10 pt-8 pb-12">
<div className="mb-8">
<div className="text-[13px] text-text/45 font-medium">
<div className="text-[14px] text-text/65 font-semibold">
Конфигурация
</div>
<h1 className="font-serif text-[32px] sm:text-[36px] leading-[1.05] tracking-tight mt-1 font-medium">
@@ -132,9 +132,11 @@ function ToggleRow({
return (
<Row last={last} className={disabled ? 'opacity-50' : ''}>
<div className="flex-1 min-w-0">
<div className="text-[15px] font-medium leading-tight">{label}</div>
<div className="text-[15px] font-semibold leading-tight">{label}</div>
{hint && (
<div className="text-[12px] text-text/55 mt-0.5">{hint}</div>
<div className="text-[13px] text-text/65 mt-1 leading-snug">
{hint}
</div>
)}
</div>
<Switch checked={checked} onChange={onChange} disabled={disabled} />
@@ -160,9 +162,11 @@ function SelectRow({
return (
<Row last={last}>
<div className="flex-1 min-w-0">
<div className="text-[15px] font-medium leading-tight">{label}</div>
<div className="text-[15px] font-semibold leading-tight">{label}</div>
{hint && (
<div className="text-[12px] text-text/55 mt-0.5">{hint}</div>
<div className="text-[13px] text-text/65 mt-1 leading-snug">
{hint}
</div>
)}
</div>
<select