5dd1b2f156
- Blog index at /blog/ with post listing - First post: project origin story, support expectations, SaaS teaser - Add Blog link to main site nav and footer - Update sitemap with blog URLs Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
169 lines
7.3 KiB
HTML
169 lines
7.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Blog — The Other Dude</title>
|
|
<meta name="description" content="Updates, insights, and the occasional rant about MikroTik fleet management, network operations, and building software with AI.">
|
|
<meta name="keywords" content="MikroTik blog, RouterOS fleet management, MSP blog, network management blog">
|
|
<meta name="author" content="The Other Dude">
|
|
<meta name="robots" content="index, follow">
|
|
<meta name="theme-color" content="#0F172A">
|
|
<link rel="canonical" href="https://theotherdude.net/blog/">
|
|
<link rel="icon" href="../data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><rect x='2' y='2' width='60' height='60' rx='8' fill='none' stroke='%238B1A1A' stroke-width='2'/><path d='M32 18 L46 32 L32 46 L18 32 Z' fill='%238B1A1A'/><path d='M32 19 L38 32 L32 45 L26 32 Z' fill='%232A9D8F'/><circle cx='32' cy='32' r='5' fill='%238B1A1A'/><circle cx='32' cy='32' r='2.5' fill='%232A9D8F'/></svg>">
|
|
|
|
<!-- Open Graph -->
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:title" content="Blog — The Other Dude">
|
|
<meta property="og:description" content="Updates, insights, and the occasional rant about MikroTik fleet management, network operations, and building software with AI.">
|
|
<meta property="og:url" content="https://theotherdude.net/blog/">
|
|
<meta property="og:site_name" content="The Other Dude">
|
|
|
|
<!-- Fonts -->
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Fira+Code:wght@400;500&family=Outfit:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
|
|
|
<link rel="stylesheet" href="../style.css">
|
|
<style>
|
|
.blog-index {
|
|
max-width: 720px;
|
|
margin: 0 auto;
|
|
padding: 80px 24px 120px;
|
|
}
|
|
.blog-index h1 {
|
|
font-family: "Outfit", sans-serif;
|
|
font-weight: 700;
|
|
font-size: 2.5rem;
|
|
color: var(--text-primary);
|
|
margin-bottom: 8px;
|
|
}
|
|
.blog-index .blog-subtitle {
|
|
color: var(--text-muted);
|
|
font-size: 1.05rem;
|
|
margin-bottom: 48px;
|
|
}
|
|
.blog-list {
|
|
list-style: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
.blog-list li {
|
|
border-bottom: 1px solid var(--border);
|
|
padding: 24px 0;
|
|
}
|
|
.blog-list li:first-child {
|
|
border-top: 1px solid var(--border);
|
|
}
|
|
.blog-list a {
|
|
text-decoration: none;
|
|
display: block;
|
|
}
|
|
.blog-list a:hover .blog-list-title {
|
|
color: var(--accent);
|
|
}
|
|
.blog-list-date {
|
|
color: var(--text-muted);
|
|
font-size: 13px;
|
|
margin-bottom: 4px;
|
|
}
|
|
.blog-list-title {
|
|
font-family: "Outfit", sans-serif;
|
|
font-weight: 600;
|
|
font-size: 1.25rem;
|
|
color: var(--text-primary);
|
|
margin-bottom: 6px;
|
|
transition: color 0.2s ease;
|
|
}
|
|
.blog-list-excerpt {
|
|
color: var(--text-secondary);
|
|
font-size: 0.95rem;
|
|
line-height: 1.6;
|
|
}
|
|
@media (max-width: 480px) {
|
|
.blog-index h1 { font-size: 1.8rem; }
|
|
.blog-index { padding: 60px 20px 80px; }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<nav class="site-nav site-nav--dark">
|
|
<div class="nav-inner container">
|
|
<a href="../index.html" class="nav-logo">
|
|
<svg class="nav-logo-mark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="32" height="32" aria-label="The Other Dude logo">
|
|
<rect x="2" y="2" width="60" height="60" rx="8" fill="none" stroke="#8B1A1A" stroke-width="2"/>
|
|
<rect x="6" y="6" width="52" height="52" rx="5" fill="none" stroke="#F5E6C8" stroke-width="1.5"/>
|
|
<rect x="8" y="8" width="48" height="48" rx="4" fill="#8B1A1A" opacity="0.15"/>
|
|
<path d="M32 8 L56 32 L32 56 L8 32 Z" fill="none" stroke="#8B1A1A" stroke-width="2"/>
|
|
<path d="M32 13 L51 32 L32 51 L13 32 Z" fill="none" stroke="#F5E6C8" stroke-width="1.5"/>
|
|
<path d="M32 18 L46 32 L32 46 L18 32 Z" fill="#8B1A1A"/>
|
|
<path d="M32 19 L38 32 L32 45 L26 32 Z" fill="#2A9D8F"/>
|
|
<path d="M19 32 L32 26 L45 32 L32 38 Z" fill="#F5E6C8"/>
|
|
<circle cx="32" cy="32" r="5" fill="#8B1A1A"/>
|
|
<circle cx="32" cy="32" r="2.5" fill="#2A9D8F"/>
|
|
<path d="M10 10 L16 10 L10 16 Z" fill="#2A9D8F" opacity="0.7"/>
|
|
<path d="M54 10 L54 16 L48 10 Z" fill="#2A9D8F" opacity="0.7"/>
|
|
<path d="M10 54 L16 54 L10 48 Z" fill="#2A9D8F" opacity="0.7"/>
|
|
<path d="M54 54 L48 54 L54 48 Z" fill="#2A9D8F" opacity="0.7"/>
|
|
</svg>
|
|
<span>The Other Dude</span>
|
|
</a>
|
|
<div class="nav-links">
|
|
<a href="../index.html#what-it-does" class="nav-link">Features</a>
|
|
<a href="../docs.html" class="nav-link">Docs</a>
|
|
<a href="index.html" class="nav-link">Blog</a>
|
|
<a href="https://github.com/staack/the-other-dude" class="nav-link" rel="noopener">GitHub</a>
|
|
<a href="../docs.html#quickstart" class="nav-cta">Get Started</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<main>
|
|
<div class="blog-index">
|
|
<h1>Blog</h1>
|
|
<p class="blog-subtitle">Updates, insights, and the occasional rant about MikroTik fleet management.</p>
|
|
|
|
<ul class="blog-list">
|
|
<li>
|
|
<a href="why-this-exists.html">
|
|
<div class="blog-list-date">March 15, 2026</div>
|
|
<div class="blog-list-title">Why This Exists</div>
|
|
<div class="blog-list-excerpt">The story behind The Other Dude: two decades of wanting better MikroTik fleet management, AI making it possible, and why I probably won't answer your email.</div>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</main>
|
|
|
|
<footer class="site-footer">
|
|
<div class="footer-inner container">
|
|
<div class="footer-brand">
|
|
<span class="footer-logo">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="24" height="24" aria-hidden="true" style="vertical-align: middle; margin-right: 8px;">
|
|
<rect x="2" y="2" width="60" height="60" rx="8" fill="none" stroke="#8B1A1A" stroke-width="2"/>
|
|
<rect x="6" y="6" width="52" height="52" rx="5" fill="none" stroke="#F5E6C8" stroke-width="1.5"/>
|
|
<rect x="8" y="8" width="48" height="48" rx="4" fill="#8B1A1A" opacity="0.15"/>
|
|
<path d="M32 18 L46 32 L32 46 L18 32 Z" fill="#8B1A1A"/>
|
|
<path d="M32 19 L38 32 L32 45 L26 32 Z" fill="#2A9D8F"/>
|
|
<path d="M19 32 L32 26 L45 32 L32 38 Z" fill="#F5E6C8"/>
|
|
<circle cx="32" cy="32" r="5" fill="#8B1A1A"/>
|
|
<circle cx="32" cy="32" r="2.5" fill="#2A9D8F"/>
|
|
</svg>
|
|
The Other Dude
|
|
</span>
|
|
<span class="footer-copy">© 2026 The Other Dude. All rights reserved.</span>
|
|
</div>
|
|
<nav class="footer-links">
|
|
<a href="../docs.html">Docs</a>
|
|
<a href="index.html">Blog</a>
|
|
<a href="https://github.com/staack/the-other-dude" rel="noopener">GitHub</a>
|
|
<a href="mailto:license@theotherdude.net">Licensing</a>
|
|
</nav>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Cloudflare Web Analytics --><script defer src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon='{"token": "d5f1e31cb9744c998a8f7d1303c6efef"}'></script><!-- End Cloudflare Web Analytics -->
|
|
</body>
|
|
</html>
|