chore

10 files changed, 45 insertions, 39 deletions

diff --git a/src/App.tsx b/src/App.tsx
index dba1c7c..ca7bcb4 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,10 +1,10 @@
 import { Routes, Route } from 'react-router-dom';
 import Navbar from './components/Navbar';
-import GearPage from './pages/Gear';
-import HomePage from './pages/Home';
-import ProjectsPage from './pages/Projects';
+import Gear from './pages/Gear';
+import Home from './pages/Home';
+import Projects from './pages/Projects';
 import Footer from './components/Footer';
-import NotFoundPage from './pages/404Page';
+import NotFound from './pages/404';
 import Blog from './pages/Blog';
 import Post from './pages/Post';
 
@@ -15,12 +15,12 @@ function App() {
       <Navbar />
       <section className="max-w-xl mx-auto py-5 px-4">
         <Routes>
-          <Route path="/" element={<HomePage />} />
-          <Route path="/gear" element={<GearPage />} />
-          <Route path='/projects' element={<ProjectsPage />} />
+          <Route path="/" element={<Home />} />
+          <Route path="/gear" element={<Gear />} />
+          <Route path='/projects' element={<Projects />} />
           <Route path='/blog' element={<Blog />} />
           <Route path='/blog/:slug' element={<Post />} />
-          <Route path='*' element={<NotFoundPage />} />
+          <Route path='*' element={<NotFound />} />
         </Routes>
       </section>
       <Footer />
diff --git a/src/components/CardLink.tsx b/src/components/Card.tsx
index e71cf33..e71cf33 100644
--- a/src/components/CardLink.tsx
+++ b/src/components/Card.tsx
diff --git a/src/components/ImageGalleryGrid.tsx b/src/components/Gallery.tsx
index 0b657cf..ffcf0e1 100644
--- a/src/components/ImageGalleryGrid.tsx
+++ b/src/components/Gallery.tsx
@@ -8,7 +8,7 @@ interface ImageItems {
   }>;
 }
 
