Cleanup styling, reduce bandwidth overhead

6 files changed, 70 insertions, 112 deletions

diff --git a/footer.html b/footer.html
index af56243..c47f393 100644
--- a/footer.html
+++ b/footer.html
@@ -4,7 +4,7 @@
     <p>Looking to help this site? Consider <a href="/contribute">contributing towards hosting costs</a>.</p>
     <nav id="menu">
         <ul>
-            <li><a href="/">Home</a></li><li><a href="/about/">About</a></li><li><a href="/projects/">Projects</a></li><li><a href="/uses/">Uses</a></li><li><a href="/wiki/">Wiki</a></li><li><a href="/resume/">Resume</a></li><li><a href="/colophon/">Colophon</a></li><li><a href="/now/">Now</a></li><li><a href="/contribute/">Contribute</a></li><li><a href="/recipes/">Recipes</a></li><li><a href="/index.rss">RSS</a></li><li><a href="#top">&uarr; Top</a></li>
+            <li><a href="/">Home</a></li><li><a href="/about/">About</a></li><li><a href="/posts/">Posts</a></li><li><a href="/projects/">Projects</a></li><li><a href="/uses/">Uses</a></li><li><a href="/wiki/">Wiki</a></li><li><a href="/resume/">Resume</a></li><li><a href="/colophon/">Colophon</a></li><li><a href="/now/">Now</a></li><li><a href="/contribute/">Contribute</a></li><li><a href="/recipes/">Recipes</a></li><li><a href="/index.rss">RSS</a></li><li><a href="#top">&uarr; Top</a></li>
         </ul>
     </nav>
     <small>
diff --git a/header.html b/header.html
index 1770203..fe0c0c6 100644
--- a/header.html
+++ b/header.html
@@ -7,12 +7,12 @@
 	<link rel="icon" href="data:,">
 	<title>{{TITLE}}</title>
 	<link href="/index.rss" type="application/rss+xml" rel="alternate" title="RSS feed for blog posts" />
-	<link rel="stylesheet" href="/public/style.css?v=1.4">
+	<link rel="stylesheet" href="/public/style.css?v=1.5">
 </head>
 
 <header id="top">
 	<nav>
-		<a href="/"><b>btxx.org</b></a><a href="#menu">Menu</a>
+		<a href="#menu">Menu &darr;</a>
 	</nav>
 </header>
 
