Add header/metadata fields

2025-11-19 11:48:29 +13:00
parent 1da77d6074
commit 32b9a29028
6 changed files with 22 additions and 6 deletions
--- a/web/src/layout/Base.astro
+++ b/web/src/layout/Base.astro
@@ -3,11 +3,27 @@ import BaseHead from "./BaseHead.astro"
 import Sidebar from "@components/sidebar"
 import Navbar from "@components/index/navbar"
 import Footer from "@components/footer"
+
+const {
+    meta = {}
+} = Astro.props;
+
+const {
+    title = "",
+    description = "",
+    ogImage = "",
+    articleDate = ""
+} = meta;
 ---

 <html>
 <head>
-    <BaseHead/>
+    <BaseHead
+        title={title}
+        description={description}
+        ogImage={ogImage}
+        articleDate={articleDate}
+    />
    
 </head>

--- a/web/src/pages/copyright.astro
+++ b/web/src/pages/copyright.astro
@@ -3,7 +3,7 @@ import Base from "src/layout/Base.astro"
 import Sidebar from "src/components/sidebar.astro"
 ---

-<Base>
+<Base meta={{title: "copyright"}}>
    <div slot="content">
        <p class="text-xl">Copyright & License</p>
 			
--- a/web/src/pages/now.astro
+++ b/web/src/pages/now.astro
@@ -13,7 +13,7 @@ const records = await pb.collection('now').getFullList({
 const lastUpdated = getFormattedDate(records[0].updated)
 ---

-<Base>
+<Base meta={{title: "now"}}>

    <div slot="sidebar" class="text-left">
        <h2>The Now!</h2>
--- a/web/src/pages/photos/index.astro
+++ b/web/src/pages/photos/index.astro
@@ -11,7 +11,7 @@ const photos = await pb.collection('photos').getFullList({
 })
 ---

-<Base>
+<Base meta={{title: "photos"}}>
    <div slot="sidebar">
        <p id="photo-title" class="bold text-2xl">{photos[0].title === "" ? "Untitled" : photos[0].title}</p>
        <p id="photo-camera" class="text-sm">📸 {photos[0].camera}</p>
--- a/web/src/pages/posts/[slug].astro
+++ b/web/src/pages/posts/[slug].astro
@@ -20,7 +20,7 @@ const readTime = calcReadTime(wordCount);

 ---

-<Base>
+<Base meta={{title: "post", description: title, ogImage: headerImage, articleDate: publishDate}}>
    <div slot="sidebar" class="text-left">
        <img src={headerImage}/>

--- a/web/src/pages/posts/index.astro
+++ b/web/src/pages/posts/index.astro
@@ -17,7 +17,7 @@ const tags = posts.flatMap(p => p.tags)
 const uniqueTags = tags.filter((v, i, a) => a.indexOf(v) === i)
 ---

-<Base>
+<Base meta={{title: "posts"}}>
    <div slot="sidebar" class="text-left">
        A few thoughts I've had, whenever I feel like it as you can see!