Done, just need to fill out descriptions

This commit is contained in:
Henry Hiles 2023-06-23 14:57:07 -04:00
parent 4bf53a4b14
commit 83f39c615c
3 changed files with 32 additions and 12 deletions

View file

@ -1,7 +1,23 @@
export default Object.entries({
all: { title: "All", default: true },
linux: { title: "Linux" },
web: { title: "Web Development" },
bot: { title: "Discord Bot Development" },
other: { title: "Other" }
all: {
title: "All",
default: true,
description:
"Hello, and welcome to my blog. I post about Discord Bot Development, Web Development, Linux, and other Tech-related subjects. You can filter and search in the sidebar."
},
linux: {
title: "Linux",
description:
"Linux is an operating system that has existed since the 1990s, and is used extensively, from Android in your phones which is linux-based to the over 40% of websites running on linux."
},
web: { title: "Web Development", description: "Web Development" },
bot: {
title: "Discord Bot Development",
description: "Discord Bot Development"
},
other: {
title: "Other",
description:
"This section of my blog is for all my articles that don't fit into any other catagories."
}
})

View file

@ -2,9 +2,11 @@
import Layout from "../../../layouts/Layout.astro"
import BlogPost from "../../../components/BlogPost.astro"
import styles from "../../../styles/Blog.module.css"
import { getCollection } from "astro:content"
import { CollectionEntry, getCollection } from "astro:content"
import { micromark } from "micromark"
import categories from "../../../categories"
import Divider from "../../../components/Divider.astro"
type Post = CollectionEntry<"blog">
export const getStaticPaths = async () => {
const posts = await getCollection("blog")
@ -14,13 +16,14 @@ export const getStaticPaths = async () => {
props: {
filteredPosts: properties.default
? posts
: posts.filter((post) => post.data.category == category)
: posts.filter((post) => post.data.category == category),
categoryProperties: properties
}
}))
}
const { category } = Astro.params
const { filteredPosts } = Astro.props
const { filteredPosts, categoryProperties } = Astro.props
---
<Layout page="Blog" description="The blog of Henry Hiles">
@ -51,13 +54,13 @@ const { filteredPosts } = Astro.props
<h1>Welcome to the blog!</h1>
<Divider />
<p>
Hello, and welcome to my blog. I post about Discord Bot
Development, Web Development, Linux, and other Tech-related
subjects. You can filter and search in the sidebar.
<Fragment
set:html={micromark(categoryProperties.description)}
/>
</p>
</article>
{
filteredPosts.map((post) => (
filteredPosts.map((post: Post) => (
<a
class={styles.link}
href={`/blog/${post.slug}`}

View file

@ -18,6 +18,7 @@
.description p {
font-size: 1.5rem;
margin: 0.3rem;
text-align: justify;
max-width: 40rem;
}