Prettier config

src/components/BlogHeader.astro

@@ -1,27 +1,27 @@
 ---
-import FormattedDate from "@components/FormattedDate.astro";
+import FormattedDate from '@components/FormattedDate.astro'
 
 interface Props {
-  title: String;
-  date: String;
+	title: String
+	date: String
 }
 
-const { title, date } = Astro.props;
+const { title, date } = Astro.props
 ---
 
 <div class="blog-header">
-  <h2>{title}</h2>
-  <h3>
-    <img src="/media/icons/calendar-2iconImage24px.svg" alt="" />
-    <FormattedDate date={date} />
-  </h3>
+	<h2>{title}</h2>
+	<h3>
+		<img src="/media/icons/calendar-2iconImage24px.svg" alt="" />
+		<FormattedDate date={date} />
+	</h3>
 </div>
 
 <style>
-  h3 {
-    display: flex;
-    align-items: center;
-    gap: 6px;
-    font-size: 1.1rem;
-  }
+	h3 {
+		display: flex;
+		align-items: center;
+		gap: 6px;
+		font-size: 1.1rem;
+	}
 </style>

src/components/Footer.astro

@@ -1,11 +1,11 @@
 ---
-const year = new Date().getFullYear();
+const year = new Date().getFullYear()
 ---
 
 <footer>
-  <p>
-    Copyright {year}, Graham Hall – Built with <a href="https://astro.build"
-      >Astro</a
-    >
-  </p>
+	<p>
+		Copyright {year}, Graham Hall – Built with <a href="https://astro.build"
+			>Astro</a
+		>
+	</p>
 </footer>

src/components/FormattedDate.astro

@@ -1,11 +1,11 @@
 ---
-import { format, add } from "date-fns";
+import { format, add } from 'date-fns'
 
 interface Props {
-  date: Date;
+	date: Date
 }
 
-const { date } = Astro.props;
+const { date } = Astro.props
 ---
 
-<span>{format(add(new Date(date), { hours: 6 }), "MMM do, y")}</span>
+<span>{format(add(new Date(date), { hours: 6 }), 'MMM do, y')}</span>

src/components/Header.astro

@@ -1,29 +1,29 @@
 ---
-const { pathname } = Astro.url;
+const { pathname } = Astro.url
 
 const navLinks = [
-  { label: "Blog", icon: "website-with-texticonImage24px", path: "/" },
-  { label: "About", icon: "usericonImage24px", path: "/about/" },
-];
+	{ label: 'Blog', icon: 'website-with-texticonImage24px', path: '/' },
+	{ label: 'About', icon: 'usericonImage24px', path: '/about/' },
+]
 ---
 
 <header>
-  <h1>Graham's Blog</h1>
-  <nav>
-    <ul>
-      {
-        navLinks.map((link) => (
-          <li>
-            <a
-              class={pathname === link.path ? "active-nav" : null}
-              href={link.path}
-            >
-              <img src={`/media/icons/${link.icon}.svg`} />
-              <span>{link.label}</span>
-            </a>
-          </li>
-        ))
-      }
-    </ul>
-  </nav>
+	<h1>Graham's Blog</h1>
+	<nav>
+		<ul>
+			{
+				navLinks.map((link) => (
+					<li>
+						<a
+							class={pathname === link.path ? 'active-nav' : null}
+							href={link.path}
+						>
+							<img src={`/media/icons/${link.icon}.svg`} />
+							<span>{link.label}</span>
+						</a>
+					</li>
+				))
+			}
+		</ul>
+	</nav>
 </header>

src/components/PostPreview.astro

@@ -1,20 +1,17 @@
 ---
-import BlogHeader from "@components/BlogHeader.astro";
+import BlogHeader from '@components/BlogHeader.astro'
 
 interface Props {
-  post: Object;
+	post: Object
 }
 
-const { post } = Astro.props;
-const { data, slug } = post;
-
-const preview = post.body.split("\n")[1];
+const { post } = Astro.props
+const { data, slug } = post
 ---
 
 <article class="post-preview">
-  <div>
-    <BlogHeader title={post.data.title} date={post.data.pubDate} />
-    <p>{preview}</p>
-    <a href={`/posts/${slug}`}>Read More</a>
-  </div>
+	<div>
+		<BlogHeader title={post.data.title} date={post.data.pubDate} />
+		<a href={`/posts/${slug}`}>Read Post</a>
+	</div>
 </article>