Add new color scheme, logo

1 files changed, 11 insertions, 7 deletions

diff --git a/src/components/Header.astro b/src/components/Header.astro
index 2402c2a..ff2a8ef 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -2,21 +2,25 @@
 import Link from '@/components/Link.astro'
 import ThemeToggle from '@/components/ThemeToggle.astro'
 import SearchButton from '@/components/react/SearchButton'
-import { NAV_LINKS, SITE } from '@/consts'
+import { NAV_LINKS } from '@/consts'
 import { Image } from 'astro:assets'
 import logo from '../../public/static/logo.svg'
 ---
 
-<div>
+<div class="border-b md:border-b-0">
   <div
-    class="mx-auto flex max-w-3xl items-center justify-between gap-4 px-4 py-3"
+    class="mx-auto flex max-w-3xl flex-row items-center justify-center gap-4 px-4 py-3 md:justify-between"
   >
-    <Link href="/" class="flex shrink-0 items-center justify-center gap-3">
+    <Link
+      href="/"
+      class="hidden shrink-0 items-center justify-center gap-3 md:flex"
+    >
       <Image src={logo} alt="Logo" class="size-5 sm:size-6" />
       <span
-        class="hidden h-full font-mono text-lg leading-none font-medium min-[400px]:block"
-        >{SITE.title}</span
+        class="hidden h-full py-4 font-mono leading-none font-medium italic md:block md:text-3xl"
       >
+        foss<span class="text-primary">cet</span>
+      </span>
     </Link>
     <div class="flex items-center gap-4">
       <nav class="flex items-center gap-4 text-sm sm:gap-6">
@@ -24,7 +28,7 @@ import logo from '../../public/static/logo.svg'
           NAV_LINKS.map((item) => (
             <Link
               href={item.href}
-              class="text-foreground/60 hover:text-foreground capitalize transition-colors"
+              class="text-foreground/60 hover:text-foreground font-mono transition-colors"
             >
               {item.label}
             </Link>