monoadmin/the-other-dude
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: use docs-content class for consistent light theme on SEO pages

Browse Source 
4 pages had custom inline styles using landing-page CSS variables
(--text-primary etc) which render as light-on-dark. Switched all
pages to use the shared docs-content class which uses --docs-*
variables for the light theme.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jason Staack
2026-03-15 21:33:11 -05:00
parent 478760dee4
commit 74d3da0346
4 changed files with 4 additions and 368 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
docs/website/docs/manage-multiple-mikrotik-routers.html
View File

@@ -52,89 +52,6 @@
<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>
.doc-article {
max-width: 760px;
margin: 0 auto;
padding: 80px 24px 120px;
}
.doc-article .back-link {
display: inline-block;
margin-bottom: 40px;
font-size: 14px;
text-decoration: none;
color: var(--text-muted);
}
.doc-article .back-link:hover {
color: var(--accent);
}
.doc-article h1 {
font-family: "Outfit", sans-serif;
font-weight: 700;
font-size: 2.4rem;
line-height: 1.2;
color: var(--text-primary);
margin-bottom: 36px;
}
.doc-article h2 {
font-family: "Outfit", sans-serif;
font-weight: 600;
font-size: 1.35rem;
color: var(--text-primary);
margin-top: 52px;
margin-bottom: 16px;
}
.doc-article p {
color: var(--text-secondary);
font-size: 1.05rem;
line-height: 1.75;
margin-bottom: 20px;
}
.doc-article p strong {
color: var(--text-primary);
}
.doc-article ul {
margin: 0 0 20px 0;
padding-left: 24px;
}
.doc-article li {
color: var(--text-secondary);
font-size: 1.05rem;
line-height: 1.75;
margin-bottom: 8px;
}
.doc-article li strong {
color: var(--text-primary);
}
.doc-article a {
color: var(--accent);
text-decoration: underline;
text-underline-offset: 3px;
}
.doc-article a:hover {
color: var(--text-primary);
}
.doc-article .related-links {
margin-top: 56px;
padding-top: 32px;
border-top: 1px solid var(--border);
}
.doc-article .related-links h2 {
margin-top: 0;
font-size: 1.1rem;
}
.doc-article .related-links ul {
list-style: none;
padding-left: 0;
}
.doc-article .related-links li {
margin-bottom: 10px;
}
@media (max-width: 480px) {
.doc-article h1 { font-size: 1.8rem; }
.doc-article { padding: 60px 20px 80px; }
}
</style>
</head>
<body class="docs-page">
@@ -181,7 +98,7 @@
<!-- ===== CONTENT ===== -->
<main id="doc-content">
<article class="doc-article">
<article class="docs-content" style="max-width: 800px; margin: 0 auto; padding: 60px 24px 120px;">
<a href="../docs.html" class="back-link">&larr; Back to Docs</a>
<h1>How to Manage Multiple MikroTik Routers from One Dashboard</h1>

90
docs/website/docs/mikrotik-centralized-management.html
View File

@@ -53,94 +53,6 @@
<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>
.seo-doc {
max-width: 760px;
margin: 0 auto;
padding: 80px 24px 120px;
}
.seo-doc-meta {
color: var(--text-muted);
font-size: 14px;
margin-bottom: 8px;
}
.seo-doc h1 {
font-family: "Outfit", sans-serif;
font-weight: 700;
font-size: 2.4rem;
line-height: 1.2;
color: var(--text-primary);
margin-bottom: 32px;
}
.seo-doc h2 {
font-family: "Outfit", sans-serif;
font-weight: 600;
font-size: 1.35rem;
color: var(--text-primary);
margin-top: 52px;
margin-bottom: 16px;
}
.seo-doc p {
color: var(--text-secondary);
font-size: 1.05rem;
line-height: 1.75;
margin-bottom: 20px;
}
.seo-doc p strong {
color: var(--text-primary);
}
.seo-doc ul, .seo-doc ol {
color: var(--text-secondary);
font-size: 1.05rem;
line-height: 1.75;
margin-bottom: 20px;
padding-left: 24px;
}
.seo-doc li {
margin-bottom: 8px;
}
.seo-doc li strong {
color: var(--text-primary);
}
.seo-doc a {
color: var(--accent);
text-decoration: underline;
text-underline-offset: 3px;
}
.seo-doc a:hover {
color: var(--text-primary);
}
.seo-doc .back-link {
display: inline-block;
margin-bottom: 32px;
font-size: 14px;
text-decoration: none;
color: var(--text-muted);
}
.seo-doc .back-link:hover {
color: var(--accent);
}
.related-links {
margin-top: 52px;
padding-top: 32px;
border-top: 1px solid var(--border);
}
.related-links h2 {
margin-top: 0;
}
.related-links ul {
list-style: none;
padding-left: 0;
}
.related-links li::before {
content: "→ ";
color: var(--accent);
}
@media (max-width: 480px) {
.seo-doc h1 { font-size: 1.8rem; }
.seo-doc { padding: 60px 20px 80px; }
}
</style>
</head>
<body class="docs-page">
@@ -176,7 +88,7 @@
</nav>
<main>
<article class="seo-doc">
<article class="docs-content" style="max-width: 800px; margin: 0 auto; padding: 60px 24px 120px;">
<a href="../docs.html" class="back-link">&larr; Back to Docs</a>
<h1>Centralized Management for MikroTik Router Fleets</h1>

96
docs/website/docs/mikrotik-router-backup-automation.html
View File

