putting the ng in defiance-ng

layouts/404.html

@@ -1,8 +1,7 @@
 {{ define "main" }}
 <div>
-  <h1>Oops!</h1>
+  <img src="https://httpcats.com/404.jpg" alt="HTTP Status Code 404 Not Found & Cats">
-  <p>We couldn't find the page you're looking for.</p>
   <br>
   <a href="/">Take me back!</a>
 </div>
-{{ end }}
+{{ end }}

layouts/_default/baseof.html

@@ -7,6 +7,5 @@
         {{- block "main" . }}{{- end }}
         </div>
         {{- partial "footer.html" . -}}
-        <script src="/js/nav-toggle-mobile.js"></script>
     </body>
 </html>

layouts/_default/list.html

@@ -13,11 +13,6 @@
     {{ else }}
     <br><br>
     <a href="{{ .RelPermalink }}">
-      {{ $regex := `<img\s*src="(.+?)">` }}
-      {{ $matches := findRE $regex .Content 1 }}
-        {{ range $matches }}
-          {{ . | safeHTML }}
-      {{ end }}
       <p>{{ .Summary }}</p>
     </a>
     {{ end }}

layouts/partials/header.html

@@ -1,24 +1,10 @@
 <div>
-    <nav id="nav">
+    <header>
-        <div id="nav-toggle-mobile">
+      <div>
-            <i>
-                <svg style="fill: #FAFAFA; margin-left: 10px;" viewBox="0 0 100 80" width="40" height="40">
-                    <title>Hamburger menu button</title>
-                    <rect width="100" height="20"></rect>
-                    <rect y="30" width="100" height="20"></rect>
-                    <rect y="60" width="100" height="20"></rect>
-                </svg>
-            </i>
-        </div>
-        <ul id="nav-list">
         {{ range .Site.Menus.main }}
-        <li class="nav-li">
+        <a href="{{ .URL }}">{{ $text := print .Name | safeHTML }}
-            <a class="nav-button" href="{{ .URL }}">
+                {{ $text }}</a>
-                {{ $text := print .Name | safeHTML }}
-                {{ $text }}
-            </a>
-        </li>
         {{ end }}
-        </ul>
+      </div>
-    </nav>
+    </header>
-</div>
+</div>

layouts/partials/metadata.html

@@ -6,6 +6,6 @@
 {{ with .Params.tags }}
 {{ range . }}
 {{ $href := print (absURL "tags/") (urlize .) }}
-<a class="tag" href="{{ $href }}">{{ . }}</a>
+<a class="tag" href="{{ $href }}">#{{ . }}</a>
+{{ end }}
 {{ end }}
-{{ end }}

static/css/style.css

@@ -1,20 +1,19 @@
 /* Dark Mode */
 @media (prefers-color-scheme: dark) {
     body {
-        background-color: #1f2023;
+        background-color: #030319;
-        color: #FAFAFA;
+        color: #C107F9;
     }
     a {
-        text-decoration: none;
+        color: #C10759;
-        color: #FF535D;
     }
     pre, code {
         background-color: #3B3C43;
         color: #E7DBDA;
     }
     .author-name {
-        background-color: #ffffff;
+        background-color: #C10759;
-        color: #F14B25;
+        color: #030319;
         border-radius: 4px;
         padding: 5px 10px;
         font-family: monospace;
@@ -28,19 +27,19 @@
 /* Light Mode */
 @media (prefers-color-scheme: light) {
     body {
-        background-color: #FAFAFA;
+        background-color: #FAFA;
+        color: #030319;
     }
     a {
         text-decoration: none;
-        color: #FF535D;
+        color: #C10000;
     }
     pre, code {
         background-color: #3B3C43;
         color: #E7DBDA;
     }
     .author-name {
-        background-color: #000000;
+      border-radius: 4px;
-        border-radius: 4px;
         padding: 5px 10px;
         font-family: monospace;
     }
@@ -96,7 +95,7 @@ footer {
 }
 
 #content {
-  margin-left: 30%;
+  margin-left: 10%;
   margin-right: 10%;
 }
 
@@ -128,16 +127,35 @@ li:first-child {
     img {
       max-width: 75%
     }
-    #nav-toggle-mobile {
-        display: none;
-    }
     footer {
         padding-left: 25%;
     }
     #nav-list {
-      background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url("/images/bgs/nav-bg.png");
+        list-style-type: none;
-      background-size: 100% 100%;
+        padding: 0;
-      width: 25%;
+        margin: 0;
+        position: relative;
+        display: flex;
+        flex-direction: column;
+        background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url("/images/bgs/nav-bg.png");
+        background-size: 100% 100%;
+        width: 100%
+    }
+    .nav-li {
+        width: 100%;
+        float: left;
+    }
+    .nav-li-show-mobile {
+        display: flex;
+    }
+    .nav-button {
+        display: block;
+    }
+    #nav-toggle-mobile {
+        align-self: flex-end;
+        display: flex;
+        cursor: pointer;
+        background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url("/images/bgs/nav-bg.png");
     }
 }
 
@@ -176,7 +194,6 @@ li:first-child {
     .nav-li {
         width: 100%;
         float: left;
-        display: none;
     }
     .nav-li-show-mobile {
         display: flex;
@@ -228,6 +245,14 @@ label {
     font-size: 22px;
 }
 
+nav-li {
+  display: inline;
+}
+
+.badge {
+  text-decoration: none;
+}
+
 #cw:checked + label {
     display: block;
 }