diff --git a/src/content.config.ts b/src/content.config.ts new file mode 100644 index 0000000..6e97e59 --- /dev/null +++ b/src/content.config.ts @@ -0,0 +1,15 @@ +import { defineCollection, z } from "astro:content"; +import { glob } from "astro/loaders"; + +const blog = defineCollection({ + loader: glob({ base: "./src/content/posts", pattern: "**/*.{md,mdx}" }), + schema: z.object({ + title: z.string(), + description: z.string().optional(), + pubDate: z.coerce.date(), + modifiedDate: z.coerce.date().optional(), + wantsPanel: z.boolean().default(true) + }) +}); + +export const collections = { blog }; \ No newline at end of file diff --git a/src/layouts/MainLayout.astro b/src/layouts/MainLayout.astro index 3471e98..51b3fc2 100644 --- a/src/layouts/MainLayout.astro +++ b/src/layouts/MainLayout.astro @@ -1,5 +1,12 @@ --- +import Panel from "./Panel.astro"; import "../styles/global.scss"; +import { getCollection } from "astro:content"; + +const { title } = Astro.props; +const pageTitle = title || "FoxGirlRiley's shitty website | Bwaaa 🎺"; + +const hasPosts = (await getCollection("blog")).length > 0; --- @@ -8,9 +15,19 @@ import "../styles/global.scss"; - FoxGirlRiley's shitty website | Bwaaa 🎺 + {pageTitle} + { + hasPosts && ( + + + Home + Blog + + + ) + } diff --git a/src/layouts/Panel.astro b/src/layouts/Panel.astro index ee904d2..6ca9123 100644 --- a/src/layouts/Panel.astro +++ b/src/layouts/Panel.astro @@ -1,9 +1,9 @@ --- import "../styles/Panel.scss"; -const { title } = Astro.props; +const { title, customClass } = Astro.props; --- -
+
{title &&

{title}

}
diff --git a/src/pages/blog/[...slug].astro b/src/pages/blog/[...slug].astro new file mode 100644 index 0000000..6d201a1 --- /dev/null +++ b/src/pages/blog/[...slug].astro @@ -0,0 +1,33 @@ +--- +import { render } from "astro:content"; +import { getCollection } from "astro:content"; +import Main from "../../layouts/MainLayout.astro"; +import TransFlagPanel from "../../layouts/TransFlagPanel.astro"; +import Panel from "../../layouts/Panel.astro"; + +export const getStaticPaths = async () => { + const posts = await getCollection("blog"); + return posts.map((post) => ({ + params: { slug: post.id }, + props: post, + })); +}; + +const post = Astro.props; +const { Content } = await render(post); +--- + +
+ +

{post.data.title}

+ + { + post.data.wantsPanel ? ( + + + + ) : ( + + ) + } +
diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro new file mode 100644 index 0000000..17229f1 --- /dev/null +++ b/src/pages/blog/index.astro @@ -0,0 +1,31 @@ +--- +import { getCollection } from "astro:content"; +import Main from "../../layouts/MainLayout.astro"; +import TransFlagPanel from "../../layouts/TransFlagPanel.astro"; +import Panel from "../../layouts/Panel.astro"; +import "./index.scss"; + +const latestPosts = (await getCollection("blog")).sort( + (a, b) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf(), +); +--- + +
+ +

Blog!!!

+ + { + latestPosts.map((post) => { + return ( + + +

{post.data.description}

+ + + ); + }) + } +
diff --git a/src/pages/blog/index.scss b/src/pages/blog/index.scss new file mode 100644 index 0000000..3bba555 --- /dev/null +++ b/src/pages/blog/index.scss @@ -0,0 +1,8 @@ +.blog-post-panel { + background-color: lightgray; +} + +.blog-post-link { + text-decoration: none; + color: black; +} \ No newline at end of file