diff --git a/pages/now.md b/pages/now.md
index 5d4bd7b..d3cfd7c 100644
--- a/pages/now.md
+++ b/pages/now.md
@@ -2,14 +2,15 @@
 
 This page is based off the [now page concept](https://nownownow.com/about) by Derek Sivers.
 
+Last updated March 2025.
+
 ## Work
 
 - Working as a UX designer & fullstack developer hybrid
 
 ## Life
 
-- Raising my three children (aged 6, 4 and 2 respectively) with my wonderful wife
+- Raising my three children (aged 6, 5 and 3 respectively) with my wonderful wife
 - Trying to contribute more to open source projects that I actively use
-- Slowly teaching myself C & RSpec
 - Advancing my knowledge of Ruby
-- Currently playing Halo 2 on the original Xbox! (Thanks Insignia!)
+- Currently playing through Monster Hunter Generations Ultimate (Switch)
diff --git a/pages/resume.md b/pages/resume.md
index 6cadb4d..5060873 100644
--- a/pages/resume.md
+++ b/pages/resume.md
@@ -5,10 +5,6 @@ bt@btxx.org
 
 As a designer/developer hybrid, I help software companies improve their user experience and ship more performant products.
 
-## Skills & Languages
-
-Core programming languages are HTML, CSS, JavaScript, and Ruby. For design work, my preferred tools are Sketch, GIMP, and Figma. I also enjoy tinkering with basic shell scripts and Unix systems.
-
 <div class="table-container">
 <table>
   <caption>Experience</caption>
@@ -49,6 +45,10 @@ Core programming languages are HTML, CSS, JavaScript, and Ruby. For design work,
 </table>
 </div>
 
+## Skills & Languages
+
+Core programming languages are HTML, CSS, JavaScript, and Ruby. For design work, my preferred tools are Sketch, GIMP, and Figma. I also enjoy tinkering with basic shell scripts and Unix systems.
+
 <div class="table-container">
 <table>
   <caption>Education</caption>
@@ -61,7 +61,7 @@ Core programming languages are HTML, CSS, JavaScript, and Ruby. For design work,
   </thead>
   <tbody>
     <tr>
-      <td>Durham College</td>
+      <td>Ontario Tech</td>
       <td>Multimedia Design</td>
       <td>2009</td>
     </tr>
diff --git a/posts/mongodb-arch.md b/posts/mongodb-arch.md
index 1b74463..41e3110 100644
--- a/posts/mongodb-arch.md
+++ b/posts/mongodb-arch.md
@@ -20,7 +20,7 @@ Follow the instructions and you'll be good to go. Don't forget to create the `/d
 
 ~~~sh
 mkdir -p /data/db/
-chmod -R 777 /date/db
+chmod -R 777 /data/db
 ~~~
 
 ## What About My "Tools"?
diff --git a/public/style.css b/public/style.css
index 1ed7723..3bc40da 100644
--- a/public/style.css
+++ b/public/style.css
@@ -2,41 +2,17 @@
     box-sizing: border-box;
 }
 
-@font-face {
-  font-family: 'Fira Sans';
-  src: url('/public/fonts/FiraSans-Regular.woff2') format('woff2');
-  font-weight: 400;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Fira Sans';
-  src: url('/public/fonts/FiraSans-Medium.woff2') format('woff2');
-  font-weight: 700;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Fira Sans';
-  src: url('/public/fonts/FiraSans-Italic.woff2') format('woff2');
-  font-weight: 400;
-  font-style: italic;
-}
-
 body {
-    background-attachment: fixed;
-    background-color: #f6fff8;
-    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%236d6d6d' fill-opacity='0.4' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
-	font-family: "Fira Sans", sans-serif;
-    line-height: 1.4;
-    margin: 0 auto;
-    max-width: 800px;
-    padding: 12px;
+  font-family: georgia, serif;
+  font-size: large;
+  line-height: 1.5;
+  margin: 0 auto;
+  max-width: 40em;
+  padding: 0 1em;
 }
 
 h1 {
     line-height: 1.2;
-    font-weight: normal;
     margin-bottom: 10px;
     margin-top: 0;
 }
@@ -56,30 +32,26 @@ h2,h3,h4,h5,h6 {
 }
 
 a {
-    color: forestgreen;
+    color:#00e;
 }
 a:visited {
-    color: #174521;
+    color: #518;
 }
-a:hover, a:active {
-    color: black;
+a:hover, a:focus {
+    color: #03f;
 }
 
-header, main, footer {
-    background: #f9f9f9;
-    border: 1px solid #2d2d2d;
-    box-shadow: 5px 5px 0px 0px #2d2d2d;
-    margin-bottom: 1.2rem;
-    padding: 16px;
+.flr {
+    float: right;
+    padding: 0 0 8px 8px;
 }
 
-header nav {
-    align-items: center;
-    display: flex;
-    justify-content: space-between;
+.w-100 {
+    max-width: 100px;
 }
-header nav a:first-of-type {
-    font-size: 120%;
+
+header {
+    margin: 1.5rem 0;
 }
 
 .posts {
@@ -95,6 +67,8 @@ header nav a:first-of-type {
 
 .alert {
     border: 1px solid;
+    font-family: sans-serif;
+    font-size: medium;
     margin: 10px 0;
     padding: 8px;
 }
@@ -132,15 +106,6 @@ p code, ul code, ol code, blockquote code {
     margin: 0 0 10px -30px;
 }
 
-.flr {
-    float: right;
-    padding: 0 0 8px 8px;
-}
-
-.w-100 {
-    max-width: 100px;
-}
-
 pre {
     background: #f1f1f1;
     overflow: auto;
@@ -150,6 +115,7 @@ pre {
 blockquote {
     border-left: 4px solid;
     color: brown;
+    font-style: italic;
     margin: 1rem 0;
     padding: 0 0 0 8px;
 }
@@ -165,6 +131,11 @@ table {
     text-align: left;
     width: 100%;
 }
+table caption {
+    border-bottom: 1px solid;
+    font-size: 120%;
+    text-align: left;
+}
 table th, table td {
     padding: 4px;
 }
@@ -173,7 +144,7 @@ table tr:nth-of-type(even) {
 }
 
 figure {
-    margin: 3rem;
+    margin: 3rem 0;
 }
 figure img {
     display: block;
@@ -181,7 +152,8 @@ figure img {
     padding: 4px;
 }
 figure figcaption {
-    font-size: 90%;
+    font-size: medium;
+    font-style: italic;
     padding: 8px;
     text-align: center;
 }
@@ -194,6 +166,9 @@ figure figcaption {
 }
 
 footer {
+    border-top: 1px dotted;
+    margin: 4rem 0 2rem;
+    padding: 2rem 0;
     position: relative;
 }
 footer > p {
@@ -205,53 +180,35 @@ footer nav ul {
 }
 footer nav ul li {
     display: inline-block;
-    margin: 0 10px 10px 0;
+    margin: 0 15px 10px 0;
 }
 
-@media(max-width:600px) {
-    figure {
-      margin: 3rem 1rem;
-    }
-}
-
-@media(prefers-color-scheme: dark) {
-  body {
-    background-color: #787878;
-    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%23fff' fill-opacity='0.3' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
-  }
-  a {
-    color: goldenrod;
+@media (prefers-color-scheme: dark) {
+    a {
+        color: #9bf;
     }
     a:visited {
-        color: darkgoldenrod;
+        color: #a9f;
+    }
+    a:hover, a:focus {
+        color: #9cf;
+    }
+    pre {
+        background: black;
+    }
+    p code, ul code, ol code, blockquote code {
+        background: black;
+    }
+    table tr:nth-of-type(even) {
+        background: black;
+    }
+    #markdown-toc {
+        background: black;
+    }
+    #markdown-toc::before {
+        border-bottom: 1px solid #ddd;
     }
-    a:hover, a:active {
-        color: yellow;
+    blockquote {
+        color: lightgoldenrodyellow;
     }
-  h2, #markdown-toc::before {
-    border-color: #aaa;
-  }
-  header, main, footer {
-    background: #424242;
-    border-color: black;
-    box-shadow: 5px 5px 0px 0px black;
-  }
-  code, pre {
-    background: #000 !important;
-  }
-  blockquote {
-    color: lightyellow;
-  }
-  table tr:nth-of-type(even) {
-    background: #000;
-  }
-  .alert code {
-    background: none !important;
-  }
-  #markdown-toc {
-    background: #000;
-  }
-  main:before, main:after {
-    display: none;
-  }
 }
\ No newline at end of file