post browser support

This commit is contained in:
2026-04-15 22:51:47 +01:00
parent da06ae1279
commit c08993bc26
5 changed files with 81 additions and 12 deletions
+63 -5
View File
@@ -1,16 +1,74 @@
<script module lang="ts"> <script module lang="ts">
let posts = import.meta.glob("/src/routes/posts/*.md", { eager: true }); let posts = import.meta.glob("/src/routes/posts/**/*.md", {
type Post = { eager: true,
});
export type Post = {
title: string; title: string;
description: string; description: string;
path: string;
catagory: string; catagory: string;
date: Date; date: Date;
updated: Date; updated: Date;
tags: [string]; tags: string[];
}; };
export function getPosts(): Promise<Array<Post>> { export { PostCard };
export function getPosts(): Post[] {
console.log(posts);
let postsNew: Post[] = new Array();
Object.entries(posts).map(([path, module]) => { Object.entries(posts).map(([path, module]) => {
console.log(path, module.metadata); const metadata = module.metadata;
let date = new Date(metadata.date);
let updated = new Date(metadata.updated);
let tags = metadata.tags.split(" ");
let trimedPath = path.replace("/src/routes/", "");
let post: Post = {
title: metadata.title,
description: metadata.description,
date: date,
path: trimedPath,
updated: updated,
catagory: metadata.catagory,
tags: tags,
};
postsNew.push(post);
}); });
console.log(postsNew);
return postsNew;
} }
</script> </script>
{#snippet PostCard(post: Post)}
<a href={post.path}>
<div class="card_body">
<div>
<!-- // Left -->
<p>meow Left</p>
<p>{post.title}</p>
</div>
<div>
<!-- // Right -->
<p>meow Right</p>
</div>
</div>
</a>
{/snippet}
<style>
.card_body {
display: flex;
flex-direction: row;
height: 200px;
width: 200px;
justify-content: space-between;
}
.card_left {
display: flex;
flex-direction: column;
flex-grow: 1;
}
.card_right {
display: flex;
flex-direction: column;
flex-grow: 1;
}
</style>
-2
View File
@@ -4,11 +4,9 @@
import { SidebarRight } from "$lib/sidebar/sidebar_right.svelte"; import { SidebarRight } from "$lib/sidebar/sidebar_right.svelte";
import { WebButtons } from "$lib/web_buttons/webButtons.svelte"; import { WebButtons } from "$lib/web_buttons/webButtons.svelte";
import { NavBar } from "$lib/nav.svelte"; import { NavBar } from "$lib/nav.svelte";
import PostHelpers, { getPosts } from "$lib/PostHelpers.svelte";
let { children } = $props(); let { children } = $props();
export const prerender = true; export const prerender = true;
getPosts();
</script> </script>
<svelte:head> <svelte:head>
-5
View File
@@ -1,5 +0,0 @@
---
title: meow
---
meow
+9
View File
@@ -0,0 +1,9 @@
<script lang="ts">
import { getPosts, PostCard } from "src/lib/PostHelpers.svelte";
const posts = getPosts();
</script>
{#each posts as post}
{@render PostCard(post)}
{/each}
+9
View File
@@ -0,0 +1,9 @@
---
title: hi
date: 1995-12-17T03:24:00
updated: 1995-12-17T03:24:00
description: meow
catagory: main
tags: moew meow meow
---
Test post, this tests the frontmatter processing