From 27df9449449f767a1f6470a18314f41179b4a24c Mon Sep 17 00:00:00 2001
From: Barrett Ruth <barrett.ruth@ramp.com>
Date: Mon, 10 Nov 2025 23:56:05 -0500
Subject: [PATCH] styling

---
 public/styles/common.css |  9 +++++++++
 public/styles/index.css  |  5 +++--
 public/styles/posts.css  | 27 ++++++++++++---------------
 3 files changed, 24 insertions(+), 17 deletions(-)

diff --git a/public/styles/common.css b/public/styles/common.css
index d3e74c4..fa7c8aa 100644
--- a/public/styles/common.css
+++ b/public/styles/common.css
@@ -217,6 +217,7 @@ footer {
   display: flex;
   justify-content: center;
   flex: 1;
+  width: 100%;
 }
 
 a {
@@ -234,6 +235,14 @@ li {
   background-size: 3vw 3vw;
 }
 
+html:has(body.graph-background) {
+  background-image:
+    linear-gradient(to right, var(--grid-color) 1px, transparent 1px),
+    linear-gradient(to bottom, var(--grid-color) 1px, transparent 1px);
+  background-size: 3vw 3vw;
+  background-color: var(--bg);
+}
+
 .terminal-cursor {
   display: inline-block;
   width: 10px;
diff --git a/public/styles/index.css b/public/styles/index.css
index 638eb5a..ecc8585 100644
--- a/public/styles/index.css
+++ b/public/styles/index.css
@@ -5,6 +5,7 @@ body {
   overscroll-behavior: none;
   height: 100vh;
   overflow: hidden;
+  overflow-x: hidden;
 }
 
 .content {
@@ -73,12 +74,12 @@ ul {
 
 @media (max-width: 768px) {
   .topics {
-    font-size: 1.8em;
+    font-size: 2em;
     padding: 0 20px;
   }
 
   .posts {
-    font-size: 1.8em;
+    font-size: 1.47em;
     padding: 0 20px;
   }
 
diff --git a/public/styles/posts.css b/public/styles/posts.css
index 09a516e..d3c16ef 100644
--- a/public/styles/posts.css
+++ b/public/styles/posts.css
@@ -3,16 +3,14 @@ li {
 }
 
 .post-wrapper {
-  display: flex;
   width: 100%;
-  justify-content: center;
-  align-items: flex-start;
   position: relative;
 }
 
 .toc-column {
   position: absolute;
-  left: calc(50% - 400px - 4rem - 200px);
+  left: 2rem;
+  top: 0;
   width: 200px;
   padding-top: 190px;
 }
@@ -24,6 +22,7 @@ li {
 .post-container {
   width: 65%;
   max-width: 800px;
+  margin: 0 auto;
 }
 
 .post-title {
@@ -163,26 +162,24 @@ article pre {
   .toc-column {
     display: none;
   }
-
-  .post-container {
-    width: 80%;
-  }
 }
 
 @media (max-width: 768px) {
+  .post-container {
+    width: 85%;
+  }
+
   .post-title {
-    font-size: 3em;
+    font-size: 1.8em;
+    margin: 30px 0;
   }
 
   .post-meta {
-    font-size: 1.6em;
+    font-size: 1.2em;
+    margin-left: 50px;
   }
 
   .post-article {
-    font-size: 1.3em;
-  }
-
-  .post-container {
-    width: 90%;
+    font-size: 1.1em;
   }
 }