Merge pull request #4 from Polyfrost/website/icon-fix

2 files changed, 53 insertions, 0 deletions

diff --git a/apps/website/src/pages/blog/[...slug].astro b/apps/website/src/pages/blog/[...slug].astro
new file mode 100644
index 0000000..abdde0a
--- /dev/null
+++ b/apps/website/src/pages/blog/[...slug].astro
@@ -0,0 +1,23 @@
+---
+// i hate u astro vscode extensi on/j
+/// <reference types="../../env.d.ts" />
+import { type CollectionEntry, getCollection } from 'astro:content';
+import BlogPost from '../../layouts/BlogPost.astro';
+
+export async function getStaticPaths() {
+	const posts = await getCollection('blog');
+	return posts.map(post => ({
+		params: { slug: post.slug },
+		props: post,
+	}));
+}
+
+type Props = CollectionEntry<'blog'>;
+
+const post = Astro.props;
+const { Content } = await post.render();
+---
+
+<BlogPost {...post.data}>
+	<Content/>
+</BlogPost>
diff --git a/apps/website/src/pages/blog/index.astro b/apps/website/src/pages/blog/index.astro
new file mode 100644
index 0000000..4bccad4
--- /dev/null
+++ b/apps/website/src/pages/blog/index.astro
@@ -0,0 +1,30 @@
+---
+/// <reference types="../../env.d.ts" />
+import { getCollection } from 'astro:content';
+import FormattedDate from '../../components/base/FormattedDate.astro';
+import Layout from '../../layouts/Layout.astro';
+
+const posts = (await getCollection('blog')).sort(
+	(a, b) => a.data.pubDate.valueOf() - b.data.pubDate.valueOf(),
+);
+---
+
+<Layout title="Polyfrost Blog" description="Recieve Polyfrost updates here">
+	<section>
+		<ul>
+			{
+				posts.map(post => (
+					<li>
+						<a href={`blog/${post.slug}/`}>
+							<img width={720} height={360} src={post.data.heroImage} alt=""/>
+							<h4 class="title">{post.data.title}</h4>
+							<p class="date">
+								<FormattedDate date={post.data.pubDate}/>
+							</p>
+						</a>
+					</li>
+				))
+			}
+		</ul>
+	</section>
+</Layout>