chore(website): improve header layout on mobile

apps/website/src/components/Header.css

@@ -7,6 +7,7 @@ header {
     backdrop-filter: blur(20px);    
     z-index: 1000;
     --gap: 1.25em;
+    font-size: 0.8em;
 }
 
 header .content-wrapper {
@@ -30,8 +31,8 @@ section.hero-section > .content-wrapper {
 }
 
 header img {
-    width: 48px;
-    height: 48px;
+    width: 32px;
+    height: 32px;
 }
 
 header img+span {
@@ -52,4 +53,15 @@ header nav a {
 
 header nav a.active {
     font-weight: bold;
+}
+
+@media (min-width: 720px) {
+    header {
+        font-size: inherit;
+    }
+
+    header img {
+        width: 48px;
+        height: 48px;
+    }
 }

apps/website/src/components/Header.tsx

@@ -27,7 +27,7 @@ export function Header() {
                     {HEADER_LINKS.map(link => (
                         <a
                             href={link.url}
-                            className={url === link.url && 'active'}
+                            className={url === link.url ? "active" : ""}
                             target={link.external && "_blank"}
                         >{link.text}</a>
                     ))}