add mono css framework, add some boiler plate, get started on responsive design fixes

2025-07-26 04:48:30 -04:00
parent 378c8e09fb
commit bde72d0e93
25 changed files with 2077 additions and 32 deletions
--- a/_site/posts/index.html
+++ b/_site/posts/index.html
@@ -0,0 +1,125 @@
+<!DOCTYPE html>
+
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http_equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <title>
+      Llmex Blog
+    </title>
+
+    <link rel="stylesheet" href="/css/mono.css">
+    <link rel="stylesheet" href="/css/responsive.css">
+    <meta name="description" content="A simple blog built with Elixir and Tableau">
+  </head>
+
+  <body class="mono-all">
+    <aside>
+      <nav>
+        <h1><a href="/">Llmex Blog</a></h1>
+        <ul>
+          <li><a href="/">Home</a></li>
+          <li><a href="/posts">Posts</a></li>
+          <li><a href="/about">About</a></li>
+        </ul>
+      </nav>
+    </aside>
+
+    <main>
+      <h1>Latest Posts</h1>
+
+
+
+
+  <ul>
+    
+      <li>
+        <h2><a href="/2024-01-15-test-post">Test Post: Getting Started with Elixir</a></h2>
+        
+          <time datetime="2024-01-15T00:00:00Z"></time>
+        
+        
+      </li>
+    
+  </ul>
+
+
+<section class="posts-archive">
+  <p>
+    Browse through our collection of articles on Elixir, functional programming,
+    web development, and software engineering best practices.
+  </p>
+</section>
+
+<section class="posts-filter">
+  <h3>Categories</h3>
+  <div class="category-tags">
+    <a href="/posts" class="category-tag active">All Posts</a>
+    <a href="/posts/elixir" class="category-tag">Elixir</a>
+    <a href="/posts/phoenix" class="category-tag">Phoenix</a>
+    <a href="/posts/functional-programming" class="category-tag">Functional Programming</a>
+    <a href="/posts/web-development" class="category-tag">Web Development</a>
+  </div>
+</section>
+
+      <footer>
+        <p>&copy; 2025 Llmex Blog. Built with <a href="https://github.com/artalar/mono" target="_blank">Mono</a> and <a href="https://github.com/elixir-tools/tableau" target="_blank">Tableau</a></p>
+      </footer>
+    </main>
+  </body>
+
+  
+    <script>
+  function log(message) {
+    if (true) {
+      console.log(`[web_dev_utils] ${message}`)
+    }
+  }
+  function connect() {
+    try {
+      window.socket = new WebSocket('ws://' + location.host + '/ws');
+
+      window.socket.onmessage = function(e) {
+        if (e.data === "reload") {
+          log("reloading!");
+          location.reload();
+        } else if (e.data === "subscribed") {
+          log("connected and subscribed!");
+        }
+      }
+
+      window.socket.onopen = () => {
+        waitForConnection(() => {
+          log("sending 'subscribe' message");
+          window.socket.send("subscribe")
+        }
+        , 300);
+      };
+
+      window.socket.onclose = () => {
+        setTimeout(() => connect(), 500);
+      };
+
+      function waitForConnection(callback, interval) {
+        log("waiting for connection!")
+        if (window.socket.readyState === 1) {
+          callback();
+        } else {
+          log("setting a timeout")
+          setTimeout(() => waitForConnection(callback, interval), interval);
+        }
+      }
+    } catch (e) {
+      log(e);
+      setTimeout(() => connect(), 500);
+    }
+  }
+
+  log("about to connect");
+  connect();
+</script>
+
+  
+</html>