added "url" to metadata and "try" link on project page

src/components/ProjectPage.astro

@@ -8,6 +8,7 @@ export interface Props {
         date: string;
         slug: string;
         image?: string | null;
+        url?: string;
         hidden: boolean;
     };
 }
@@ -15,9 +16,25 @@ export interface Props {
 const { metadata } = Astro.props;
 ---
 
+<style>
+    a {
+        text-decoration: none;
+        border-bottom: 1px solid var(--ayu-blue-500);
+        color: var(--ayu-blue-500);
+        transition:
+            color 0.1s,
+            border-color 0.1s;
+        margin-bottom: 16px;
+    }
+    a:hover {
+        color: var(--ayu-blue-600);
+        border-color: var(--ayu-blue-600);
+    }
+</style>
+
 <Layout currentPage="projects">
     <div class="text-md">
-        <h1 class="text-xl text-ayu-accent mb-2">
+        <h1 class="text-2xl text-ayu-accent mb-2">
             {metadata.title}
         </h1>
 
@@ -33,6 +50,19 @@ const { metadata } = Astro.props;
             )
         }
 
+        {
+            metadata.url ? (
+                <a
+                    href={metadata.url}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    class="inline-block text-sm"
+                >
+                    Try {metadata.title}
+                </a>
+            ) : null
+        }
+
         <slot />
 
         <p class="text-sm text-ayu-gutter mt-4">{metadata.date}</p>

src/pages/projects/wiskatron.astro

@@ -2,12 +2,12 @@
 import ProjectPage from "../../components/ProjectPage.astro";
 
 export const metadata = {
-    title: "wiskatron",
+    title: "Wiskatron",
     description: "Spotify listening activity with dynamic visuals",
     date: "February 2024",
     slug: "wiskatron",
-    // image: null,
     image: "/wiskatron-icon.svg",
+    url: "https://wiskatron.oliverbryan.com",
     hidden: false,
 };
 ---