final changes to blog

src/lib/BlogCard/Meta.svelte

@@ -9,7 +9,7 @@
 		<div class="flex flex-row items-center gap-2">
 			<div class="i-fa6-solid:tags" />
 			{#each post.tags as tag}
-				<a href="/blog/tags/{tag.slug}" class="no-underline">{tag.name}</a>
+				<a href="/blog/tags/{tag.slug}" class="no-underline bg-primary rounded-2 p-1">{tag.name}</a>
 			{/each}
 		</div>
 	{/if}

src/lib/BlogCard/PostOuter.svelte

@@ -1,3 +1,11 @@
+<script lang="ts">
+	export let url: string = "";
+</script>
+
 <div class="flex flex-col gap-4 bg-secondary p-4 rounded-2">
 	<slot />
+
+	{#if url}
+		<a href={url}>View on Ghost</a>
+	{/if}
 </div>

src/lib/BlogCard/SingleWordLists.svelte

@@ -1,10 +1,11 @@
 <script lang="ts">
 	export let items: any;
+	export let name: string;
 </script>
 
 
 <div class="flex flex-col gap-4">
 	{#each items as item}
-		<a href="/blog/authors/{item.slug}" class="bg-secondary w-fit p-2 rounded-2 no-underline">{item.name}</a>
+		<a href="/blog/{name}/{item.slug}" class="bg-secondary sm:w-md p-2 rounded-2 no-underline">{item.name}</a>
 	{/each}
 </div>

src/routes/blog/[title]/+page.svelte

@@ -9,7 +9,7 @@
 	<title>{data.post.title} | Project Segfault Blog</title>
 </svelte:head>
 
-<PostOuter>
+<PostOuter url={data.post.url}>
 	<TitleWithBackButton {data} />
 	<Meta post={data.post} />
 	<PostContent {data} />

src/routes/blog/authors/+page.svelte

@@ -11,5 +11,5 @@
 
 <h1>Blog authors</h1>
 
-<SingleWordLists items={data.authors} />
+<SingleWordLists items={data.authors} name="authors" />
 

src/routes/blog/authors/[author]/+page.server.ts

@@ -4,9 +4,15 @@ import fetchApi from "$lib/ghost";
 export const load: PageServerLoad = async ({ params }) => {
 	const data = await fetchApi("posts", "&filter=author:" + params.author);
 	
+	const authorsLoop = data.posts[0].authors.map((author: { slug: string; name: any; }) => {
+		if (author.slug === params.author) {
+			return author.name;
+		}
+	});
+
 	return {
 		posts: data.posts,
-		authorName: params.author
+		authorName: authorsLoop.filter((tag: any) => tag !== undefined)[0]
 	};
 };
 

src/routes/blog/authors/[author]/+page.svelte

@@ -9,7 +9,7 @@
 	<title>Blog author {data.authorName} | Project Segfault Blog</title>
 </svelte:head>
 
-<h1>Blog author {data.authorName}</h1>
+<h1>Blog author <span class="text-accent">{data.authorName}</span></h1>
 
 <PostsContainer>
 	{#each data.posts as post}

src/routes/blog/tags/+page.svelte

@@ -11,4 +11,4 @@
 
 <h1>Blog tags</h1>
 
-<SingleWordLists items={data.tags} />
+<SingleWordLists items={data.tags} name="tags" />

src/routes/blog/tags/[tag]/+page.server.ts

@@ -4,8 +4,14 @@ import fetchApi from "$lib/ghost";
 export const load: PageServerLoad = async ({ params }) => {
 	const data = await fetchApi("posts", "&filter=tags:" + params.tag);
 
+	const tagsLoop = data.posts[0].tags.map((tag: { slug: string; name: any; }) => {
+		if (tag.slug === params.tag) {
+			return tag.name;
+		}
+	});
+
 	return {
 		posts: data.posts,
-		tagName: params.tag
+		tagName: tagsLoop.filter((tag: any) => tag !== undefined)[0]
 	}
 };

src/routes/blog/tags/[tag]/+page.svelte

@@ -9,7 +9,7 @@
 	<title>Blog tag {data.tagName} | Project Segfault Blog</title>
 </svelte:head>
 
-<h1>Blog tag {data.tagName}</h1>
+<h1>Blog tag <span class="text-accent">{data.tagName}</span></h1>
 
 <PostsContainer>
 	{#each data.posts as post}

uno.config.ts

@@ -14,7 +14,13 @@ export default defineConfig({
 
 	presets: [
 		presetIcons(),
-		presetTypography(),
+		presetTypography({
+			cssExtend: {
+				"h1,h2,h3,h4,h5,h6": {
+					"font-weight": "800"
+				}
+			}
+		}),
 		presetWind({
 			dark: "class"
 		})