style(website): 💄 add footer to website

website/src/components/footer.tsx

@@ -0,0 +1,57 @@
+import { component$ } from "@builder.io/qwik";
+
+export const Footer = component$(() => {
+  return (
+    <footer class="mt-24 border-t bg-neutral-50">
+      <div class="mx-auto flex max-w-screen-sm items-center justify-between px-4 py-8 text-sm text-neutral-900">
+        <p>
+          <span>
+            Made by{" "}
+            <a
+              href="https://twitter.com/diecodev"
+              target="_blank"
+              class="font-semibold"
+            >
+              diecodev.
+            </a>
+          </span>
+        </p>
+        <nav class="flex gap-2">
+          <a href="https://github.com/diecodev/qwik-date" target="_blank">
+            <span class="sr-only">github repo</span>
+            <svg
+              fill="none"
+              stroke="currentColor"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="1.5"
+              viewBox="0 0 24 24"
+              xmlns="http://www.w3.org/2000/svg"
+              class="h-4 w-4"
+            >
+              <path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"></path>
+              <path d="M9 18c-4.51 2-5-2-7-2"></path>
+            </svg>
+          </a>
+          <a href="https://diecodev.deno.dev" target="_blank">
+            <span class="sr-only">github repo</span>
+            <svg
+              fill="none"
+              stroke="currentColor"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="1.5"
+              viewBox="0 0 24 24"
+              xmlns="http://www.w3.org/2000/svg"
+              class="h-4 w-4"
+            >
+              <circle cx="12" cy="12" r="10"></circle>
+              <path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path>
+              <path d="M2 12h20"></path>
+            </svg>
+          </a>
+        </nav>
+      </div>
+    </footer>
+  );
+});

website/src/routes/index.tsx

@@ -7,6 +7,7 @@ import { Customize } from "~/components/customize";
 import "@fontsource-variable/onest";
 import { ScriptCode } from "~/components/script";
 import { Docs } from "~/components/docs";
+import { Footer } from "~/components/footer";
 
 export default component$(() => {
   const theme = useSignal<"light" | "dark">("light");
@@ -66,6 +67,7 @@ export default component$(() => {
         <ScriptCode />
         <Docs />
       </main>
+      <Footer />
     </>
   );
 });