refactor(frontend): move repeated Tailwind chains into BEM classes

This commit is contained in:
Vaka.pro
2026-04-27 20:42:21 +03:00
parent 17d59c3639
commit d46d4c4487
14 changed files with 273 additions and 101 deletions

View File

@@ -26,10 +26,10 @@ export function DashboardPage() {
return (
<div className="grid gap-6">
<section className="flex flex-wrap items-end justify-between gap-4">
<section className="page-section flex flex-wrap items-end justify-between gap-4">
<div>
<h1 className="font-display text-3xl">{t('dashboard.title')}</h1>
<p className="text-sm text-muted">
<h1 className="page-section__title">{t('dashboard.title')}</h1>
<p className="page-section__text">
{t('dashboard.description')}
{user && (
<Link
@@ -61,11 +61,11 @@ export function DashboardPage() {
)}
{!isLoading && data && data.length === 0 && (
<div className="flex flex-col items-center gap-4 rounded-xl border border-border bg-surface/80 p-10 text-center shadow-card">
<img src="/empty-state.svg" alt="" className="h-40 w-40 opacity-90" />
<div className="empty-state gap-4">
<img src="/empty-state.svg" alt="" className="empty-state__icon--image" />
<div>
<h2 className="text-xl font-semibold">{t('dashboard.emptyTitle')}</h2>
<p className="mt-1 text-sm text-muted">
<h2 className="empty-state__title">{t('dashboard.emptyTitle')}</h2>
<p className="empty-state__text mt-1">
{t('dashboard.emptyText')}
</p>
</div>