updated header

lib/labelmaker_web/components/layouts/app.html.heex

@@ -1,25 +1,26 @@
 <header class="px-4 sm:px-6 lg:px-8">
-  <div class="flex items-center justify-between border-b border-zinc-100 py-3 text-sm">
+  <div class="flex items-center justify-between border-b border-primary dark:border-primary-dark py-3 text-sm">
+    <a href="/">
+      <img src={~p"/images/labelmaker.png"} width="200" />
+    </a>
     <div class="flex items-center gap-4">
-      <a href="/">
-        <img src={~p"/images/logo.svg"} width="36" />
-      </a>
-      <p class="bg-brand/5 text-brand rounded-full px-2 font-medium leading-6">
-        v{Application.spec(:phoenix, :vsn)}
-      </p>
-    </div>
-    <div class="flex items-center gap-4 font-semibold leading-6 text-zinc-900">
-      <a href="https://twitter.com/elixirphoenix" class="hover:text-zinc-700">
-        @elixirphoenix
-      </a>
-      <a href="https://github.com/phoenixframework/phoenix" class="hover:text-zinc-700">
-        GitHub
+      <a
+        href="https://github.com/mcdoh/tarokka"
+        class="h-[35px] w-[125px]"
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        <button class="h-full w-full flex flex-row justify-center items-center gap-3 bg-slate-700 rounded-[6px] hover:bg-slate-600 transition cursor-pointer">
+          <img src="/images/github-mark-white.svg" alt="GitHub" class="h-[22px] w-[22px]" />
+          <img src="/images/github-logo-white.png" alt="GitHub" class="h-[22px]" />
+        </button>
       </a>
       <a
-        href="https://hexdocs.pm/phoenix/overview.html"
-        class="rounded-lg bg-zinc-100 px-2 py-1 hover:bg-zinc-200/80"
+        href="https://www.buymeacoffee.com/mcdoh"
+        class="h-[35px] w-[125px] transition hover:drop-shadow-[0_0_3px_#ffd700]"
+        target="_blank"
       >
-        Get Started <span aria-hidden="true">&rarr;</span>
+        <img src="/images/bmc-button.svg" alt="Buy Me A Coffee" className="h-full" />
       </a>
     </div>
   </div>