chore: stylistic changes

src/pages/blog/[...slug].astro

@@ -2,8 +2,7 @@
 import { type CollectionEntry, getCollection, getEntry } from 'astro:content'
 import Layout from '@layouts/Layout.astro'
 import Container from '@components/Container.astro'
-import FormattedDate from '@components/FormattedDate.astro'
-import { readingTime } from '@lib/utils'
+import { formatDate, readingTime } from '@lib/utils'
 import PostNavigation from '@components/PostNavigation.astro'
 import TableOfContents from '@components/TableOfContents.astro'
 import { Image } from 'astro:assets'
@@ -104,7 +103,7 @@ if (
           alt={post.data.title}
           width={1200}
           height={630}
-          class="mb-8 rounded-lg object-cover shadow-lg"
+          class="mb-8 rounded-xl object-cover shadow-lg"
         />
       )
     }
@@ -144,7 +143,7 @@ if (
             </>
           )
         }
-        <FormattedDate date={post.data.date} />
+        <span>{formatDate(post.data.date)}</span>
         <Separator orientation="vertical" className="h-4" />
         <span>{readingTime(post.body)}</span>
       </div>

src/pages/index.astro

@@ -6,6 +6,7 @@ import BlogCard from '@components/BlogCard.astro'
 import { buttonVariants } from '@/components/ui/button'
 import { getCollection } from 'astro:content'
 import Link from '@components/Link.astro'
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
 
 const blog = (await getCollection('blog'))
   .filter((post) => !post.data.draft)
@@ -16,8 +17,17 @@ const blog = (await getCollection('blog'))
 <Layout title="Home" description="Home">
   <Container>
     <section class="space-y-6">
-      <div class="min-w-full">
-        <h1 class="mb-4 text-3xl font-bold">Occasionally, less is more</h1>
+      <Card>
+        <CardHeader>
+          <CardTitle className="text-3xl">er·u·dite</CardTitle>
+          <CardDescription>/ˈer(y)əˌdīt/</CardDescription>
+        </CardHeader>
+        <CardContent>
+          <p class="font-medium">adjective</p>
+          <p>having or showing great knowledge or learning.</p>
+        </CardContent>
+      </Card>
+      <div class="mt-8">
         <p class="prose min-w-full dark:prose-invert">
           {SITE.TITLE} is an opinionated, no-frills static blogging template built
           with Astro.