From 098d42135fde24215612fc0718b96d680aa1bf81 Mon Sep 17 00:00:00 2001
From: AlexMadM <alex.alexandrov.1988@gmail.com>
Date: Thu, 5 Mar 2026 13:01:57 -0800
Subject: [PATCH 1/6] =?UTF-8?q?refactor(ui):=20=D0=BE=D0=B1=D0=BD=D0=BE?=
 =?UTF-8?q?=D0=B2=D0=B8=D0=BB=20globals.css=20root=20=D1=81=D1=82=D0=B8?=
 =?UTF-8?q?=D0=BB=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/ui/src/globals.css | 133 ++++++++++++++++++++++--------------
 1 file changed, 81 insertions(+), 52 deletions(-)

diff --git a/packages/ui/src/globals.css b/packages/ui/src/globals.css
index 56492bad..91a2eb63 100644
--- a/packages/ui/src/globals.css
+++ b/packages/ui/src/globals.css
@@ -46,9 +46,15 @@ body {
 	--color-accent: var(--accent);
 	--color-accent-foreground: var(--accent-foreground);
 	--color-destructive: var(--destructive);
+	--color-destructive-foreground: var(--destructive-foreground);
 	--color-border: var(--border);
 	--color-input: var(--input);
 	--color-ring: var(--ring);
+	--color-success: var(--success);
+	--color-warning: var(--warning);
+	--color-info: var(--info);
+	--color-surface-1: var(--surface-1);
+	--color-surface-2: var(--surface-2);
 	--color-chart-1: var(--chart-1);
 	--color-chart-2: var(--chart-2);
 	--color-chart-3: var(--chart-3);
@@ -66,71 +72,94 @@ body {
 
 :root {
 	--radius: 0.625rem;
-	--background: oklch(1 0 0);
-	--foreground: oklch(0.145 0 0);
-	--card: oklch(1 0 0);
-	--card-foreground: oklch(0.145 0 0);
-	--popover: oklch(1 0 0);
-	--popover-foreground: oklch(0.145 0 0);
-	--primary: oklch(0.205 0 0);
-	--primary-foreground: oklch(0.985 0 0);
-	--secondary: oklch(0.97 0 0);
-	--secondary-foreground: oklch(0.205 0 0);
-	--muted: oklch(0.97 0 0);
-	--muted-foreground: oklch(0.556 0 0);
-	--accent: oklch(0.97 0 0);
-	--accent-foreground: oklch(0.205 0 0);
-	--destructive: oklch(0.577 0.245 27.325);
-	--border: oklch(0.922 0 0);
-	--input: oklch(0.922 0 0);
-	--ring: oklch(0.708 0 0);
+	--background: oklch(0.181 0.03 259.605);
+	--foreground: oklch(0.984 0.002 247.839);
+	--card: oklch(0.226 0.022 263.975);
+	--card-foreground: oklch(0.984 0.002 247.839);
+	--popover: oklch(0.279 0.03 256.848);
+	--popover-foreground: oklch(0.984 0.002 247.839);
+	--primary: oklch(0.626 0.186 259.596);
+	--primary-foreground: oklch(0.984 0.002 247.839);
+	--secondary: oklch(0.226 0.022 263.975);
+	--secondary-foreground: oklch(0.984 0.002 247.839);
+	--muted: oklch(0.279 0.03 256.848);
+	--muted-foreground: oklch(0.714 0.02 261.483);
+	--accent: oklch(0.602 0.221 292.234);
+	--accent-foreground: oklch(0.984 0.002 247.839);
+	--destructive: oklch(0.636 0.208 25.378);
+	--destructive-foreground: oklch(0.984 0.002 247.839);
+	--border: oklch(0.331 0.027 256.825);
+	--input: oklch(0.331 0.027 256.825);
+	--ring: oklch(0.626 0.186 259.596);
+	--success: oklch(0.72 0.192 149.493);
+	--warning: oklch(0.77 0.165 70.606);
+	--info: oklch(0.715 0.126 215.825);
+	--surface-1: oklch(0.226 0.022 263.975);
+	--surface-2: oklch(0.279 0.03 256.848);
 	--chart-1: oklch(0.646 0.222 41.116);
 	--chart-2: oklch(0.6 0.118 184.704);
 	--chart-3: oklch(0.398 0.07 227.392);
 	--chart-4: oklch(0.828 0.189 84.429);
 	--chart-5: oklch(0.769 0.188 70.08);
-	--sidebar: oklch(0.985 0 0);
-	--sidebar-foreground: oklch(0.145 0 0);
-	--sidebar-primary: oklch(0.205 0 0);
-	--sidebar-primary-foreground: oklch(0.985 0 0);
-	--sidebar-accent: oklch(0.97 0 0);
-	--sidebar-accent-foreground: oklch(0.205 0 0);
-	--sidebar-border: oklch(0.922 0 0);
-	--sidebar-ring: oklch(0.708 0 0);
+	--sidebar-background: oklch(0.226 0.022 263.975);
+	--sidebar: oklch(0.226 0.022 263.975);
+	--sidebar-foreground: oklch(0.984 0.002 247.839);
+	--sidebar-primary: oklch(0.626 0.186 259.596);
+	--sidebar-primary-foreground: oklch(0.984 0.002 247.839);
+	--sidebar-accent: oklch(0.279 0.03 256.848);
+	--sidebar-accent-foreground: oklch(0.984 0.002 247.839);
+	--sidebar-border: oklch(0.331 0.027 256.825);
+	--sidebar-ring: oklch(0.626 0.186 259.596);
+	--shadow-1:
+		0 1px 3px 0 hsl(0 0% 0% / 0.3),
+		0 1px 2px -1px hsl(0 0% 0% / 0.3);
+	--shadow-2:
+		0 4px 6px -1px hsl(0 0% 0% / 0.4),
+		0 2px 4px -2px hsl(0 0% 0% / 0.3);
+	--shadow-3:
+		0 10px 15px -3px hsl(0 0% 0% / 0.5),
+		0 4px 6px -4px hsl(0 0% 0% / 0.4);
 }
 
 .dark {
-	--background: oklch(0.145 0 0);
-	--foreground: oklch(0.985 0 0);
-	--card: oklch(0.205 0 0);
-	--card-foreground: oklch(0.985 0 0);
-	--popover: oklch(0.205 0 0);
-	--popover-foreground: oklch(0.985 0 0);
-	--primary: oklch(0.922 0 0);
-	--primary-foreground: oklch(0.205 0 0);
-	--secondary: oklch(0.269 0 0);
-	--secondary-foreground: oklch(0.985 0 0);
-	--muted: oklch(0.269 0 0);
-	--muted-foreground: oklch(0.708 0 0);
-	--accent: oklch(0.269 0 0);
-	--accent-foreground: oklch(0.985 0 0);
-	--destructive: oklch(0.704 0.191 22.216);
-	--border: oklch(1 0 0 / 10%);
-	--input: oklch(1 0 0 / 15%);
-	--ring: oklch(0.556 0 0);
+	--background: oklch(0.181 0.03 259.605);
+	--foreground: oklch(0.984 0.002 247.839);
+	--card: oklch(0.226 0.022 263.975);
+	--card-foreground: oklch(0.984 0.002 247.839);
+	--popover: oklch(0.279 0.03 256.848);
+	--popover-foreground: oklch(0.984 0.002 247.839);
+	--primary: oklch(0.626 0.186 259.596);
+	--primary-foreground: oklch(0.984 0.002 247.839);
+	--secondary: oklch(0.226 0.022 263.975);
+	--secondary-foreground: oklch(0.984 0.002 247.839);
+	--muted: oklch(0.279 0.03 256.848);
+	--muted-foreground: oklch(0.714 0.02 261.483);
+	--accent: oklch(0.602 0.221 292.234);
+	--accent-foreground: oklch(0.984 0.002 247.839);
+	--destructive: oklch(0.636 0.208 25.378);
+	--destructive-foreground: oklch(0.984 0.002 247.839);
+	--border: oklch(0.331 0.027 256.825);
+	--input: oklch(0.331 0.027 256.825);
+	--ring: oklch(0.626 0.186 259.596);
+	--success: oklch(0.72 0.192 149.493);
+	--warning: oklch(0.77 0.165 70.606);
+	--info: oklch(0.715 0.126 215.825);
+	--surface-1: oklch(0.226 0.022 263.975);
+	--surface-2: oklch(0.279 0.03 256.848);
 	--chart-1: oklch(0.488 0.243 264.376);
 	--chart-2: oklch(0.696 0.17 162.48);
 	--chart-3: oklch(0.769 0.188 70.08);
 	--chart-4: oklch(0.627 0.265 303.9);
 	--chart-5: oklch(0.645 0.246 16.439);
-	--sidebar: oklch(0.205 0 0);
-	--sidebar-foreground: oklch(0.985 0 0);
-	--sidebar-primary: oklch(0.488 0.243 264.376);
-	--sidebar-primary-foreground: oklch(0.985 0 0);
-	--sidebar-accent: oklch(0.269 0 0);
-	--sidebar-accent-foreground: oklch(0.985 0 0);
-	--sidebar-border: oklch(1 0 0 / 10%);
-	--sidebar-ring: oklch(0.556 0 0);
+	--sidebar-background: oklch(0.226 0.022 263.975);
+	--sidebar: oklch(0.226 0.022 263.975);
+	--sidebar-foreground: oklch(0.984 0.002 247.839);
+	--sidebar-primary: oklch(0.626 0.186 259.596);
+	--sidebar-primary-foreground: oklch(0.984 0.002 247.839);
+	--sidebar-accent: oklch(0.279 0.03 256.848);
+	--sidebar-accent-foreground: oklch(0.984 0.002 247.839);
+	--sidebar-border: oklch(0.331 0.027 256.825);
+	--sidebar-ring: oklch(0.626 0.186 259.596);
 }
 
 @layer base {

From 8b3a4231b30b47266ec1dd2824627223833e2b82 Mon Sep 17 00:00:00 2001
From: AlexMadM <alex.alexandrov.1988@gmail.com>
Date: Thu, 5 Mar 2026 13:16:22 -0800
Subject: [PATCH 2/6] =?UTF-8?q?refactor(web):=20=D0=BF=D0=B5=D1=80=D0=B5?=
 =?UTF-8?q?=D0=B2=D0=B5=D0=BB=20dashboard-=D1=81=D1=82=D1=80=D0=B0=D0=BD?=
 =?UTF-8?q?=D0=B8=D1=86=D1=8B=20=D0=BD=D0=B0=20=D0=B3=D0=BB=D0=BE=D0=B1?=
 =?UTF-8?q?=D0=B0=D0=BB=D1=8C=D0=BD=D1=8B=D0=B5=20=D1=81=D1=82=D0=B8=D0=BB?=
 =?UTF-8?q?=D0=B8=20=D0=B8=D0=B7=20globals.css?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/app/(dashboard)/projects/page.tsx | 60 +++++++++-------------
 apps/web/app/(dashboard)/sprints/page.tsx  | 28 +++++-----
 apps/web/app/(dashboard)/tasks/page.tsx    | 34 ++++++------
 3 files changed, 55 insertions(+), 67 deletions(-)

diff --git a/apps/web/app/(dashboard)/projects/page.tsx b/apps/web/app/(dashboard)/projects/page.tsx
index d9c9f59c..f37292ae 100644
--- a/apps/web/app/(dashboard)/projects/page.tsx
+++ b/apps/web/app/(dashboard)/projects/page.tsx
@@ -40,15 +40,15 @@ export default function ProjectsPage() {
 	}
 
 	return (
-		<div className='bg-slate-950 text-slate-100 w-full h-full'>
+		<div className='bg-background text-foreground w-full h-full'>
 			<div className='mx-auto flex w-full max-w-[1600px] flex-col gap-10 px-6 py-8 md:px-10 md:py-10'>
 				<header className='flex flex-col gap-6 md:flex-row md:items-start md:justify-between'>
 					<div className='space-y-2'>
 						<h1 className='text-4xl font-semibold tracking-tight md:text-5xl'>Проекты</h1>
-						<p className='text-xl text-slate-400'>Product Team</p>
+						<p className='text-xl text-muted-foreground'>Product Team</p>
 					</div>
 
-					<Button className='h-16 rounded-2xl bg-blue-500 px-8 text-2xl font-medium hover:bg-blue-400 md:text-4xl'>
+					<Button className='h-16 rounded-2xl bg-primary px-8 text-2xl font-medium text-primary-foreground hover:bg-primary/90 md:text-4xl'>
 						Создать проект
 					</Button>
 				</header>
@@ -56,30 +56,27 @@ export default function ProjectsPage() {
 				<input
 					type='text'
 					placeholder='Поиск проектов...'
-					className='h-16 w-full max-w-[700px] rounded-2xl border border-slate-700 bg-slate-950 px-6 text-2xl text-slate-100 placeholder:text-slate-500 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500'
+					className='h-16 w-full max-w-[700px] rounded-2xl border border-border bg-background px-6 text-2xl text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring'
 				/>
 
 				<section className='grid grid-cols-1 gap-6 xl:grid-cols-3'>
 					{projectCards.map((project) => (
-						<Card
-							key={project.code}
-							className='rounded-3xl border-slate-700 bg-slate-900 py-0'
-						>
+						<Card key={project.code} className='rounded-3xl border-border bg-card py-0'>
 							<CardHeader className='gap-6 px-8 pt-8'>
-								<div className='flex h-16 w-16 items-center justify-center rounded-2xl bg-slate-800 text-4xl font-semibold text-blue-400'>
+								<div className='flex h-16 w-16 items-center justify-center rounded-2xl bg-muted text-4xl font-semibold text-primary'>
 									{project.code}
 								</div>
 								<div className='space-y-3'>
-									<CardTitle className='text-4xl font-semibold text-slate-100'>
+									<CardTitle className='text-4xl font-semibold text-card-foreground'>
 										{project.name}
 									</CardTitle>
-									<CardDescription className='text-2xl text-slate-400'>
+									<CardDescription className='text-2xl text-muted-foreground'>
 										{project.description}
 									</CardDescription>
 								</div>
 							</CardHeader>
 							<CardContent className='px-8 pb-8'>
-								<p className='text-xl text-slate-400'>
+								<p className='text-xl text-muted-foreground'>
 									{project.boards} · {project.tasks}
 								</p>
 							</CardContent>
@@ -89,25 +86,22 @@ export default function ProjectsPage() {
 
 				<section className='grid grid-cols-1 gap-6 xl:grid-cols-3'>
 					{projectCards.map((project) => (
-						<Card
-							key={project.code}
-							className='rounded-3xl border-slate-700 bg-slate-900 py-0'
-						>
+						<Card key={project.code} className='rounded-3xl border-border bg-card py-0'>
 							<CardHeader className='gap-6 px-8 pt-8'>
-								<div className='flex h-16 w-16 items-center justify-center rounded-2xl bg-slate-800 text-4xl font-semibold text-blue-400'>
+								<div className='flex h-16 w-16 items-center justify-center rounded-2xl bg-muted text-4xl font-semibold text-primary'>
 									{project.code}
 								</div>
 								<div className='space-y-3'>
-									<CardTitle className='text-4xl font-semibold text-slate-100'>
+									<CardTitle className='text-4xl font-semibold text-card-foreground'>
 										{project.name}
 									</CardTitle>
-									<CardDescription className='text-2xl text-slate-400'>
+									<CardDescription className='text-2xl text-muted-foreground'>
 										{project.description}
 									</CardDescription>
 								</div>
 							</CardHeader>
 							<CardContent className='px-8 pb-8'>
-								<p className='text-xl text-slate-400'>
+								<p className='text-xl text-muted-foreground'>
 									{project.boards} · {project.tasks}
 								</p>
 							</CardContent>
@@ -116,25 +110,22 @@ export default function ProjectsPage() {
 				</section>
 				<section className='grid grid-cols-1 gap-6 xl:grid-cols-3'>
 					{projectCards.map((project) => (
-						<Card
-							key={project.code}
-							className='rounded-3xl border-slate-700 bg-slate-900 py-0'
-						>
+						<Card key={project.code} className='rounded-3xl border-border bg-card py-0'>
 							<CardHeader className='gap-6 px-8 pt-8'>
-								<div className='flex h-16 w-16 items-center justify-center rounded-2xl bg-slate-800 text-4xl font-semibold text-blue-400'>
+								<div className='flex h-16 w-16 items-center justify-center rounded-2xl bg-muted text-4xl font-semibold text-primary'>
 									{project.code}
 								</div>
 								<div className='space-y-3'>
-									<CardTitle className='text-4xl font-semibold text-slate-100'>
+									<CardTitle className='text-4xl font-semibold text-card-foreground'>
 										{project.name}
 									</CardTitle>
-									<CardDescription className='text-2xl text-slate-400'>
+									<CardDescription className='text-2xl text-muted-foreground'>
 										{project.description}
 									</CardDescription>
 								</div>
 							</CardHeader>
 							<CardContent className='px-8 pb-8'>
-								<p className='text-xl text-slate-400'>
+								<p className='text-xl text-muted-foreground'>
 									{project.boards} · {project.tasks}
 								</p>
 							</CardContent>
@@ -144,25 +135,22 @@ export default function ProjectsPage() {
 
 				<section className='grid grid-cols-1 gap-6 xl:grid-cols-3'>
 					{projectCards.map((project) => (
-						<Card
-							key={project.code}
-							className='rounded-3xl border-slate-700 bg-slate-900 py-0'
-						>
+						<Card key={project.code} className='rounded-3xl border-border bg-card py-0'>
 							<CardHeader className='gap-6 px-8 pt-8'>
-								<div className='flex h-16 w-16 items-center justify-center rounded-2xl bg-slate-800 text-4xl font-semibold text-blue-400'>
+								<div className='flex h-16 w-16 items-center justify-center rounded-2xl bg-muted text-4xl font-semibold text-primary'>
 									{project.code}
 								</div>
 								<div className='space-y-3'>
-									<CardTitle className='text-4xl font-semibold text-slate-100'>
+									<CardTitle className='text-4xl font-semibold text-card-foreground'>
 										{project.name}
 									</CardTitle>
-									<CardDescription className='text-2xl text-slate-400'>
+									<CardDescription className='text-2xl text-muted-foreground'>
 										{project.description}
 									</CardDescription>
 								</div>
 							</CardHeader>
 							<CardContent className='px-8 pb-8'>
-								<p className='text-xl text-slate-400'>
+								<p className='text-xl text-muted-foreground'>
 									{project.boards} · {project.tasks}
 								</p>
 							</CardContent>
diff --git a/apps/web/app/(dashboard)/sprints/page.tsx b/apps/web/app/(dashboard)/sprints/page.tsx
index d70949a0..1df24a15 100644
--- a/apps/web/app/(dashboard)/sprints/page.tsx
+++ b/apps/web/app/(dashboard)/sprints/page.tsx
@@ -79,19 +79,19 @@ export default function SprintsPage() {
 	}
 
 	return (
-		<div className='bg-slate-950 text-slate-100 w-full h-full'>
+		<div className='bg-background text-foreground w-full h-full'>
 			<div className='mx-auto flex w-full max-w-[1700px] flex-col gap-4 px-3 py-4 md:px-5'>
-				<header className='rounded-lg border border-slate-800 bg-slate-900 px-3 py-2.5'>
+				<header className='rounded-lg border border-border bg-card px-3 py-2.5'>
 					<div className='flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between'>
 						<div>
 							<h1 className='text-2xl font-semibold tracking-tight'>Sprint Board</h1>
-							<p className='text-sm text-slate-100'>Tracker Task</p>
+							<p className='text-sm text-foreground'>Tracker Task</p>
 						</div>
 						<div className='grid grid-cols-1 gap-2 sm:grid-cols-2'>
-							<select className='h-9 rounded-md border border-slate-700 bg-slate-950 px-2.5 text-sm text-slate-100'>
+							<select className='h-9 rounded-md border border-border bg-background px-2.5 text-sm text-foreground'>
 								<option>Все типы</option>
 							</select>
-							<select className='h-9 rounded-md border border-slate-700 bg-slate-950 px-2.5 text-sm text-slate-100'>
+							<select className='h-9 rounded-md border border-border bg-background px-2.5 text-sm text-foreground'>
 								<option>Все</option>
 							</select>
 						</div>
@@ -102,18 +102,18 @@ export default function SprintsPage() {
 					{sprintColumns.map((column) => (
 						<div
 							key={column.name}
-							className='rounded-lg border border-slate-800 bg-slate-950 p-2.5'
+							className='rounded-lg border border-border bg-background p-2.5'
 						>
 							<div className='mb-2.5 flex items-center justify-between'>
-								<h2 className='text-lg font-semibold text-slate-100'>
+								<h2 className='text-lg font-semibold text-foreground'>
 									{column.name}{' '}
-									<span className='rounded-md bg-slate-800 px-1.5 py-0.5 text-xs text-slate-100'>
+									<span className='rounded-md bg-muted px-1.5 py-0.5 text-xs text-foreground'>
 										{column.tasks.length}
 									</span>
 								</h2>
 								<button
 									type='button'
-									className='h-6 rounded-md border border-slate-700 px-2 text-xs text-slate-100'
+									className='h-6 rounded-md border border-border px-2 text-xs text-foreground'
 								>
 									Добавить
 								</button>
@@ -123,19 +123,19 @@ export default function SprintsPage() {
 								{column.tasks.map((task) => (
 									<Card
 										key={task.id}
-										className='gap-2 rounded-lg border-slate-800 bg-slate-900 py-0'
+										className='gap-2 rounded-lg border-border bg-card py-0'
 									>
-										<CardContent className='space-y-2.5 px-3 py-3 text-slate-100'>
+										<CardContent className='space-y-2.5 px-3 py-3 text-foreground'>
 											<div className='flex items-center gap-2'>
 												<span
 													className={`rounded-full px-2 py-0.5 text-xs font-medium ${typeClassName[task.type]}`}
 												>
 													{task.type}
 												</span>
-												<span className='text-xs text-slate-100'>{task.id}</span>
+												<span className='text-xs text-foreground'>{task.id}</span>
 											</div>
 
-											<p className='text-lg font-medium leading-snug text-slate-100'>
+											<p className='text-lg font-medium leading-snug text-foreground'>
 												{task.title}
 											</p>
 
@@ -143,7 +143,7 @@ export default function SprintsPage() {
 												{task.tags.map((tag) => (
 													<span
 														key={tag}
-														className='rounded-md bg-slate-800 px-1.5 py-0.5 text-xs text-slate-100'
+														className='rounded-md bg-muted px-1.5 py-0.5 text-xs text-foreground'
 													>
 														{tag}
 													</span>
diff --git a/apps/web/app/(dashboard)/tasks/page.tsx b/apps/web/app/(dashboard)/tasks/page.tsx
index 07a3b577..dffc2589 100644
--- a/apps/web/app/(dashboard)/tasks/page.tsx
+++ b/apps/web/app/(dashboard)/tasks/page.tsx
@@ -59,11 +59,11 @@ export default function TasksPage() {
 	}
 
 	return (
-		<div className='bg-slate-950 text-slate-100 w-full h-full'>
+		<div className='bg-background text-foreground w-full h-full'>
 			<div className='mx-auto flex w-full max-w-[2100px] flex-col gap-8 px-5 py-8 md:px-8'>
 				<header className='flex flex-col gap-4 md:flex-row md:items-center md:justify-between'>
 					<h1 className='text-3xl font-semibold tracking-tight'>Задачи</h1>
-					<Button className='h-10 rounded-lg bg-blue-500 px-5 text-base font-medium hover:bg-blue-400'>
+					<Button className='h-10 rounded-lg bg-primary px-5 text-base font-medium text-primary-foreground hover:bg-primary/90'>
 						Создать задачу
 					</Button>
 				</header>
@@ -72,25 +72,25 @@ export default function TasksPage() {
 					<input
 						type='text'
 						placeholder='Поиск по названию или ключу...'
-						className='h-10 rounded-lg border border-slate-700 bg-slate-950 px-3 text-base text-slate-100 placeholder:text-slate-500 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500'
+						className='h-10 rounded-lg border border-border bg-background px-3 text-base text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring'
 					/>
-					<select className='h-10 rounded-lg border border-slate-700 bg-slate-950 px-3 text-base text-slate-100'>
+					<select className='h-10 rounded-lg border border-border bg-background px-3 text-base text-foreground'>
 						<option>Все типы</option>
 					</select>
-					<select className='h-10 rounded-lg border border-slate-700 bg-slate-950 px-3 text-base text-slate-100'>
+					<select className='h-10 rounded-lg border border-border bg-background px-3 text-base text-foreground'>
 						<option>Все статусы</option>
 					</select>
-					<select className='h-10 rounded-lg border border-slate-700 bg-slate-950 px-3 text-base text-slate-100'>
+					<select className='h-10 rounded-lg border border-border bg-background px-3 text-base text-foreground'>
 						<option>Все</option>
 					</select>
 				</section>
 
-				<div className='overflow-x-auto rounded-3xl border border-slate-800 bg-slate-900'>
+				<div className='overflow-x-auto rounded-3xl border border-border bg-card'>
 					<table className='min-w-full border-collapse'>
-						<thead className='border-b border-slate-800'>
-							<tr className='text-left text-base text-slate-400'>
+						<thead className='border-b border-border'>
+							<tr className='text-left text-base text-muted-foreground'>
 								<th className='w-12 px-4 py-4'>
-									<span className='block h-5 w-5 rounded-md border-2 border-blue-500' />
+									<span className='block h-5 w-5 rounded-md border-2 border-primary' />
 								</th>
 								<th className='min-w-28 px-3 py-4 font-semibold'>Ключ</th>
 								<th className='min-w-[360px] px-3 py-4 font-semibold'>Название</th>
@@ -102,12 +102,12 @@ export default function TasksPage() {
 						</thead>
 						<tbody>
 							{tasks.map((task) => (
-								<tr key={task.key} className='border-b border-slate-800 last:border-b-0'>
+								<tr key={task.key} className='border-b border-border last:border-b-0'>
 									<td className='px-4 py-3'>
-										<span className='block h-5 w-5 rounded-md border-2 border-blue-500' />
+										<span className='block h-5 w-5 rounded-md border-2 border-primary' />
 									</td>
-									<td className='px-3 py-3 text-xl text-slate-400'>{task.key}</td>
-									<td className='px-3 py-3 text-xl font-medium text-slate-100'>
+									<td className='px-3 py-3 text-xl text-muted-foreground'>{task.key}</td>
+									<td className='px-3 py-3 text-xl font-medium text-foreground'>
 										{task.title}
 									</td>
 									<td className='px-3 py-3'>
@@ -117,9 +117,9 @@ export default function TasksPage() {
 											{task.type}
 										</span>
 									</td>
-									<td className='px-3 py-3 text-xl text-slate-200'>{task.status}</td>
-									<td className='px-3 py-3 text-xl text-slate-200'>{task.priority}</td>
-									<td className='px-3 py-3 text-xl text-slate-200'>{task.assignee}</td>
+									<td className='px-3 py-3 text-xl text-foreground'>{task.status}</td>
+									<td className='px-3 py-3 text-xl text-foreground'>{task.priority}</td>
+									<td className='px-3 py-3 text-xl text-foreground'>{task.assignee}</td>
 								</tr>
 							))}
 						</tbody>

From 11d3f3236484300a57e8e105ee037d0b60e94220 Mon Sep 17 00:00:00 2001
From: AlexMadM <alex.alexandrov.1988@gmail.com>
Date: Thu, 5 Mar 2026 13:26:03 -0800
Subject: [PATCH 3/6] =?UTF-8?q?feat(web):=20=D0=B4=D0=BE=D0=B1=D0=B0=D0=B2?=
 =?UTF-8?q?=D0=B8=D1=82=D1=8C=20=D0=B7=D0=B0=D0=B3=D0=BB=D1=83=D1=88=D0=BA?=
 =?UTF-8?q?=D1=83=20breadcrumbs=20=D0=B8=20=D0=BE=D0=B1=D0=BD=D0=BE=D0=B2?=
 =?UTF-8?q?=D0=B8=D1=82=D1=8C=20user=20dropdown=20=D0=B2=20header?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../widgets/main-layout/ui/header/header.tsx  | 28 +++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/apps/web/widgets/main-layout/ui/header/header.tsx b/apps/web/widgets/main-layout/ui/header/header.tsx
index 2f17e2b4..5d80ed00 100644
--- a/apps/web/widgets/main-layout/ui/header/header.tsx
+++ b/apps/web/widgets/main-layout/ui/header/header.tsx
@@ -16,8 +16,23 @@ import {
 import { MobileSidebarTrigger } from './mobile-sidebar-trigger'
 import { SidebarToggle } from './sidebar-toggle'
 
+const currentUser = {
+	name: 'Alex',
+	avatar: 'AL',
+}
+
 const Header = () => (
 	<div className='flex h-14 items-center justify-between bg-background px-3 text-foreground'>
+		<div className='flex min-w-0 items-center gap-2'>
+			<SidebarToggle />
+			<nav
+				aria-label='Breadcrumb'
+				className='hidden items-center gap-2 text-sm text-muted-foreground md:flex'
+			>
+				<span>Главная</span>
+				<span>/</span>
+				<span className='text-foreground'>Раздел</span>
+			</nav>
 		<div className='flex items-center gap-2'>
 			<MobileSidebarTrigger />
 			<div className='hidden md:block'>
@@ -25,7 +40,7 @@ const Header = () => (
 			</div>
 			<Input
 				placeholder='Поиск (пока не реализовано)'
-				className='h-9 w-[260px] md:w-[320px]'
+				className='h-9 w-[220px] md:w-[280px] lg:w-[320px]'
 			/>
 		</div>
 		<DropdownMenu>
@@ -37,7 +52,16 @@ const Header = () => (
 				</Button>
 			</DropdownMenuTrigger>
 			<DropdownMenuContent align='end' className='w-48'>
-				<DropdownMenuLabel>Мой аккаунт</DropdownMenuLabel>
+				<DropdownMenuLabel className='py-2'>
+					<div className='flex items-center gap-2'>
+						<Avatar size='sm'>
+							<AvatarFallback>{currentUser.avatar}</AvatarFallback>
+						</Avatar>
+						<span className='text-sm font-medium text-foreground'>
+							{currentUser.name}
+						</span>
+					</div>
+				</DropdownMenuLabel>
 				<DropdownMenuSeparator />
 				<DropdownMenuItem>Профиль</DropdownMenuItem>
 				<DropdownMenuItem>Настройки</DropdownMenuItem>

From 7a50710d159064676a3bde1ab61545faf220f784 Mon Sep 17 00:00:00 2001
From: AlexMadM <alex.alexandrov.1988@gmail.com>
Date: Thu, 5 Mar 2026 18:26:33 -0800
Subject: [PATCH 4/6] =?UTF-8?q?refactor(web):=20=D0=BE=D0=B1=D0=BD=D0=BE?=
 =?UTF-8?q?=D0=B2=D0=B8=D1=82=D1=8C=20Header,=20=20=D0=BF=D0=BE=D0=BF?=
 =?UTF-8?q?=D1=80=D0=B0=D0=B2=D0=B8=D1=82=D1=8C=20user=20avatar?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/widgets/main-layout/ui/header/header.tsx | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/apps/web/widgets/main-layout/ui/header/header.tsx b/apps/web/widgets/main-layout/ui/header/header.tsx
index 5d80ed00..4e66850a 100644
--- a/apps/web/widgets/main-layout/ui/header/header.tsx
+++ b/apps/web/widgets/main-layout/ui/header/header.tsx
@@ -17,14 +17,16 @@ import { MobileSidebarTrigger } from './mobile-sidebar-trigger'
 import { SidebarToggle } from './sidebar-toggle'
 
 const currentUser = {
-	name: 'Alex',
+	name: 'Имя',
 	avatar: 'AL',
 }
 
 const Header = () => (
 	<div className='flex h-14 items-center justify-between bg-background px-3 text-foreground'>
 		<div className='flex min-w-0 items-center gap-2'>
-			<SidebarToggle />
+			<div className='hidden md:block'>
+				<SidebarToggle />
+			</div>
 			<nav
 				aria-label='Breadcrumb'
 				className='hidden items-center gap-2 text-sm text-muted-foreground md:flex'
@@ -33,21 +35,18 @@ const Header = () => (
 				<span>/</span>
 				<span className='text-foreground'>Раздел</span>
 			</nav>
-		<div className='flex items-center gap-2'>
 			<MobileSidebarTrigger />
-			<div className='hidden md:block'>
-				<SidebarToggle />
-			</div>
 			<Input
 				placeholder='Поиск (пока не реализовано)'
 				className='h-9 w-[220px] md:w-[280px] lg:w-[320px]'
 			/>
 		</div>
+
 		<DropdownMenu>
 			<DropdownMenuTrigger asChild>
 				<Button variant='ghost' className='h-9 gap-2 px-2'>
 					<Avatar size='sm'>
-						<AvatarFallback>U</AvatarFallback>
+						<AvatarFallback>{currentUser.avatar}</AvatarFallback>
 					</Avatar>
 				</Button>
 			</DropdownMenuTrigger>

From 6a8b8c77aed3fa35ab98e1637be6e9c0c71e016d Mon Sep 17 00:00:00 2001
From: AlexMadM <alex.alexandrov.1988@gmail.com>
Date: Thu, 5 Mar 2026 18:32:49 -0800
Subject: [PATCH 5/6] refactor(web): open sidebar by default in sidebar store

---
 apps/web/widgets/main-layout/model/sidebar/store.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/web/widgets/main-layout/model/sidebar/store.ts b/apps/web/widgets/main-layout/model/sidebar/store.ts
index ae34ee42..58f70f6c 100644
--- a/apps/web/widgets/main-layout/model/sidebar/store.ts
+++ b/apps/web/widgets/main-layout/model/sidebar/store.ts
@@ -3,7 +3,7 @@ import { create } from 'zustand'
 import type { SideBarStore } from './types'
 
 export const useSideBarStore = create<SideBarStore>((set) => ({
-	isOpen: false,
+	isOpen: true,
 	open: () => set({ isOpen: true }),
 	close: () => set({ isOpen: false }),
 	toggle: () => set((state) => ({ isOpen: !state.isOpen })),

From 8ce5fa527c9a84af2ce29d022fbf656af9129b16 Mon Sep 17 00:00:00 2001
From: AlexMadM <alex.alexandrov.1988@gmail.com>
Date: Thu, 5 Mar 2026 18:40:23 -0800
Subject: [PATCH 6/6] =?UTF-8?q?feat(web):=20=D0=B4=D0=BE=D0=B1=D0=B0=D0=B2?=
 =?UTF-8?q?=D0=B8=D1=82=D1=8C=20=D0=B8=D0=BA=D0=BE=D0=BD=D0=BA=D1=83=20?=
 =?UTF-8?q?=D1=83=D0=B2=D0=B5=D0=B4=D0=BE=D0=BC=D0=BB=D0=B5=D0=BD=D0=B8?=
 =?UTF-8?q?=D0=B9-=D0=B7=D0=B0=D0=B3=D0=BB=D1=83=D1=88=D0=BA=D1=83=20?=
 =?UTF-8?q?=D0=B2=20Header?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../widgets/main-layout/ui/header/header.tsx  | 58 +++++++++++--------
 1 file changed, 35 insertions(+), 23 deletions(-)

diff --git a/apps/web/widgets/main-layout/ui/header/header.tsx b/apps/web/widgets/main-layout/ui/header/header.tsx
index 4e66850a..4f9029b1 100644
--- a/apps/web/widgets/main-layout/ui/header/header.tsx
+++ b/apps/web/widgets/main-layout/ui/header/header.tsx
@@ -12,6 +12,7 @@ import {
 	DropdownMenuTrigger,
 	Input,
 } from '@repo/ui'
+import { Bell } from '@repo/ui/icons'
 
 import { MobileSidebarTrigger } from './mobile-sidebar-trigger'
 import { SidebarToggle } from './sidebar-toggle'
@@ -42,32 +43,43 @@ const Header = () => (
 			/>
 		</div>
 
-		<DropdownMenu>
-			<DropdownMenuTrigger asChild>
-				<Button variant='ghost' className='h-9 gap-2 px-2'>
-					<Avatar size='sm'>
-						<AvatarFallback>{currentUser.avatar}</AvatarFallback>
-					</Avatar>
-				</Button>
-			</DropdownMenuTrigger>
-			<DropdownMenuContent align='end' className='w-48'>
-				<DropdownMenuLabel className='py-2'>
-					<div className='flex items-center gap-2'>
+		<div className='flex items-center gap-2'>
+			<Button
+				variant='ghost'
+				size='icon-sm'
+				type='button'
+				aria-label='Уведомления (заглушка)'
+			>
+				<Bell className='size-4' />
+			</Button>
+
+			<DropdownMenu>
+				<DropdownMenuTrigger asChild>
+					<Button variant='ghost' className='h-9 gap-2 px-2'>
 						<Avatar size='sm'>
 							<AvatarFallback>{currentUser.avatar}</AvatarFallback>
 						</Avatar>
-						<span className='text-sm font-medium text-foreground'>
-							{currentUser.name}
-						</span>
-					</div>
-				</DropdownMenuLabel>
-				<DropdownMenuSeparator />
-				<DropdownMenuItem>Профиль</DropdownMenuItem>
-				<DropdownMenuItem>Настройки</DropdownMenuItem>
-				<DropdownMenuSeparator />
-				<DropdownMenuItem variant='destructive'>Выйти</DropdownMenuItem>
-			</DropdownMenuContent>
-		</DropdownMenu>
+					</Button>
+				</DropdownMenuTrigger>
+				<DropdownMenuContent align='end' className='w-48'>
+					<DropdownMenuLabel className='py-2'>
+						<div className='flex items-center gap-2'>
+							<Avatar size='sm'>
+								<AvatarFallback>{currentUser.avatar}</AvatarFallback>
+							</Avatar>
+							<span className='text-sm font-medium text-foreground'>
+								{currentUser.name}
+							</span>
+						</div>
+					</DropdownMenuLabel>
+					<DropdownMenuSeparator />
+					<DropdownMenuItem>Профиль</DropdownMenuItem>
+					<DropdownMenuItem>Настройки</DropdownMenuItem>
+					<DropdownMenuSeparator />
+					<DropdownMenuItem variant='destructive'>Выйти</DropdownMenuItem>
+				</DropdownMenuContent>
+			</DropdownMenu>
+		</div>
 	</div>
 )