fix: use docs-content class for consistent light theme on SEO pages
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
@@ -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 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" />
|
<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>
|
</head>
|
||||||
<body class="docs-page">
|
<body class="docs-page">
|
||||||
|
|
||||||
@@ -181,7 +98,7 @@
|
|||||||
|
|
||||||
<!-- ===== CONTENT ===== -->
|
<!-- ===== CONTENT ===== -->
|
||||||
<main id="doc-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">← Back to Docs</a>
|
<a href="../docs.html" class="back-link">← Back to Docs</a>
|
||||||
|
|
||||||
<h1>How to Manage Multiple MikroTik Routers from One Dashboard</h1>
|
<h1>How to Manage Multiple MikroTik Routers from One Dashboard</h1>
|
||||||
|
|||||||
@@ -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 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">
|
<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>
|
</head>
|
||||||
<body class="docs-page">
|
<body class="docs-page">
|
||||||
|
|
||||||
@@ -176,7 +88,7 @@
|
|||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<main>
|
<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">← Back to Docs</a>
|
<a href="../docs.html" class="back-link">← Back to Docs</a>
|
||||||
|
|
||||||
<h1>Centralized Management for MikroTik Router Fleets</h1>
|
<h1>Centralized Management for MikroTik Router Fleets</h1>
|
||||||
|
|||||||
@@ -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 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">
|
<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>
|
</head>
|
||||||
<body class="docs-page">
|
<body class="docs-page">
|
||||||
|
|
||||||
@@ -174,7 +80,7 @@
|
|||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<main>
|
<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">← Back to Docs</a>
|
<a href="../docs.html" class="back-link">← Back to Docs</a>
|
||||||
<div class="doc-article-meta">MikroTik Configuration Management</div>
|
<div class="doc-article-meta">MikroTik Configuration Management</div>
|
||||||
<h1>How to Automate MikroTik Router Backups</h1>
|
<h1>How to Automate MikroTik Router Backups</h1>
|
||||||
|
|||||||
@@ -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 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">
|
<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>
|
</head>
|
||||||
<body class="docs-page">
|
<body class="docs-page">
|
||||||
|
|
||||||
@@ -187,7 +88,7 @@
|
|||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<main>
|
<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">← Back to Docs</a>
|
<a href="../docs.html" class="back-link">← Back to Docs</a>
|
||||||
<div class="doc-page-meta">MikroTik Monitoring — The Other Dude</div>
|
<div class="doc-page-meta">MikroTik Monitoring — The Other Dude</div>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user