@@ -44,100 +44,6 @@
<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>
.doc-article {
max-width: 760px;
margin: 0 auto;
padding: 80px 24px 120px;
}
.doc-article-meta {
color: var(--text-muted);
font-size: 14px;
margin-bottom: 8px;
}
.doc-article h1 {
font-family: "Outfit", sans-serif;
font-weight: 700;
font-size: 2.5rem;
line-height: 1.2;
color: var(--text-primary);
margin-bottom: 32px;
}
.doc-article h2 {
font-family: "Outfit", sans-serif;
font-weight: 600;
font-size: 1.4rem;
color: var(--text-primary);
margin-top: 48px;
margin-bottom: 16px;
}
.doc-article p {
color: var(--text-secondary);
font-size: 1.05rem;
line-height: 1.75;
margin-bottom: 20px;
}
.doc-article p strong {
color: var(--text-primary);
}
.doc-article ul {
color: var(--text-secondary);
font-size: 1.05rem;
line-height: 1.75;
margin-bottom: 20px;
padding-left: 24px;
}
.doc-article ul li {
margin-bottom: 8px;
}
.doc-article ul li strong {
color: var(--text-primary);
}
.doc-article a {
color: var(--accent);
text-decoration: underline;
text-underline-offset: 3px;
}
.doc-article a:hover {
color: var(--text-primary);
}
.doc-article .back-link {
display: inline-block;
margin-bottom: 32px;
font-size: 14px;
text-decoration: none;
color: var(--text-muted);
}
.doc-article .back-link:hover {
color: var(--accent);
}
.doc-article code {
font-family: "Fira Code", monospace;
font-size: 0.9em;
background: rgba(42, 157, 143, 0.08);
border: 1px solid rgba(42, 157, 143, 0.15);
border-radius: 4px;
padding: 2px 6px;
color: var(--text-primary);
}
.related-guides {
margin-top: 48px;
padding: 24px;
background: rgba(42, 157, 143, 0.05);
border: 1px solid rgba(42, 157, 143, 0.15);
border-radius: 8px;
}
.related-guides h2 {
margin-top: 0;
}
.related-guides ul {
margin-bottom: 0;
}
@media (max-width: 480px) {
.doc-article h1 { font-size: 1.8rem; }
.doc-article { padding: 60px 20px 80px; }
}
</style>
</head>
<body class="docs-page">
@@ -174,7 +80,7 @@
</nav>
<main>
<article class="doc-article">
<article class="docs-content" style="max-width: 800px; margin: 0 auto; padding: 60px 24px 120px;">
<a href="../docs.html" class="back-link">&larr; Back to Docs</a>
<div class="doc-article-meta">MikroTik Configuration Management</div>
<h1>How to Automate MikroTik Router Backups</h1>

101
docs/website/docs/mikrotik-router-monitoring.html
View File

@@ -53,105 +53,6 @@
<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>
.doc-page {
max-width: 760px;
margin: 0 auto;
padding: 80px 24px 120px;
}
.doc-page-meta {
color: var(--text-muted);
font-size: 14px;
margin-bottom: 8px;
}
.doc-page h1 {
font-family: "Outfit", sans-serif;
font-weight: 700;
font-size: 2.5rem;
line-height: 1.2;
color: var(--text-primary);
margin-bottom: 32px;
}
.doc-page h2 {
font-family: "Outfit", sans-serif;
font-weight: 600;
font-size: 1.4rem;
color: var(--text-primary);
margin-top: 56px;
margin-bottom: 16px;
}
.doc-page p {
color: var(--text-secondary);
font-size: 1.05rem;
line-height: 1.75;
margin-bottom: 20px;
}
.doc-page p strong {
color: var(--text-primary);
}
.doc-page a {
color: var(--accent);
text-decoration: underline;
text-underline-offset: 3px;
}
.doc-page a:hover {
color: var(--text-primary);
}
.doc-page .back-link {
display: inline-block;
margin-bottom: 32px;
font-size: 14px;
text-decoration: none;
color: var(--text-muted);
}
.doc-page .back-link:hover {
color: var(--accent);
}
.doc-page ul {
margin: 0 0 20px 0;
padding-left: 24px;
}
.doc-page ul li {
color: var(--text-secondary);
font-size: 1.05rem;
line-height: 1.75;
margin-bottom: 8px;
}
.doc-page ul li strong {
color: var(--text-primary);
}
.doc-page code {
font-family: "Fira Code", monospace;
font-size: 0.9em;
background: rgba(42, 157, 143, 0.08);
color: var(--text-primary);
padding: 2px 6px;
border-radius: 3px;
}
.doc-related {
margin-top: 64px;
padding-top: 32px;
border-top: 1px solid var(--border);
}
.doc-related h2 {
margin-top: 0;
font-size: 1.1rem;
}
.doc-related ul {
list-style: none;
padding-left: 0;
}
.doc-related ul li {
margin-bottom: 10px;
}
.doc-related ul li a {
font-size: 1rem;
}
@media (max-width: 480px) {
.doc-page h1 { font-size: 1.8rem; }
.doc-page { padding: 60px 20px 80px; }
}
</style>
</head>
<body class="docs-page">
@@ -187,7 +88,7 @@
</nav>
<main>
<article class="doc-page">
<article class="docs-content" style="max-width: 800px; margin: 0 auto; padding: 60px 24px 120px;">
<a href="../docs.html" class="back-link">&larr; Back to Docs</a>
<div class="doc-page-meta">MikroTik Monitoring &mdash; The Other Dude</div>