add padding on mobile

azuline · Jun 9, 2024 · 3c2c0d1 · 3c2c0d1
1 parent 39bd237
commit 3c2c0d1
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 11 deletions.
diff --git a/src/posts/frontend-build-systems.tex b/src/posts/frontend-build-systems.tex
@@ -11,7 +11,7 @@
 in modern frontend?
 
 As frontend codebases grow larger, and as developer ergonomics become more important, shipping
-JavaScript source code directly to the client leads to two major problems:
+JavaScript source code directly to the client leads to two primary problems:
 
 \begin{enumerate}
   \item \textbf{Unsupported Language Features:} Because JavaScript runs in the browser, and there

diff --git a/src/posts/template.jinja b/src/posts/template.jinja
@@ -9,16 +9,18 @@
     <title>{{ meta.title }}</title>
   </head>
   <body>
-    <div class="max-w-36 mx-auto py-8">
-      <div class="display text-sm mono"><a class="decoration-none fg-primary" href="/">sunset glow</a></div>
-      <div class="py-16" />
-      <div class="flex flex-col gap-4">
-        <div class="display text-xxl medium">{{ meta.title }}</div>
-        <div class="display text-sm fg-secondary italic">{{ meta.date | formatdate }}</div>
-      </div>
-      <div class="pb-8 w-full"></div>
-      <div class="pandoc">
-        {{ body | safe }}
+    <div class="w-content mx-auto p-8">
+      <div class="max-w-36">
+        <div class="display text-sm mono"><a class="decoration-none fg-primary" href="/">sunset glow</a></div>
+        <div class="py-16" />
+        <div class="flex flex-col gap-4">
+          <div class="display text-xxl medium">{{ meta.title }}</div>
+          <div class="display text-sm fg-secondary italic">{{ meta.date | formatdate }}</div>
+        </div>
+        <div class="pb-8 w-full"></div>
+        <div class="pandoc">
+          {{ body | safe }}
+        </div>
       </div>
     </div>
   </body>