From d835c8eb69755ecc6c67e731b2cee8e2d719e51b Mon Sep 17 00:00:00 2001
From: Jade Ellis <jade@ellis.link>
Date: Tue, 23 Jul 2024 19:45:51 +0100
Subject: [PATCH] Add h-card and author metadata

---
 packages/website/src/lib/Hero.svelte             | 16 ++++++++++++----
 .../routes/blog/[...date]/[slug]/+page.svelte    | 10 ++++++++++
 2 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/packages/website/src/lib/Hero.svelte b/packages/website/src/lib/Hero.svelte
index 067f7bcd..8ed32b4a 100644
--- a/packages/website/src/lib/Hero.svelte
+++ b/packages/website/src/lib/Hero.svelte
@@ -1,14 +1,17 @@
 <script lang="ts">
     import url from "./logo.svg?url";
+    import { SITE_URL } from "$lib/metadata";
 </script>
 
-<div class="hero card edge">
+<div class="hero card edge h-card">
     <div class="logo">
-        <img src={url} alt="Logo" />
+        <a href={SITE_URL} class="u-url"><img class="u-photo" src={url} alt="Logo" /></a>
     </div>
     <div class="content">
-        <h1 class="title">JadedBlueEyes</h1>
-        <div class="description">Student, Computer Scientist and Creative</div>
+        <div>
+        <h1 class="title p-name"><span class="p-given-name">Jade</span> <span class="p-family-name">Ellis</span></h1>
+        <div role="doc-subtitle"><span class="p-nickname">JadedBlueEyes</span></div></div>
+        <div class="description p-note">Student, Computer Scientist and Creative</div>
     </div>
 </div>
 
@@ -41,6 +44,11 @@
         font-size: 32px;
         margin: 0;
     }
+    [role="doc-subtitle"] { 
+        padding-block-start: 0;
+        font-size: 18px;
+        font-weight: 600;
+    }
 
     .description {
         text-align: center;
diff --git a/packages/website/src/routes/blog/[...date]/[slug]/+page.svelte b/packages/website/src/routes/blog/[...date]/[slug]/+page.svelte
index 81f712f4..738ac6b8 100644
--- a/packages/website/src/routes/blog/[...date]/[slug]/+page.svelte
+++ b/packages/website/src/routes/blog/[...date]/[slug]/+page.svelte
@@ -29,11 +29,20 @@
             webShareAPISupported = false;
         }
     };
+
+    const defaultAuthor = {
+        name: "Jade Ellis",
+        url: "https://jade.ellis.link",
+        fediverse: "@JadedBlueEyes@tech.lgbt"
+    }
 </script>
 
 <svelte:head>
     <link rel="alternate" type="application/rss+xml" title={SITE_TITLE} href={SITE_URL + "/blog/rss.xml"}>
     <link rel="alternate" type="application/feed+json" title={SITE_TITLE} href={SITE_URL + "/blog/feed.json"}>
+    {#if defaultAuthor?.fediverse}
+        <meta name="fediverse:creator" content={defaultAuthor?.fediverse}>
+    {/if}
 </svelte:head>
 
 <SvelteSeo
@@ -61,6 +70,7 @@
                 >{new Date(data.post.date).toLocaleDateString()}</time
             ></a
         >
+        · <span>By <a class="p-author h-card" href={defaultAuthor.url}>{defaultAuthor.name}</a></span>
         · <span>{data.post.readingTime.text}</span>
         {#if webShareAPISupported} · <button class="link" on:click={handleWebShare}
                 >Share</button