Add favicons and logo (#62)

app/components/navbar.tsx

@@ -28,8 +28,8 @@ export function Navbar({ isAdmin }: NavbarProps) {
     <header className="sticky top-0 z-50 w-full border-b border-border/40 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
       <div className="flex h-16 items-center justify-between px-4 md:px-6 lg:px-8">
         {/* Logo */}
-        <Link to="/" className="flex items-center space-x-2">
-          <span className="font-bold text-xl">Brackt</span>
+        <Link to="/" className="flex items-center">
+          <img src="/logo.svg" alt="Brackt" className="h-6" />
         </Link>
 
         {/* Desktop Navigation */}

app/root.tsx

@@ -34,6 +34,11 @@ export async function loader(args: Route.LoaderArgs) {
 }
 
 export const links: Route.LinksFunction = () => [
+  { rel: "icon", href: "/favicon.ico", sizes: "48x48" },
+  { rel: "icon", href: "/favicon.svg", type: "image/svg+xml" },
+  { rel: "icon", href: "/favicon-96x96.png", type: "image/png", sizes: "96x96" },
+  { rel: "apple-touch-icon", href: "/apple-touch-icon.png" },
+  { rel: "manifest", href: "/site.webmanifest" },
   { rel: "preconnect", href: "https://fonts.googleapis.com" },
   {
     rel: "preconnect",
@@ -122,8 +127,8 @@ export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
     <div className="min-h-screen bg-background text-foreground flex flex-col">
       <header className="border-b border-border/40 bg-background/95 backdrop-blur">
         <div className="flex h-16 items-center px-4 md:px-6 lg:px-8">
-          <a href="/" className="font-bold text-xl hover:text-primary transition-colors">
-            Brackt
+          <a href="/">
+            <img src="/logo.svg" alt="Brackt" className="h-6" />
           </a>
         </div>
       </header>

public/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="234" height="194" viewBox="0 0 234 194" fill="none"><path d="M174.6 140.8H197C201.4 140.8 204.533 139.933 206.4 138.2C208.4 136.333 209.4 133.333 209.4 129.2V117.6C209.4 113.467 208.4 110.533 206.4 108.8C204.4 107.067 201.133 106.2 196.6 106.2H174.6C173.133 106.2 172.4 106.933 172.4 108.4V138.6C172.4 140.067 173.133 140.8 174.6 140.8ZM174.6 85.6H195C199.267 85.6 202.4 84.7334 204.4 83C206.4 81.1334 207.4 78.1334 207.4 74V66.2C207.4 62.0667 206.4 59.1334 204.4 57.4C202.533 55.5334 199.467 54.6 195.2 54.6H174.6C173.133 54.6 172.4 55.3334 172.4 56.8V83.4C172.4 84.8667 173.133 85.6 174.6 85.6ZM147 157.8V37.6C147 34.8 148.4 33.4 151.2 33.4H199.2C209.733 33.4 217.867 36.2 223.6 41.8C229.333 47.4 232.2 55.4 232.2 65.8V74C232.2 85.3334 226.933 92.6667 216.4 96C221.733 96.8 226 99 229.2 102.6C232.4 106.067 234 111.067 234 117.6V129.6C234 140 231.133 148 225.4 153.6C219.667 159.2 211.6 162 201.2 162H151.2C148.4 162 147 160.6 147 157.8Z" fill="#2B7FFF"></path><path d="M0 0H85C93.2843 0 100 6.71573 100 15V24H0V0Z" fill="#2B7FFF"></path><path d="M76 0H85C93.2843 0 100 6.71573 100 15V97H91C82.7157 97 76 90.2843 76 82V0Z" fill="#2B7FFF"></path><path d="M0 194H50H85C93.2843 194 100 187.284 100 179V170H0V194Z" fill="#F0C731"></path><path d="M76 194H85C93.2843 194 100 187.284 100 179V97H91C82.7157 97 76 103.716 76 112V194Z" fill="#F0C731"></path></svg>

public/logo.svg

@@ -0,0 +1,14 @@
+<svg width="931" height="194" viewBox="0 0 931 194" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M897.4 162H880.6C877.667 162 876.2 160.585 876.2 157.754V56.4635C876.2 54.9808 875.467 54.2395 874 54.2395H851.2C848.4 54.2395 847 52.8243 847 49.9938V36.2457C847 33.4152 848.4 32 851.2 32H926.8C929.6 32 931 33.4152 931 36.2457V49.9938C931 52.8243 929.6 54.2395 926.8 54.2395H904C902.4 54.2395 901.6 54.9808 901.6 56.4635V157.754C901.6 160.585 900.2 162 897.4 162Z" fill="white"/>
+<path d="M737.284 162H720.217C717.406 162 716 160.585 716 157.754V36.2457C716 33.4152 717.406 32 720.217 32H737.284C740.095 32 741.501 33.4152 741.501 36.2457V93.8663H741.902C742.973 90.6314 745.048 86.4531 748.127 81.3313L778.648 36.2457C780.388 33.4152 782.998 32 786.479 32H806.156C807.629 32 808.499 32.4717 808.767 33.4152C809.168 34.2239 808.834 35.3022 807.763 36.6501L769.612 89.8227L812.18 156.946C813.117 158.563 813.251 159.843 812.582 160.787C812.046 161.596 810.841 162 808.967 162H794.309C789.624 162 786.478 160.585 784.872 157.754L754.151 108.221L741.501 123.182V157.754C741.501 160.585 740.095 162 737.284 162Z" fill="white"/>
+<path d="M631.301 162H609.699C599.262 162 591.203 159.17 585.522 153.509C579.841 147.848 577 139.693 577 129.045V64.9549C577 54.3069 579.841 46.1524 585.522 40.4914C591.203 34.8305 599.262 32 609.699 32H631.301C641.606 32 649.599 34.8979 655.28 40.6936C661.093 46.3546 664 54.4417 664 64.9549V74.4572C664 77.4225 662.547 78.9051 659.64 78.9051H642.993C640.219 78.9051 638.831 77.4225 638.831 74.4572V66.168C638.831 61.8548 637.907 58.8222 636.057 57.07C634.339 55.183 631.367 54.2395 627.139 54.2395H613.663C609.567 54.2395 606.595 55.183 604.745 57.07C603.027 58.8222 602.169 61.8548 602.169 66.168V127.832C602.169 132.145 603.027 135.245 604.745 137.132C606.595 138.884 609.567 139.76 613.663 139.76H627.139C631.367 139.76 634.339 138.884 636.057 137.132C637.907 135.245 638.831 132.145 638.831 127.832V119.543C638.831 116.578 640.219 115.095 642.993 115.095H659.64C662.547 115.095 664 116.578 664 119.543V129.045C664 139.558 661.093 147.713 655.28 153.509C649.599 159.17 641.606 162 631.301 162Z" fill="white"/>
+<path d="M450.814 162H431.689C429.299 162 428.502 160.585 429.299 157.754L460.775 36.2457C461.705 33.4152 463.697 32 466.752 32H493.248C496.568 32 498.561 33.4152 499.225 36.2457L530.701 157.754C531.498 160.585 530.701 162 528.311 162H509.186C507.725 162 506.729 161.73 506.197 161.191C505.666 160.517 505.268 159.372 505.002 157.754L499.424 135.515H460.576L454.998 157.754C454.732 159.372 454.268 160.517 453.604 161.191C453.072 161.73 452.143 162 450.814 162ZM479.701 56.4635L465.357 114.893H494.842L480.498 56.4635H479.701Z" fill="white"/>
+<path d="M319.185 162H302.197C299.399 162 298 160.585 298 157.754V36.2457C298 33.4152 299.399 32 302.197 32H349.763C360.156 32 368.284 34.8979 374.146 40.6936C380.009 46.4894 382.94 54.6438 382.94 65.1571V80.9269C382.94 96.1576 377.011 106.266 365.153 111.253V112.062L386.537 157.148C387.737 160.383 386.604 162 383.14 162H366.951C364.553 162 362.821 161.73 361.755 161.191C360.689 160.652 359.823 159.506 359.157 157.754L339.171 114.084H325.78C324.182 114.084 323.382 114.825 323.382 116.308V157.754C323.382 160.585 321.983 162 319.185 162ZM325.581 93.4619H345.167C349.43 93.4619 352.561 92.5858 354.56 90.8336C356.559 88.9466 357.558 85.9813 357.558 81.9378V66.168C357.558 61.9896 356.559 58.957 354.56 57.07C352.561 55.183 349.43 54.2395 345.167 54.2395H325.581C324.115 54.2395 323.382 54.9808 323.382 56.4635V91.2379C323.382 92.7206 324.115 93.4619 325.581 93.4619Z" fill="white"/>
+<g transform="translate(0 98) scale(1 1.04) translate(0 -98)">
+<path d="M184.6 142.24H207C211.4 142.24 214.533 141.35 216.4 139.571C218.4 137.655 219.4 134.575 219.4 130.333V118.426C219.4 114.184 218.4 111.173 216.4 109.393C214.4 107.614 211.133 106.725 206.6 106.725H184.6C183.133 106.725 182.4 107.477 182.4 108.983V139.981C182.4 141.487 183.133 142.24 184.6 142.24ZM184.6 85.5801H205C209.267 85.5801 212.4 84.6905 214.4 82.9114C216.4 80.9953 217.4 77.916 217.4 73.6734V65.6672C217.4 61.4246 216.4 58.4137 214.4 56.6345C212.533 54.7185 209.467 53.7605 205.2 53.7605H184.6C183.133 53.7605 182.4 54.5132 182.4 56.0187V83.3219C182.4 84.8274 183.133 85.5801 184.6 85.5801ZM157 159.689V36.311C157 33.437 158.4 32 161.2 32H209.2C219.733 32 227.867 34.874 233.6 40.6221C239.333 46.3701 242.2 54.5816 242.2 65.2566V73.6734C242.2 85.3064 236.933 92.8336 226.4 96.2551C231.733 97.0762 236 99.3344 239.2 103.03C242.4 106.588 244 111.72 244 118.426V130.743C244 141.418 241.133 149.63 235.4 155.378C229.667 161.126 221.6 164 211.2 164H161.2C158.4 164 157 162.563 157 159.689Z" fill="#2B7FFF"/>
+</g>
+<path d="M0 0H85C93.2843 0 100 6.71573 100 15V24H0V0Z" fill="#2B7FFF"/>
+<path d="M76 0H85C93.2843 0 100 6.71573 100 15V97H91C82.7157 97 76 90.2843 76 82V0Z" fill="#2B7FFF"/>
+<path d="M0 194H50H85C93.2843 194 100 187.284 100 179V170H0V194Z" fill="#F0C731"/>
+<path d="M76 194H85C93.2843 194 100 187.284 100 179V97H91C82.7157 97 76 103.716 76 112V194Z" fill="#F0C731"/>
+</svg>

public/site.webmanifest

@@ -0,0 +1,21 @@
+{
+  "name": "MyWebSite",
+  "short_name": "MySite",
+  "icons": [
+    {
+      "src": "/web-app-manifest-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "maskable"
+    },
+    {
+      "src": "/web-app-manifest-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}