From 0cf4e73755d6aa19620404ec17f6d1263e5945bc Mon Sep 17 00:00:00 2001
From: Ivan Kuzmenko <6745157+rndtrash@users.noreply.github.com>
Date: Sat, 12 Jul 2025 22:35:46 +0300
Subject: [PATCH 1/6] =?UTF-8?q?=D0=A1=D1=82=D1=80=D0=B0=D0=BD=D0=B8=D1=86?=
 =?UTF-8?q?=D0=B0=20=D1=81=20=D0=BE=D1=88=D0=B8=D0=B1=D0=BA=D0=BE=D0=B9=20?=
 =?UTF-8?q?=D0=BF=D0=BE=D0=BA=D0=B0=D0=B7=D1=8B=D0=B2=D0=B0=D0=B5=D1=82=20?=
 =?UTF-8?q?=D0=BA=D0=BE=D0=BD=D0=BA=D1=80=D0=B5=D1=82=D0=BD=D1=8B=D0=B9=20?=
 =?UTF-8?q?=D0=BA=D0=BE=D0=B4=20=D0=B2=20=D0=B7=D0=B0=D0=B3=D0=BE=D0=BB?=
 =?UTF-8?q?=D0=BE=D0=B2=D0=BA=D0=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/routes/+error.svelte | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index 244bfd7..0f5e7ab 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -3,11 +3,11 @@
 </script>
 
 <svelte:head>
-	<title>404 &mdash; Tea Sanctuary</title>
+	<title>{page.status} &mdash; Tea Sanctuary</title>
 </svelte:head>
 
 <section
-	class="bg-[url('/common/background-day.webp')] dark:bg-[url('/common/background-night.webp')] bg-fixed bg-cover sticky flex h-screen shrink-0 flex-col items-center justify-center gap-12 overflow-hidden p-4"
+	class="hero-background flex h-screen shrink-0 flex-col items-center justify-center gap-12 overflow-hidden p-4"
 >
 	<div class="flex flex-nowrap flex-col gap-5">
 		<div class="flex flex-nowrap flex-col gap-3 items-center justify-center lg:flex-row lg:flex-nowrap">
@@ -25,4 +25,8 @@
 			</div>
 		</div>
 	</div>
-</section>
\ No newline at end of file
+</section>
+
+<style>
+	@import "$src/app.css";
+</style>
\ No newline at end of file

From b78c917ddfe50f70cb348c6326ffd006fd1a0805 Mon Sep 17 00:00:00 2001
From: Ivan Kuzmenko <6745157+rndtrash@users.noreply.github.com>
Date: Sat, 12 Jul 2025 22:37:43 +0300
Subject: [PATCH 2/6] =?UTF-8?q?=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB?=
 =?UTF-8?q?=20=D0=BF=D1=81=D0=B5=D0=B2=D0=B4=D0=BE=D0=BD=D0=B8=D0=BC=20?=
 =?UTF-8?q?=D0=B4=D0=BB=D1=8F=20=D0=BF=D0=B0=D0=BF=D0=BA=D0=B8=20`src/`,?=
 =?UTF-8?q?=20=D0=98=D0=B7=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB=D1=81=D1=8F=20?=
 =?UTF-8?q?=D0=BE=D1=82=20=D0=BE=D1=82=D0=BD=D0=BE=D1=81=D0=B8=D1=82=D0=B5?=
 =?UTF-8?q?=D0=BB=D1=8C=D0=BD=D1=8B=D1=85=20=D0=BF=D1=83=D1=82=D0=B5=D0=B9?=
 =?UTF-8?q?=20=D0=B2=20app.css,=20=D0=A1=D0=B4=D0=B5=D0=BB=D0=B0=D0=BB=20?=
 =?UTF-8?q?=D0=BA=D0=BB=D0=B0=D1=81=D1=81=20=D1=84=D0=BE=D0=BD=D0=B0=20?=
 =?UTF-8?q?=D0=BE=D0=B1=D1=89=D0=B8=D0=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app.css             | 6 +++++-
 src/routes/+page.svelte | 8 +-------
 svelte.config.js        | 3 +++
 3 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/app.css b/src/app.css
index 5ca67e0..06dd7c0 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,6 +1,6 @@
 @import "tailwindcss";
 @plugin "@tailwindcss/typography";
