Add basic meta tags

watsonindustries · Jul 28, 2024 · e6322e5 · e6322e5
1 parent a933337
commit e6322e5
Show file tree

Hide file tree

Showing 4 changed files with 47 additions and 4 deletions.
diff --git a/package.json b/package.json
@@ -33,6 +33,7 @@
 		"prettier-plugin-tailwindcss": "^0.6.5",
 		"svelte": "^4.2.7",
 		"svelte-check": "^3.6.0",
+		"svelte-meta-tags": "^3.1.2",
 		"tailwindcss": "^3.4.4",
 		"tslib": "^2.4.1",
 		"typescript": "^5.0.0",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
@@ -1,7 +1,13 @@
 <script>
-	import SeatForm from "$lib/components/SeatForm.svelte";
+	import SeatForm from '$lib/components/SeatForm.svelte';
+	import { MetaTags } from 'svelte-meta-tags';
 </script>
 
-<section class="p-4 max-w-xl mx-auto">
+<title>BDPP | Home</title>
+<meta name="description" content="Breaking Dimensions Penlight Project home." />
+
+<MetaTags title="BDPP | Home" description="Breaking Dimensions Penlight Project" />
+
+<section class="mx-auto max-w-xl p-4">
 	<SeatForm />
 </section>
diff --git a/src/routes/about/+page.svelte b/src/routes/about/+page.svelte
@@ -1,6 +1,18 @@
-<section class="space-y-4 p-4 max-w-2xl mx-auto">
+<script lang="ts">
+	import { MetaTags } from 'svelte-meta-tags';
+</script>
+
+<title>BDPP | About</title>
+<meta name="description" content="Breaking Dimensions Penlight Project information page." />
+
+<MetaTags
+	title="BDPP | About"
+	description="Breaking Dimensions Penlight Project information page."
+/>
+
+<section class="mx-auto max-w-2xl space-y-4 p-4">
 	<h1
-		class="mb-4 bg-gradient-to-br from-primary-600 to-secondary-600 bg-clip-text text-4xl xl:text-6xl font-bold tracking-tight text-transparent"
+		class="mb-4 bg-gradient-to-br from-primary-600 to-secondary-600 bg-clip-text text-4xl font-bold tracking-tight text-transparent xl:text-6xl"
 	>
 		HoloENLight Breaks Dimensions!
 	</h1>