added a draft post and styles for pre tags

5 files changed, 70 insertions, 30 deletions

diff --git a/_drafts/2026-09-15-the-joys-of-creating-in-the-age-of-ai.md b/_drafts/2026-09-15-the-joys-of-creating-in-the-age-of-ai.md
new file mode 100644
index 0000000..2cf1788
--- /dev/null
+++ b/_drafts/2026-09-15-the-joys-of-creating-in-the-age-of-ai.md
@@ -0,0 +1,14 @@
+---
+layout: post
+title: "The Joys of Creating in the Age of AI"
+date: 2026-09-15
+permalink: "/blog/test-post"
+author: Benjamin Sanders
+catagories: test
+#subtitle: "Blueorgia is real, y'all!"
+---
+I'll admit it - I was initially scared of AI but then I started playing with and learning how to make it work for me.
+
+Post outline:
+Thoughts on AI in general
+Purpose of still learning how to do things without AI
diff --git a/_includes/header.html b/_includes/header.html
index 19070df..2b0f47c 100644
--- a/_includes/header.html
+++ b/_includes/header.html
@@ -4,7 +4,7 @@
                     <a class="logo" href="/"><h1>Ben Sanders</h1></a>
                     <div class="nav-link">
                         <a href="/">Home</a>
-                        <a href="#about">About</a>
+                        <a href="/about">About</a>
                     </div>
                 </nav>
             </div>
diff --git a/_layouts/about.html b/_layouts/about.html
index 6044d36..074fd2c 100644
--- a/_layouts/about.html
+++ b/_layouts/about.html
@@ -7,29 +7,8 @@
                     <h2>Hello, I'm Ben!</h2>
                 </div>
                 <div>
-                    <h2>About Me</h2>
-                    <p>
-                        I'm an aspiring Network/Systems Administrator and love GNU/Linux. Technology has always been
-                        a big part of my life every since I was a kid.
-                    </p>
-                    <p>
-                        I've maintained my personal website online for more than a decade since I first bought the
-                        domain bensanders.me in 2010. I used to to use WordPress but found Jekyll and loved the idea
-                        of static websites.
-                    </p>
-                    <nav class="linktree-nav">
-                        <h2>My "Linktree"</h2>
-                        <div class="link-container">
-                            <div class="links">
-                                <ul>
-                                    <li><a href="mailto:hello@bensanders.net">E-Mail Me</a></li>
-                                    <li><a href="/assets/Benjamin Sanders hello@bensanders.net-(0x6315D57EC842B54E)-public.asc">Public Key</a></li>
-                                    <li><a href="https://www.instagram.com/thebensanders/">Instagram</a></li>
-                                    <li><a href="/feed.xml">RSS</a></li>
-                                </ul>
-                            </div>
-                        </div>
-                    </nav>
+                    <h2>{{ page.title }}</h2>
+                    {{ content }}
                 </div>
             </div>
         </section>
diff --git a/about.md b/about.md
index 159e344..7568658 100644
--- a/about.md
+++ b/about.md
@@ -1,8 +1,18 @@
 ---
 layout: about
-title: About
+title: About Me
 date: 2026-08-27
 permalink: /about
 author: Benjamin Sanders
 catagories: about
 ---
+I'm an aspiring Network/Systems Administrator and love GNU/Linux. Technology has always been a big part of my life ever since I was a kid.
+
+I've maintained my personal website online for more than a decade since I first bought the domain bensanders.me in 2010. I used to to use WordPress but found Jekyll and loved the idea of static websites.
+
+My Links Around the Web
+
+* [E-Mail Me](mailto:hello@bensanders.net)
+* [Public Key](http://localhost:4000/assets/Benjamin%20Sanders%20hello@bensanders.net-(0x6315D57EC842B54E)-public.asc)
+* [Instagram](https://www.instagram.com/thebensanders/)
+* [RSS Feed](/feed.xml)
\ No newline at end of file
diff --git a/assets/css/main.css b/assets/css/main.css
index 30dddca..04e36e2 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -30,10 +30,14 @@ h2, h3 {
   padding: 0.5em 0 1em 0;
 }
 
-/* .container {
+.about-grid {
   display: grid;
   grid-template-columns: 1fr 1fr;
-} */
+}
+
+.about-grid p {
+  padding-bottom: 10px;
+}
 
 .wrap {
     max-width: var(--max-wid);
@@ -126,14 +130,24 @@ nav {
     list-style-type: none;
 }
 
+.gear-grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr;
+}
+
+#blog ul li {
+  list-style: none;
+  padding: 0;
+  text-align: center;
+}
+
 .article-grid {
   width: 100%;
   max-width: 750px;
 }
 
-.gear-grid {
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr;
+.article-grid img {
+  width: 100%;
 }
 
 .article-grid p {
@@ -159,6 +173,29 @@ nav {
   display: block;
 }
 
+pre {
+  background-color: #333;
+  border: 1px solid black;
+  color: white;
+  page-break-inside: avoid;
+  font-family: monospace;
+  font-size: 15px;
+  line-height: 1.6;
+  margin-bottom: 1.6em;
+  max-width: 100%;
+  overflow: auto;
+  white-space: pre-wrap;
+  padding: 1em 1.5em;
+  display: block;
+  word-wrap: break-word;
+}
+
+.language-plaintext.highlighter-rouge {
+  background-color: #333;
+  border: 1px solid black;
+  color: white;
+}
+
 footer {
     width: 100%;
     max-width: 1070px;