the horrors

src/pages/404.astro

@@ -0,0 +1,14 @@
+---
+import Layout from "~/layouts/Base.astro";
+import Header from "~/components/ui/Header.astro";
+import Footer from "~/components/ui/Footer.astro";
+---
+
+<Layout title="404" description="Page not found" icon="fa-solid fa-ghost">
+  <Header />
+  <main class="border-l-5 border-light-pu dark:border-dark-pu pl-4">
+    <h2 class="text-2xl font-bold">404</h2>
+    <p class="text-lg">Page not found</p>
+  </main>
+  <Footer />
+</Layout>

src/pages/about.astro

@@ -0,0 +1,7 @@
+---
+import Page from "~/layouts/Page.astro";
+---
+
+<Page title="About" description="do you wanna know?" icon="fa-solid fa-user" date="2025-03-13">
+  <h1>i kiss girls</h1>
+</Page>

src/pages/blog/[id].astro

@@ -0,0 +1,24 @@
+---
+import Page from "~/layouts/Page.astro";
+import { getCollection, render } from "astro:content";
+// 1. Generate a new path for every collection entry
+export async function getStaticPaths() {
+  const posts = await getCollection("blog");
+  return posts.map((post) => ({
+    params: { id: post.id },
+    props: { post },
+  }));
+}
+// 2. For your template, you can get the entry directly from the prop
+const { post } = Astro.props;
+const { Content } = await render(post);
+---
+
+<Page
+  title={post.data.title}
+  description={post.data.description}
+  date={post.data.date}
+  icon={post.data.icon}
+>
+  <Content />
+</Page>

src/pages/blog/index.astro

@@ -0,0 +1,12 @@
+---
+import Page from "~/layouts/Page.astro";
+import BlogPostList from "~/components/lists/BlogPostList.astro";
+---
+
+<Page
+  title="Post index"
+  description="A list of all my blog posts."
+  icon="fa-solid fa-blog"
+>
+  <BlogPostList collection="blog" />
+</Page>

src/pages/contact/index.astro

@@ -0,0 +1,35 @@
+---
+import Layout from "~/layouts/Page.astro";
+---
+
+<Layout
+  title="Contact"
+  description="how to get a hold of me if you ever need to"
+  icon="fa-solid fa-envelope"
+>
+  <p>
+    I'm not really active on social media, but you can contact me via email.
+  </p>
+  <p>
+    <a href="mailto:hello@ivyneeds.rest">hello@ivyneeds.rest</a>
+  </p>
+  <h3 class="text-lg font-bold my-2">where i am / where i'm not</h3>
+  <ul class="fa-ul">
+    <li>
+      <i class="fa-li fa-brands fa-mastodon"></i>
+      Fediverse: <a href="https://social.lol/ivy">@ivy@social.lol</a>
+    </li>
+    <li>
+      <i class="fa-li fa-brands fa-github"></i>
+      GitHub: <a href="https://github.com/ivyturner">@ivyturner</a>
+    </li>
+    <li>
+      <i class="fa-li fa-brands fa-instagram"></i>
+      Instagram: <a href="https://www.instagram.com/ivyturner">@ivyturner</a>
+    </li>
+    <li>
+      <i class="fa-li fa-brands fa-twitter text-light-re dark:text-dark-re"></i>
+      Twitter: haha fuck right off, elon should get his arms broken
+    </li>
+  </ul>
+</Layout>

src/pages/contact/verify.astro

@@ -0,0 +1,23 @@
+---
+import Layout from "~/layouts/Page.astro";
+---
+
+<Layout
+  title="Verify"
+  description="Everywhere you can find me, so you can check if it's me."
+  icon="fa-solid fa-envelope"
+>
+  <ul>
+    <li>
+      Fediverse: <a href="https://social.lol/@ivy">@ivy@social.lol</a>,
+      <a href="https://social.lol/@la">@la@social.lol</a>
+    </li>
+    <li>
+      GitHub: <a href="https://github.com/ivyturner">@ivyturner</a>
+      (previously @lxjv)
+    </li>
+    <li>
+      Instagram: <a href="https://www.instagram.com/ivyturner">@ivyturner</a>
+    </li>
+  </ul>
+</Layout>

src/pages/index.astro

@@ -1,11 +1,53 @@
 ---
