diff --git a/components/blog-post.tsx b/components/blog-post.tsx
index cc5b8d7..c71ece0 100644
--- a/components/blog-post.tsx
+++ b/components/blog-post.tsx
@@ -6,14 +6,13 @@ import {
     PopoverTrigger,
 } from "@/components/ui/popover";
 import { userProfiles, websiteConfig } from '@/lib/data';
-import { cn, dayjsTz } from '@/lib/utils';
+import { dayjsTz } from '@/lib/utils';
 import { GithubIcon, LinkIcon, LinkedinIcon, MailIcon, XIcon } from 'lucide-react';
 import { useRouter } from 'next/router';
 import { Link, useConfig } from "nextra-theme-docs";
 import React from 'react';
 import { SubscribeDialog } from './blog';
 import Picture from './picture';
-import { Separator } from './ui/separator';
 
 // Reference for styling: https://github.com/vercel/turbo/blob/22585c9dcc23eb010ab01f177394358af03210d7/docs/pages/blog/turbo-1-10-0.mdx
 
@@ -170,9 +169,8 @@ export function BlogPostHeader() {
 
 export function BlogPostFooter() {
     return <>
-        <Separator className="my-8" />
         <SubscribeDialog />
-        <Separator className="my-8" />
+        <div className="mt-16"/>
         <CommentSection />
     </>
 }
diff --git a/components/blog.tsx b/components/blog.tsx
index 2f5fed1..47e5a29 100644
--- a/components/blog.tsx
+++ b/components/blog.tsx
@@ -168,7 +168,7 @@ export function SubscribeDialog() {
     }
 
     return (
-        <div className="py-4 rounded-lg">
+        <div className="p-4 ring-1 ring-ring rounded-md">
             <h2 className="text-lg font-semibold">{"Subscribe to WATcloud's blog"}</h2>
             <p className="text-sm mt-1">{"Get the latest posts delivered right to your inbox. We won't spam you!"}</p>
             <Form {...form}>
diff --git a/components/giscus-comments.tsx b/components/giscus-comments.tsx
index 85f786a..1bc95a1 100644
--- a/components/giscus-comments.tsx
+++ b/components/giscus-comments.tsx
@@ -1,7 +1,6 @@
 import Giscus from "@giscus/react";
 import websiteConfig from "@/build/fixtures/website-config.json";
 import { useTheme } from "nextra-theme-docs";
-import { Separator } from "./ui/separator";
 
 export default function CommentSection() {
   const { theme } = useTheme();
@@ -18,7 +17,7 @@ export default function CommentSection() {
   const category = websiteConfig.category;
 
   return (
-    <>
+    <div>
       {repo && repo_id && category && category_id ? (
         <Giscus
           repo={repo as `${string}/${string}`}
@@ -33,6 +32,6 @@ export default function CommentSection() {
           theme={giscusTheme}
         />
       ) : null}
-    </>
+    </div>
   );
 }
diff --git a/next.config.js b/next.config.js
index 2ad61c2..94feca9 100644
--- a/next.config.js
+++ b/next.config.js
@@ -22,7 +22,7 @@ module.exports = {
       'app',
       'components',
       'lib',
-      'theme.config.jsx',
+      'theme.config.tsx',
       "tailwind.config.js",
       "next.config.js",
       "postcss.config.js",
@@ -33,7 +33,7 @@ module.exports = {
 // Add Nextra config
 const withNextra = require('nextra')({
   theme: 'nextra-theme-docs',
-  themeConfig: './theme.config.jsx',
+  themeConfig: './theme.config.tsx',
   latex: true, // LaTeX support: https://nextra.site/docs/guide/advanced/latex
 });
   
diff --git a/pages/blog.mdx b/pages/blog.mdx
index 62d6ab7..c20795e 100644
--- a/pages/blog.mdx
+++ b/pages/blog.mdx
@@ -3,5 +3,4 @@ import { Separator } from "@/components/ui/separator";
 
 <BlogHeader />
 <BlogIndex />
-<Separator className="my-8" />
 <SubscribeDialog />
diff --git a/pages/blog/what-is-watcloud.mdx b/pages/blog/what-is-watcloud.mdx
index 0d99312..2b6a94a 100644
--- a/pages/blog/what-is-watcloud.mdx
+++ b/pages/blog/what-is-watcloud.mdx
@@ -16,10 +16,6 @@ notify_subscribers: true
 hidden: false
 ---
 
-import { BlogPostHeader, BlogPostFooter } from '@/components/blog-post'
-
-<BlogPostHeader />
-
 WATcloud's mission is to make computing resources available to everyone in an easy and fair way.
 Over the past four years, we have continuously iterated on both the hardware and software that comprise our cluster.
 On the hardware side, WATcloud consists of servers, switches, IP-KVMs[^ip-kvm], and other peripherals that form our compute cluster.
@@ -52,5 +48,3 @@ This blog post serves as a preview for what's to come. If you'd like to stay up-
 please subscribe to our newsletter below.
 
 Do you have a suggestion for a blog post topic? Please let us know below in the comment section or reach out to us on [Discord](https://discord.gg/hEX5Q4KDYN).
-
-<BlogPostFooter />
diff --git a/theme.config.jsx b/theme.config.tsx
similarity index 91%
rename from theme.config.jsx
rename to theme.config.tsx
index ab99be4..68189de 100644
--- a/theme.config.jsx
+++ b/theme.config.tsx
@@ -2,6 +2,8 @@ import { DiscordIcon } from 'nextra/icons'
 import { Bot, Heart, Code2 } from "lucide-react"
 import websiteConfig from '@/build/fixtures/website-config.json'
 import { Link } from "nextra-theme-docs"
+import { BlogPostHeader, BlogPostFooter } from '@/components/blog-post'
+import { useRouter } from 'next/router'
 
 const logo = (
   // This logo is designed in Sketch, exported as SVG, and then manually adjusted based on
@@ -115,6 +117,21 @@ const themeConfig = {
   },
   toc: {
     backToTop: true,
+  },
+  main: function Main({ children }: { children: React.ReactNode }) {
+    const router = useRouter();
+    const isBlogPost = router.pathname.startsWith("/blog/");
+
+    const header = isBlogPost && <BlogPostHeader />;
+    const footer = isBlogPost && <><BlogPostFooter /><div className="mt-16"/></>;
+
+    return (
+      <>
+        {header}
+        {children}
+        {footer}
+      </>
+    );
   }
 }