Enable frontmatter og-theme support

Also allows changing from large to small og image

src/.vitepress/config/hooks/generateMeta.ts

@@ -8,6 +8,8 @@ const generateMeta = (context: TransformContext, hostname: string) => {
 
 	head.push(["link", { rel: "canonical", href: url }]);
 
+	head.push(["meta", { name: "theme-color", content: pageData.frontmatter.theme }]);
+
 	head.push(["meta", { property: "og:url", content: url }]);
 	head.push(["meta", { property: "og:type", content: pageData.frontmatter.type }]);
 	head.push(["meta", { property: "og:title", content: pageData.frontmatter.title }]);
@@ -18,8 +20,17 @@ const generateMeta = (context: TransformContext, hostname: string) => {
 	head.push(["meta", { name: "twitter:description", content: pageData.frontmatter.description }]);
 
 	if (pageData.frontmatter.image) {
-		head.push(["meta", { property: "og:image", content: `${hostname}/${pageData.frontmatter.image}` }]);
-		head.push(["meta", { name: "twitter:image", content: `${hostname}/${pageData.frontmatter.image}` }]);
+		head.push(["meta", { property: "og:image", content: `${hostname}/${pageData.frontmatter.image.replace(/^\//, "")}` }]);
+		head.push(["meta", { name: "twitter:image", content: `${hostname}/${pageData.frontmatter.image.replace(/^\//, "")}` }]);
+	}
+
+	switch (pageData.frontmatter.imageSize) {
+		case "small":
+			head.push(["meta", { name: "twitter:card", content: "summary" }]);
+			break;
+		case "large":
+			head.push(["meta", { name: "twitter:card", content: "summary_large_image" }]);
+			break;
 	}
 
 	if (pageData.frontmatter.tag) {

src/forks/neko.md

@@ -29,16 +29,9 @@ features:
     details: Describe Feature here.
     icon: <img src="https://mangadex.org/img/brand/mangadex-logo.svg">
 
-head:
-  - - meta
-    - property: og:image
-      content: /forks/forks_logo-neko.png
-  - - meta
-    - name: theme-color
-      content: "#FD6684"
-  - - meta
-    - name: msapplication-TileColor
-      content: "#FD6684"
+theme: "#FD6684"
+image: /forks/forks_logo-neko.png
+imageSize: small
 ---
 
 <br><VPTeamMembers size="small" :members="members" />

src/forks/tachiyomiaz.md

@@ -29,16 +29,9 @@ features:
     details: Describe Feature here.
     icon: <img src="https://tachiyomi-v3-gridsome.netlify.app/assets/forks_logo-az.png" height="32px" width="32px">
 
-head:
-  - - meta
-    - property: og:image
-      content: /forks/forks_logo-az.png
-  - - meta
-    - name: theme-color
-      content: "#FFCC4D"
-  - - meta
-    - name: msapplication-TileColor
-      content: "#FFCC4D"
+theme: "#FFCC4D"
+image: /forks/forks_logo-az.png
+imageSize: small
 ---
 
 <br><VPTeamMembers size="small" :members="members" />

src/forks/tachiyomij2k.md

@@ -38,16 +38,9 @@ features:
     details: Describe Feature here.
     icon: 👑
 
-head:
-  - - meta
-    - property: og:image
-      content: /forks/forks_logo-j2k.png
-  - - meta
-    - name: theme-color
-      content: "#0952AF"
-  - - meta
-    - name: msapplication-TileColor
-      content: "#0952AF"
+theme: "#0952AF"
+image: /forks/forks_logo-j2k.png
+imageSize: small
 ---
 
 <br><VPTeamMembers size="small" :members="members" />

src/forks/tachiyomisy.md

@@ -38,16 +38,9 @@ features:
     details: Describe Feature here.
     icon: 🐍
 
-head:
-  - - meta
-    - property: og:image
-      content: /forks/forks_logo-sy.png
-  - - meta
-    - name: theme-color
-      content: "#CE2828"
-  - - meta
-    - name: msapplication-TileColor
-      content: "#CE2828"
+theme: "#CE2828"
+image: /forks/forks_logo-sy.png
+imageSize: small
 ---
 
 <br><VPTeamMembers size="small" :members="members" />