-import Welcome from '../components/Welcome.astro';
-import Layout from '../layouts/Layout.astro';
-
-// Welcome to Astro! Wondering what to do next? Check out the Astro documentation at https://docs.astro.build
-// Don't want to use any of this? Delete everything in this file, the `assets`, `components`, and `layouts` directories, and start fresh.
+import Layout from "~/layouts/Base.astro";
+import Header from "~/components/ui/Header.astro";
+import Footer from "~/components/ui/Footer.astro";
+import Box from "~/components/ui/Box.astro";
+import CollectionList from "~/components/lists/BlogPostList.astro";
+import NoteList from "~/components/lists/NoteList.astro";
+import StyledLink from "~/components/util/StyledLink.astro";
 ---
 
 <Layout>
-	<Welcome />
+	<Header />
+	<main>
+		<h1
+			class="text-2xl font-bold underline decoration-wavy underline-offset-8 decoration-3
+        decoration-light-pu dark:decoration-dark-pu mb-6"
+		>
+			Hi! I'm Ivy, welcome to my website!
+		</h1>
+		<p>
+			I'm a musician, student, part-time software developer and <a
+				href="/blog"
+				class="link hover:decoration-solid">writer</a
+			>. <br />
+			I mostly work with <a
+				href="https://www.rust-lang.org/"
+				class="link hover:decoration-solid">Rust</a
+			>, <a
+				href="https://www.typescriptlang.org/"
+				class="link hover:decoration-solid">Typescript</a
+			>, and web frameworks like <a
+				href="https://astro.build/"
+				class="link hover:decoration-solid">Astro</a
+			>, and <a href="https://11ty.dev/" class="link hover:decoration-solid"
+				>Eleventy</a
+			>.
+		</p>
+
+		<div class="md:flex md:flex-column gap-2">
+			<Box title="latest blog posts" description="" icon="fa-solid fa-blog">
+				<CollectionList collection="blog" limit={5} />
+				<hr class="h-px my-8 bg-light-pu dark:bg-dark-pu" />
+				<StyledLink href="/blog">see more</StyledLink>
+			</Box>
+			<Box title="latest notes" description="" icon="fa-solid fa-sticky-note">
+				<NoteList limit={5} />
+				<hr class="h-px my-8 bg-light-pu dark:bg-dark-pu border-0" />
+				<StyledLink href="/notes">see more</StyledLink>
+			</Box>
+		</div>
+	</main>
 </Layout>
+<Footer />

src/pages/notes/[id].astro

@@ -0,0 +1,24 @@
+---
+import Note from "~/layouts/Note.astro";
+import { getCollection, render } from "astro:content";
+// 1. Generate a new path for every collection entry
+export async function getStaticPaths() {
+  const posts = await getCollection("notes");
+  return posts.map((post) => ({
+    params: { id: post.id },
+    props: { post },
+  }));
+}
+// 2. For your template, you can get the entry directly from the prop
+const { post } = Astro.props;
+const { Content } = await render(post);
+---
+
+<Note
+  title={post.data.title}
+  exturl={post.data.exturl}
+  icon={post.data.icon}
+  date={post.data.date}
+>
+  <Content />
+</Note>

src/pages/notes/index.astro

@@ -0,0 +1,8 @@
+---
+import Page from "~/layouts/Page.astro";
+import NoteList from "~/components/lists/NoteList.astro";
+---
+
+<Page title="Notes" description="A collection of notes I've written." icon="fa-solid fa-note-sticky">
+  <NoteList />
+</Page>

src/pages/projects/[id].astro

@@ -0,0 +1,24 @@
+---
+import Page from "~/layouts/Page.astro";
+import { getCollection, render } from "astro:content";
+// 1. Generate a new path for every collection entry
+export async function getStaticPaths() {
+	const posts = await getCollection("projects");
+	return posts.map((post) => ({
+		params: { id: post.id },
+		props: { post },
+	}));
+}
+// 2. For your template, you can get the entry directly from the prop
+const { post } = Astro.props;
+const { Content } = await render(post);
+---
+
+<Page
+	title={post.data.name}
+	description={post.data.description}
+	date={post.data.date}
+	icon={post.data.icon}
+>
+	<Content />
+</Page>

src/pages/projects/index.astro

@@ -0,0 +1,8 @@
+---
+import Page from "~/layouts/Page.astro";
+import ProjectList from "~/components/lists/ProjectList.astro";
+---
+
+<Page title="Projects" description="stuff i'm working on" icon="fa-solid fa-wrench">
+    <ProjectList limit={1000} />
+</Page>