feat: navbar logo and favicon

client/public/favicon/browserconfig.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <TileColor>#663399</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

client/public/favicon/site.webmanifest

@@ -0,0 +1,19 @@
+{
+    "name": "GoodStr",
+    "short_name": "GoodStr",
+    "icons": [
+        {
+            "src": "/android-chrome-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "/android-chrome-384x384.png",
+            "sizes": "384x384",
+            "type": "image/png"
+        }
+    ],
+    "theme_color": "#ffffff",
+    "background_color": "#ffffff",
+    "display": "standalone"
+}

client/src/lib/assets/Logo.tsx

@@ -0,0 +1,51 @@
+import { SVGProps } from "react";
+
+const SvgComponent = (props: SVGProps<SVGSVGElement>) => (
+  <svg
+    width={120}
+    height={41}
+    viewBox="0 0 239 82"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path fill="#fff" d="M0 0h239v82H0z" />
+    <path
+      d="M94.162 45.465c0 2.95-1.79 4.73-4.698 4.73-3.459 0-5.248-2.339-5.248-6.859v-4.87c0-4.52 1.772-6.858 5.197-6.858 2.718 0 4.611 1.92 4.749 4.834h4.198c-.12-5.358-3.493-8.64-8.861-8.64-6.006 0-9.499 3.91-9.499 10.665v4.87C80 50.09 83.493 54 89.499 54c5.3 0 8.879-3.334 8.879-8.377v-5.271h-9.275v3.263h5.059v1.85ZM110.836 53.878c5.197 0 8.483-3.281 8.483-8.482V42.48c0-5.201-3.286-8.482-8.483-8.482-5.197 0-8.483 3.28-8.483 8.482v2.915c0 5.2 3.286 8.482 8.483 8.482Zm0-16.51c2.788 0 4.525 2.041 4.525 5.34v2.46c0 3.3-1.737 5.341-4.525 5.341-2.788 0-4.526-2.042-4.526-5.34v-2.461c0-3.299 1.738-5.34 4.526-5.34ZM132.621 53.878c5.196 0 8.483-3.281 8.483-8.482V42.48c0-5.201-3.287-8.482-8.483-8.482-5.197 0-8.484 3.28-8.484 8.482v2.915c0 5.2 3.287 8.482 8.484 8.482Zm0-16.51c2.787 0 4.525 2.041 4.525 5.34v2.46c0 3.3-1.738 5.341-4.525 5.341-2.788 0-4.526-2.042-4.526-5.34v-2.461c0-3.299 1.738-5.34 4.526-5.34ZM152.667 53.79c2.736 0 4.646-1.204 5.438-3.438h.344v3.142h4.061V27h-4.13v10.507h-.344c-.705-2.217-2.65-3.456-5.369-3.456-4.319 0-7.003 3.09-7.003 8.168v3.404c0 5.096 2.684 8.168 7.003 8.168Zm1.446-3.542c-2.702 0-4.371-1.868-4.371-4.87v-2.984c0-3.002 1.669-4.887 4.371-4.887 2.684 0 4.353 1.867 4.353 4.887v2.984c0 3.002-1.669 4.87-4.353 4.87ZM167.225 46.582c.206 4.608 3.665 7.418 9.103 7.418 5.558 0 8.999-2.95 8.999-7.732 0-3.822-2.065-5.986-6.866-7.12l-2.391-.577c-2.908-.68-4.113-1.78-4.113-3.717 0-2.182 1.669-3.49 4.422-3.49 2.616 0 4.319 1.36 4.543 3.664h3.958c-.155-4.363-3.545-7.225-8.535-7.225-5.214 0-8.552 2.897-8.552 7.417 0 3.7 2.168 6.022 6.711 7.121l2.392.576c3.063.733 4.301 1.815 4.301 3.718 0 2.321-1.875 3.805-4.8 3.805-3.029 0-4.956-1.432-5.197-3.858h-3.975ZM194.344 29.042v5.463h-4.956v3.281h4.956v9.809c0 4.24 2.048 5.951 7.003 5.951.568 0 3.735-.052 4.044-.105v-3.246c-.327.035-3.045.053-3.734.053-2.133 0-3.321-.943-3.321-2.636v-9.826h7.21v-3.281h-7.279v-5.463h-3.923ZM219.243 44.977c0-4.416 2.289-6.824 6.642-6.824 1.033 0 2.272.209 3.115.54v-4.415c-.654-.262-1.635-.401-2.702-.401-3.579 0-5.678 1.71-6.452 5.393h-.585v-4.887h-7.899v3.036h4.027v13.038h-3.665v3.037h13.129v-3.037h-5.61v-5.48Z"
+      fill="#000"
+    />
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M17 16h42v5.554H22.6v24.189l14.467 15.375L53.4 45.743V33.587h-9.333v-5.554H59v19.999L37.067 69 17 48.032V16Z"
+      fill="url(#a)"
+    />
+    <path d="M38.91 26v12.6H48L37.09 56V43.4H28L38.91 26Z" fill="url(#b)" />
+    <defs>
+      <linearGradient
+        id="a"
+        x1={38.933}
+        y1={11.372}
+        x2={38.933}
+        y2={72.703}
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stopColor="#639" />
+        <stop offset={1} stopColor="#F0F" />
+      </linearGradient>
+      <linearGradient
+        id="b"
+        x1={38}
+        y1={26}
+        x2={38}
+        y2={56}
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stopColor="#FF9500" />
+        <stop offset={1} stopColor="#FF0" />
+      </linearGradient>
+    </defs>
+  </svg>
+);
+
+export default SvgComponent;

client/src/lib/molecules/Navbar.tsx

@@ -9,6 +9,7 @@ import {
 } from "@heroicons/react/24/outline";
 import { FaGithub } from "react-icons/fa";
 import { BiBitcoin } from "react-icons/bi";
+import Logo from "../assets/Logo";
 
 function classNames(...classes: string[]) {
   return classes.filter(Boolean).join(" ");
@@ -27,7 +28,9 @@ export const Navbar = ({ currentPage }: NavbarProps) => {
             <div className="flex h-16 justify-between">
               <div className="flex">
                 <div className="flex flex-shrink-0 items-center font-bold text-lg font-mono">
-                  <a href="/">GoodStr</a>
+                  <a href="/">
+                    <Logo />
+                  </a>
                 </div>
                 <div className="hidden sm:ml-6 sm:flex sm:space-x-8">
                   {/* Current: "border-gray-500 text-gray-900", Default: "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700" */}