more responsiveness and stuff

dist/404.html

@@ -28,11 +28,9 @@
     <div class="header-container">
         <h1 class="title">BEAR.OOPS.WTF</h1>
     </div>
-    <div class="center-box">
+    <article class="article" id="article-body">
         <p class="meta">Page created: January 25, 2024</p>
         <p class="meta">Page last modified: January 25, 2024</p>
-    </div>
-    <article class="article" id="article-body">
         <h1 id="404-not-found">404: Not Found</h1>
         <p><a
         href="xertun.webp"><img src="/xertun.webp" width="200" height="200" /></a></p>

dist/418.html

@@ -28,11 +28,9 @@
     <div class="header-container">
         <h1 class="title">BEAR.OOPS.WTF</h1>
     </div>
-    <div class="center-box">
+    <article class="article" id="article-body">
         <p class="meta">Page created: January 27, 2024</p>
         <p class="meta">Page last modified: January 27, 2024</p>
-    </div>
-    <article class="article" id="article-body">
         <h1 id="418-im-a-teapot">418: I’m a teapot</h1>
         <p><a
         href="thing.webp"><img src="/thing.webp" width="200" height="200" /></a></p>

dist/blog/firstPost.html

@@ -28,11 +28,9 @@
     <div class="header-container">
         <h1 class="title">BEAR.OOPS.WTF</h1>
     </div>
-    <div class="center-box">
+    <article class="article" id="article-body">
         <p class="meta">Page created: January 26, 2024</p>
         <p class="meta">Page last modified: January 26, 2024</p>
-    </div>
-    <article class="article" id="article-body">
         <p>wowzers first post</p>
         <p><img src="/xertun.webp" width="200" height="200"></p>
         <p>me ^</p>

dist/blog/index.html

@@ -28,11 +28,9 @@
     <div class="header-container">
         <h1 class="title">BEAR.OOPS.WTF</h1>
     </div>
-    <div class="center-box">
+    <article class="article" id="article-body">
         <p class="meta">Page created: January 26, 2024</p>
         <p class="meta">Page last modified: January 26, 2024</p>
-    </div>
-    <article class="article" id="article-body">
         <p>(Sorted by date created)</p>
         <div id="latestPost">
             JavaScript must be enabled for the index to build. Otherwise visit <a href="/blogindex.txt">blogindex.txt</a> for a static list.

dist/blog/minimalMessaging.html

@@ -29,11 +29,9 @@ bear.oops.wtf</title>
     <div class="header-container">
         <h1 class="title">BEAR.OOPS.WTF</h1>
     </div>
-    <div class="center-box">
+    <article class="article" id="article-body">
         <p class="meta">Page created: March 11, 2024</p>
         <p class="meta">Page last modified: March 11, 2024</p>
-    </div>
-    <article class="article" id="article-body">
         <h1 id="introduction">Introduction</h1>
         <p>When a man is stuck with cell service for a while (and
         abysmally slow LTE at that), he starts to realize how bloated

dist/coolLinks.html

@@ -28,11 +28,9 @@
     <div class="header-container">
         <h1 class="title">BEAR.OOPS.WTF</h1>
     </div>
-    <div class="center-box">
+    <article class="article" id="article-body">
         <p class="meta">Page created: January 26, 2024</p>
         <p class="meta">Page last modified: March 4, 2024</p>
-    </div>
-    <article class="article" id="article-body">
         <p>Pages I think are cool:</p>
         <p><a href="https://cronyakatsuki.xyz" target="_blank">Crony’s
         Page</a> <a href="https://kaku.moe" target="_blank">Sensokaku’s

dist/git/index.html

@@ -28,11 +28,9 @@
     <div class="header-container">
         <h1 class="title">BEAR.OOPS.WTF</h1>
     </div>
-    <div class="center-box">
+    <article class="article" id="article-body">
         <p class="meta">Page created: January 26, 2024</p>
         <p class="meta">Page last modified: January 26, 2024</p>
-    </div>
-    <article class="article" id="article-body">
         <p>This is supposed to be the location of a Gitea instance, the
         webserver is likely misconfigured…</p>
         <p>Until next time…</p>

dist/index.html

@@ -28,11 +28,9 @@
     <div class="header-container">
         <h1 class="title">BEAR.OOPS.WTF</h1>
     </div>
-    <div class="center-box">
+    <article class="article" id="article-body">
         <p class="meta">Page created: January 6, 2024</p>
         <p class="meta">Page last modified: March 11, 2024</p>
-    </div>
-    <article class="article" id="article-body">
         <p>Hello, I’m Bear. I don’t have much to put here. I play some
         games (Tetris recently),</p>
         <p><a href="/coolLinks.html">Cool Links</a> <a

dist/snoop.html

@@ -28,11 +28,9 @@
     <div class="header-container">
         <h1 class="title">BEAR.OOPS.WTF</h1>
     </div>
-    <div class="center-box">
+    <article class="article" id="article-body">
         <p class="meta">Page created: January 6, 2024</p>
         <p class="meta">Page last modified: March 11, 2024</p>
-    </div>
-    <article class="article" id="article-body">
         
     </article>
 </body>

index.html

@@ -1,12 +0,0 @@
-<!DOCTYPE html>
-<html>
-    <head>
-        <meta charset="utf-8" />
-        <title>Webpack App</title>
-    </head>
-    <body>
-        <h1>Hello world!</h1>
-        <h2>Tip: Check your console</h2>
-    </body>
-    
-</html>

src/scss/style.scss

@@ -17,6 +17,12 @@ $gruvbox-purple: #b16286;
 $gruvbox-aqua: #689d6a;
 $gruvbox-orange: #d65d0e;
 
+* {
+    word-wrap: break-word;
+    overflow-wrap: break-word;
+    word-break: break-all;
+}
+
 body {
     font-family: Arial, sans-serif;
     font-size: 1.5em;
@@ -55,12 +61,6 @@ body {
     color: $gruvbox-dark2;
 }
 
-.center-box {
-    text-align: left;
-    width: 15%;
-    margin: auto;
-}
-
 header {
     background-color: $gruvbox-dark1;
     color: $gruvbox-fg;

src/tmpl.html

@@ -28,11 +28,9 @@
     <div class="header-container">
         <h1 class="title">BEAR.OOPS.WTF</h1>
     </div>
-    <div class="center-box">
+    <article class="article" id="article-body">
         <p class="meta">Page created: $date$</p>
         <p class="meta">Page last modified: $modified$</p>
-    </div>
-    <article class="article" id="article-body">
         $body$
     </article>
 </body>