about us page

src/routes/Header.svelte

@@ -25,7 +25,7 @@
       <div class="hidden lg:flex lg:gap-x-12">
         <a href="/" class="text-sm font-semibold leading-6 text-gray-900">Все рецепты</a>
         <a href="/categories" class="text-sm font-semibold leading-6 text-gray-900">Категории</a>
-        <!-- <a href="/donate" class="text-sm font-semibold leading-6 text-gray-900">Поддержать сайт</a> -->
+        <a href="/about" class="text-sm font-semibold leading-6 text-gray-900">О нас</a>
       </div>
       <div class="hidden lg:flex lg:flex-1 lg:justify-end">
         
@@ -54,7 +54,7 @@
             <div class="space-y-2 py-6">
               <a href="/" on:click={changeMenuState} class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50">Все рецепты</a>
               <a href="/categories" on:click={changeMenuState} class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50">Категории</a>
-              <!-- <a href="/donate" on:click={changeMenuState} class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50">Поддержать сайт</a> -->
+              <a href="/about" on:click={changeMenuState} class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50">О нас</a>
             </div>
           </div>
         </div>

src/routes/about/+page.svelte

@@ -1,2 +1,61 @@
-<h1>About</h1>
+<div class="bg-white">
-asd
+    <div class="mx-auto max-w-2xl px-4 py-16 sm:px-6 sm:py-10 lg:max-w-7xl lg:px-8">
+        <div class="font-title">О нас</div>
+        <div>
+            <div class="desc_container flex-col gap-5 lg:flex-row text-lg svelte-18byhms">
+                <div class="mainimg svelte-18byhms">
+                    <img class="rounded-lg h-full w-auto svelte-18byhms" alt="Курица по-маньчжурски" src="https://hellomagrussia.ru/uploads/kuhnya-10-let-spustya-kak-sejchas-zhivut-aktery-populyarnogo-seriala_47008_cover_752x544.webp">
+                </div>
+                <div class="recipedesc svelte-18byhms">
+                    Друзья, все эти годы мы усердно трудились, получали опыт, росли, создавали качественный контент, старались снимать вкусные рецепты.
+                    Мы не можем не совершать ошибки. Они — часть нашей жизни. А самое главное — они помогают нам найти правильный путь.
+                    <br/>— Шеф, ну что за бред? Нафига вообще отклеивать эти этикетки от бананов?
+                    <br/>— Для баланса Вселенной. Ведь где-то там, в Африке, такой же огузок, как ты, приклеивает эти этикетки.
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<style>
+    .desc_container {
+        display: flex;
+        align-items: center;
+        /* font-size: 1.3em; */
+        /* gap: 14px; */
+    }
+
+    .mainimg {
+        flex: 1 0;
+        /* border: dashed blue 1px; */
+    }
+
+    .mainimg img {
+        max-height: 100%;
+        max-width: 100%;
+    }
+
+    .recipedesc {
+        flex: 1;
+        box-sizing: border-box;
+        font-family: 'RobotoRegular', sans-serif;
+        /* padding: 0px 20px 0px 20px; */
+    }
+
+    .font-title {
+        font-family: 'AlegreyaSansSC', sans-serif;
+        font-size: 2.4em;
+    }
+    @font-face {
+        font-family: 'AlegreyaSansSC';
+        font-style: normal;
+        font-weight: 800;
+        src: url('/fonts/Alegreyasansscextrabold.ttf');
+    }
+    @font-face {
+        font-family: 'RobotoRegular';
+        font-style: normal;
+        font-weight: 400;
+        src: url('/fonts/Roboto-Regular.ttf');
+    }
+</style>