-export default function ImageGalleryGrid({ images }: ImageItems) {
+export default function Gallery({ images }: ImageItems) {
   const [selectedIndex, setSelectedIndex] = useState<number | null>(null);
   const closeModal = () => setSelectedIndex(null);
   const prev = (e?: React.MouseEvent) => {
diff --git a/src/index.css b/src/index.css
index fcfe02a..4e1f7d9 100644
--- a/src/index.css
+++ b/src/index.css
@@ -3,7 +3,10 @@
 @custom-variant dark (&:where(.dark, .dark *));
 
 @layer base {
-  body {
+
+  html,
+  body,
+  #root {
     @apply bg-white dark:bg-black/95;
   }
 
@@ -31,15 +34,15 @@
     @apply text-xl font-semibold dark:text-gray-200;
   }
 
-  article>*>p {
+  .post p {
     @apply mb-4 leading-relaxed;
   }
 
-  article>*>ul {
+  .post ul {
     @apply list-disc pl-6 space-y-1;
   }
 
-  article>*>*>img {
+  .post img {
     @apply mx-auto mb-4 w-64 rounded-lg shadow;
   }
 
@@ -51,7 +54,7 @@
     @apply underline text-purple-500;
   }
 
-  pre {
+  .post pre {
     @apply whitespace-pre overflow-x-auto max-w-full max-h-80 rounded-lg border p-2 my-2 border-neutral-300 dark:border-neutral-800 bg-neutral-100 dark:bg-neutral-900;
   }
 
diff --git a/src/pages/404Page.tsx b/src/pages/404.tsx
index d7bfa10..d9eed89 100644
--- a/src/pages/404Page.tsx
+++ b/src/pages/404.tsx
@@ -1,7 +1,7 @@
 import { useNavigate } from "react-router-dom";
 import { useEffect } from "react";
 
-export default function NotFoundPage() {
+export default function NotFound() {
   const navigate = useNavigate();
 
   useEffect(() => {
diff --git a/src/pages/Blog.tsx b/src/pages/Blog.tsx
index 47b44d6..fb07fb1 100644
--- a/src/pages/Blog.tsx
+++ b/src/pages/Blog.tsx
@@ -1,6 +1,6 @@
-import CardLink from "../components/CardLink";
+import Card from "../components/Card";
 
-interface PostMeta {
+interface Meta {
   slug: string;
   title: string;
   date: string;
@@ -10,13 +10,13 @@ interface PostMeta {
 
 const postFiles = import.meta.glob("../blog/*.md", { eager: true }) as Record<
   string,
-  { attributes: Omit<PostMeta, "slug"> }
+  { attributes: Omit<Meta, "slug"> }
 >;
 
-const posts: PostMeta[] = Object.entries(postFiles)
+const posts: Meta[] = Object.entries(postFiles)
   .map(([path, mod]) => ({
     slug: path.split("/").pop()!.replace(".md", ""),
-    ...(mod.attributes as Omit<PostMeta, "slug">),
+    ...(mod.attributes as Omit<Meta, "slug">),
   }))
   .sort(
     (a, b) => new Date(b.date).getTime() - new Date(a.date).getTime()
@@ -24,18 +24,19 @@ const posts: PostMeta[] = Object.entries(postFiles)
 
 export default function Blog() {
   return (
-    <section className="container mx-auto px-4 py-10">
-      <h1 className="text-4xl font-bold mb-8">Blog</h1>
+    <>
+      <title>߸ projects</title>
+      <h1>Blog</h1>
       
       {posts.map((post) => (
         <a key={post.slug} href={`/blog/${post.slug}`} className="block py-1">
-          <CardLink
+          <Card
             title={post.title}
             body={post.excerpt}
             imgSrc={post.cover}
           />
         </a>
       ))}
-    </section>
+    </>
   );
 }
diff --git a/src/pages/Gear.tsx b/src/pages/Gear.tsx
index dbbcdfb..a1984ee 100644
--- a/src/pages/Gear.tsx
+++ b/src/pages/Gear.tsx
@@ -1,4 +1,4 @@
-import CardLink from '../components/CardLink';
+import Card from '../components/Card';
 
 import {
   dailyDrivers,
@@ -14,7 +14,7 @@ function PartsGroup({ title, parts }: { title?: string; parts: Part[] }) {
       <ul className="space-y-2">
         {parts.map((p) => (
           <li key={p.name}>
-            <CardLink
+            <Card
               title={p.name}
               body={p.description}
               href={p.url}
@@ -27,7 +27,7 @@ function PartsGroup({ title, parts }: { title?: string; parts: Part[] }) {
   );
 }
 
-export default function GearPage() {
+export default function Gear() {
   return (
     <>
       <title>߸ gear</title>
@@ -40,4 +40,4 @@ export default function GearPage() {
       <PartsGroup title="NAS" parts={nasParts} />
     </>
   );
-}
\ No newline at end of file
+}
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
index 2048122..9b73c05 100644
--- a/src/pages/Home.tsx
+++ b/src/pages/Home.tsx
@@ -1,6 +1,6 @@
-import ImageGalleryGrid from "../components/ImageGalleryGrid";
+import Gallery from "../components/Gallery";
 
-export default function HomePage() {
+export default function Home() {
   return (
     <>
       <title>߸ hi</title>
@@ -10,7 +10,7 @@ export default function HomePage() {
         I have a passion for hardware and software, studying computer science. Currently building own 3d printing projects and learning nix.
       </p>
 
-      <ImageGalleryGrid
+      <Gallery
         images={[
           { src: "/images/3ds.webp", alt: "Nintendo 3DS", id: 1 },
           { src: "/images/esp32.webp", alt: "ESP 32", id: 2 },
@@ -33,4 +33,4 @@ export default function HomePage() {
       </ul>
     </>
   );
-}
\ No newline at end of file
+}
diff --git a/src/pages/Post.tsx b/src/pages/Post.tsx
index b2b1d5b..76396ae 100644
--- a/src/pages/Post.tsx
+++ b/src/pages/Post.tsx
@@ -26,7 +26,7 @@ export default function Post() {
   const { attributes: meta, ReactComponent: Content } = post;
 
   return (
-    <article>
+    <>
       <a href="/blog" className="no-underline hover:underline">
         ← Back
       </a>
@@ -41,7 +41,9 @@ export default function Post() {
 
       <h1>{meta.title}</h1>
       <p className="text-sm text-zinc-500 mb-8">{formDate.format(new Date(meta.date))}</p>
-      <Content />
-    </article>
+      <div className="post">
+        <Content />
+      </div>
+    </>
   );
 }
diff --git a/src/pages/Projects.tsx b/src/pages/Projects.tsx
index d49a3d2..973eaa0 100644
--- a/src/pages/Projects.tsx
+++ b/src/pages/Projects.tsx
@@ -1,7 +1,7 @@
-import CardLink from '../components/CardLink';
+import Card from '../components/Card';
 import { projects, type Project } from '../data/projects';
 
-export default function ProjectsPage() {
+export default function Projects() {
   return (
     <>
       <title>߸ projects</title>
@@ -10,7 +10,7 @@ export default function ProjectsPage() {
       <ul className="space-y-2">
         {projects.map((p: Project) => (
           <li key={p.name}>
-            <CardLink
+            <Card
               title={p.name}
               body={p.description}
               href={p.url}
@@ -21,4 +21,4 @@ export default function ProjectsPage() {
       </ul>
     </>
   );
-}
\ No newline at end of file
+}