-@config "../tailwind.config.ts";
+@config "$src/../tailwind.config.ts";
 
 @font-face {
 	font-family: 'Lineyka';
@@ -29,4 +29,8 @@
 .no-x-scroll {
 	max-width: 100%;
 	overflow-x: hidden;
+}
+
+.hero-background {
+	@apply bg-[url('/common/background-day.webp')] dark:bg-[url('/common/background-night.webp')] bg-cover bg-fixed;
 }
\ No newline at end of file
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 67b2cf0..fbeead9 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -138,13 +138,7 @@
 </section>
 
 <style>
-	@import "tailwindcss";
-	@plugin "@tailwindcss/typography";
-	@config "../../tailwind.config.ts";
-
-	.hero-background {
-		@apply bg-[url('/common/background-day.webp')] dark:bg-[url('/common/background-night.webp')] bg-cover bg-fixed;
-	}
+	@import "$src/app.css";
 
 	section > h1 {
 		@apply font-disket mb-4 text-2xl font-bold sm:text-4xl;
diff --git a/svelte.config.js b/svelte.config.js
index 956f81e..ebf0dc8 100644
--- a/svelte.config.js
+++ b/svelte.config.js
@@ -26,6 +26,9 @@ const config = {
 			handleMissingId: ({ event, resolve }) => {
 				return;
 			}
+		},
+		alias: {
+			$src: "src/"
 		}
 	},
 	extensions: ['.svelte', '.md'],

From 5856dc412bc844782637901bfe073c2d2ad3a2a5 Mon Sep 17 00:00:00 2001
From: Ivan Kuzmenko <6745157+rndtrash@users.noreply.github.com>
Date: Sun, 13 Jul 2025 06:43:28 +0300
Subject: [PATCH 3/6] =?UTF-8?q?=D0=9D=D0=B5=D0=B1=D0=BE=D0=BB=D1=8C=D1=88?=
 =?UTF-8?q?=D0=B8=D0=B5=20=D0=B8=D0=B7=D0=BC=D0=B5=D0=BD=D0=B5=D0=BD=D0=B8?=
 =?UTF-8?q?=D1=8F=20=D0=B2=20=D1=80=D0=B0=D0=B7=D0=BC=D0=B5=D1=82=D0=BA?=
 =?UTF-8?q?=D0=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/routes/+layout.svelte | 2 +-
 src/routes/+page.svelte   | 1 -
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 1aca0ff..5db3e07 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -25,7 +25,7 @@
 	<title>Tea Sanctuary</title>
 </svelte:head>
 
-<div class="relative flex flex-col">
+<div class="relative flex flex-col min-h-lvh">
 	<slot />
 </div>
 
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index fbeead9..d2a2fa7 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -7,7 +7,6 @@
 <section
 	class="flex shrink-0 flex-col items-center justify-center gap-5 overflow-hidden p-4 hero-background"
 >
-	<div class="basis-full"></div>
 	<div
 		class="flex flex-col flex-nowrap items-center justify-center gap-3 lg:flex-row lg:flex-nowrap"
 	>

From 31d21b9c811333c2ddb7071fc374e14f32dd3118 Mon Sep 17 00:00:00 2001
From: Ivan Kuzmenko <6745157+rndtrash@users.noreply.github.com>
Date: Sun, 13 Jul 2025 08:51:50 +0300
Subject: [PATCH 4/6] =?UTF-8?q?=D0=98=D0=BA=D0=BE=D0=BD=D0=BA=D0=B8=20?=
 =?UTF-8?q?=D1=82=D0=B5=D0=BF=D0=B5=D1=80=D1=8C=20=D0=BC=D0=BE=D0=B3=D1=83?=
 =?UTF-8?q?=D1=82=20=D0=B1=D1=8B=D1=82=D1=8C=20=D1=87=D1=91=D1=80=D0=BD?=
 =?UTF-8?q?=D1=8B=D0=BC=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/components/HoverIcon.svelte | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/HoverIcon.svelte b/src/lib/components/HoverIcon.svelte
index c2c5a01..7fbff3c 100644
--- a/src/lib/components/HoverIcon.svelte
+++ b/src/lib/components/HoverIcon.svelte
@@ -6,17 +6,22 @@
 	export let src: string | null = null;
 	export let text: string;
 	export let size: number = 32;
+	export let black: boolean = false;
 
 	let isUrl;
 	$: isUrl = src?.startsWith('/') || src?.startsWith('http');
 </script>
 
-<div class="{className} fill-slate-50 text-sm uppercase transition-all">
+<div
+	class="{className} {black
+		? 'fill-slate-950'
+		: 'fill-slate-50'} text-sm uppercase transition-all"
+>
 	{#if src}
 		{#if isUrl}
 			<img {src} alt={text} width={size} height={size} />
 		{:else}
-			<Icon width={size} height={size} icon={src} color="#f8fafc" />
+			<Icon width={size} height={size} icon={src} color={black ? '#020618' : '#f8fafc'} />
 		{/if}
 	{:else}
 		{text}

From 00590e5823f37716d8a68f6ca55c68bf7afe45e4 Mon Sep 17 00:00:00 2001
From: Ivan Kuzmenko <6745157+rndtrash@users.noreply.github.com>
Date: Sun, 13 Jul 2025 10:33:08 +0300
Subject: [PATCH 5/6] =?UTF-8?q?=D0=A1=D0=B4=D0=B5=D0=BB=D0=B0=D0=BB=20?=
 =?UTF-8?q?=D0=BF=D0=B0=D0=BD=D0=B5=D0=BB=D1=8C=20=D0=BD=D0=B0=D0=B2=D0=B8?=
 =?UTF-8?q?=D0=B3=D0=B0=D1=86=D0=B8=D0=B8=20=D1=81=20=D1=81=D1=81=D1=8B?=
 =?UTF-8?q?=D0=BB=D0=BA=D0=B0=D0=BC=D0=B8-=D0=B7=D0=B0=D0=B3=D0=BB=D1=83?=
 =?UTF-8?q?=D1=88=D0=BA=D0=B0=D0=BC=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/components/NavBar.svelte | 44 ++++++++++++++++++++++++++++++++
 src/routes/+layout.svelte        | 44 ++++++++++++++++----------------
 src/routes/+page.svelte          |  4 +++
 3 files changed, 70 insertions(+), 22 deletions(-)
 create mode 100644 src/lib/components/NavBar.svelte

diff --git a/src/lib/components/NavBar.svelte b/src/lib/components/NavBar.svelte
new file mode 100644
index 0000000..398decc
--- /dev/null
+++ b/src/lib/components/NavBar.svelte
@@ -0,0 +1,44 @@
+<script lang="ts">
+	import HoverIcon from '$lib/components/HoverIcon.svelte';
+	import { page } from '$app/state';
+
+	export let routes: App.Route[];
+	export let isVertical: boolean = false;
+</script>
+
+<nav
+	class="flex flex-row gap-2 bg-slate-100 not-landscape:justify-around not-landscape:px-2 landscape:flex-col landscape:py-2"
+>
+	{#each routes as route (route.href)}
+		<a class="nav-button {page.url.pathname === route.href ? 'active' : ''}" href={route.href}>
+			<div class="p-1">
+				<HoverIcon
+					src={route.icon}
+					class="text-sm uppercase"
+					text={route.href}
+					size={32}
+					black={page.url.pathname !== route.href}
+				/>
+			</div>
+			<div class="contour">
+				{route.label}
+			</div>
+		</a>
+	{/each}
+</nav>
+
+<style>
+	@import '$src/app.css';
+
+	.nav-button {
+		@apply flex aspect-square flex-col items-center justify-center gap-0.5 p-2 text-slate-950 not-landscape:h-24 hover:bg-emerald-400 landscape:w-24;
+
+		> .contour {
+			@apply rounded-full bg-slate-50 px-1.5 py-0.5 text-center;
+		}
+
+		&.active {
+			@apply bg-emerald-600;
+		}
+	}
+</style>
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 5db3e07..ac454fb 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -1,20 +1,15 @@
 <script lang="ts">
 	import '../app.css';
 	// import '../syntax-highlight.css'; // https://github.com/PrismJS/prism-themes
-	import { page } from '$app/state';
-	import { slide } from 'svelte/transition';
-	import { navigating } from '$app/state';
-	// import NavButton from '$lib/components/Nav-Button.svelte';
-	import Icon from '@iconify/svelte';
+	import NavBar from '$src/lib/components/NavBar.svelte';
 
 	const routes: App.Route[] = [
-		{ label: 'команда', icon: 'material-symbols:person', href: '/team' },
-		{ label: 'новости', icon: 'material-symbols:newspaper', href: '/blog' },
-		{ label: 'проекты', icon: 'material-symbols:work', href: '/projects' }
+		{ label: 'главная', icon: 'material-symbols:emoji-food-beverage', href: '/' },
+		{ label: 'команда', icon: 'material-symbols:groups', href: '/team' },
+		{ label: 'блог', icon: 'material-symbols:newspaper', href: '/blog' },
+		{ label: 'проекты', icon: 'material-symbols:work', href: '/projects' },
+		{ label: 'контакты', icon: 'material-symbols:chat', href: '/contact' }
 	];
-
-	let isMenuOpen = false;
-	$: if (navigating) isMenuOpen = false;
 </script>
 
 <svelte:head>
@@ -25,16 +20,21 @@
 	<title>Tea Sanctuary</title>
 </svelte:head>
 
-<div class="relative flex flex-col min-h-lvh">
-	<slot />
-</div>
+<div class="flex h-screen w-screen flex-row portrait:flex-col-reverse">
+	<NavBar {routes} />
+	<div class="flex grow-1 flex-col overflow-auto">
+		<div class="relative grow-1">
+			<slot />
+		</div>
 
-<footer class="bg-emerald-950">
-	<div
-		class="mx-auto w-full max-w-screen-xl justify-center px-2 py-6 text-center text-emerald-50 md:flex"
-	>
-		<p>
-			<span class="font-bold">&copy; 2025 Tea Sanctuary</span>
-		</p>
+		<footer class="bg-emerald-950">
+			<div
+				class="mx-auto w-full max-w-screen-xl justify-center px-2 py-6 text-center text-emerald-50 md:flex"
+			>
+				<p>
+					<span class="font-bold">&copy; 2025 Tea Sanctuary</span>
+				</p>
+			</div>
+		</footer>
 	</div>
-</footer>
+</div>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index d2a2fa7..073d202 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -4,6 +4,10 @@
 	import { PUBLIC_TS_DISCORD } from '$env/static/public';
 </script>
 
+<svelte:head>
+	<title>Tea Sanctuary</title>
+</svelte:head>
+
 <section
 	class="flex shrink-0 flex-col items-center justify-center gap-5 overflow-hidden p-4 hero-background"
 >

From fcdb7a7e4cd4c699dce6f17d50ff559f0015b961 Mon Sep 17 00:00:00 2001
From: Ivan Kuzmenko <6745157+rndtrash@users.noreply.github.com>
Date: Sun, 13 Jul 2025 10:33:25 +0300
Subject: [PATCH 6/6] =?UTF-8?q?=D0=A3=D0=BF=D1=80=D0=BE=D1=81=D1=82=D0=B8?=
 =?UTF-8?q?=D0=BB=20=D0=BB=D0=BE=D0=B3=D0=B8=D0=BA=D1=83=20=D0=B2=D1=8B?=
 =?UTF-8?q?=D1=87=D0=B8=D1=81=D0=BB=D0=B5=D0=BD=D0=B8=D1=8F=20=D1=80=D0=B0?=
 =?UTF-8?q?=D0=B7=D0=BC=D0=B5=D1=80=D0=B0=20SocialHyperlink?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/components/SocialHyperlink.svelte | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/lib/components/SocialHyperlink.svelte b/src/lib/components/SocialHyperlink.svelte
index 93920e9..27efb4c 100644
--- a/src/lib/components/SocialHyperlink.svelte
+++ b/src/lib/components/SocialHyperlink.svelte
@@ -13,9 +13,7 @@
 
 <a {href} class="{className} group inline-block" target={isLinkLocal(href) ? '_self' : '_blank'}>
 	<span
-		class="inline-block {sm.current
-			? 'size-8 rounded-xl p-1'
-			: 'size-6 rounded-sm p-0.5'} bg-emerald-800 align-bottom transition-all group-hover:scale-110"
+		class="inline-block size-6 rounded-sm bg-emerald-800 p-0.5 align-bottom transition-all group-hover:scale-110 sm:size-8 sm:rounded-xl sm:p-1"
 	>
 		<HoverIcon src={customIcon ?? tryGetIcon(href)} text={href} size={sm.current ? 24 : 20} />
 	</span>