From ed07bb81c8b248bbc6fbed419481b39e68e57ec7 Mon Sep 17 00:00:00 2001
From: Amang2004 <amangupta.ans@gmail.com>
Date: Fri, 31 Oct 2025 04:22:13 +0530
Subject: [PATCH 1/3] style(css): add comprehensive dark mode styles for
 admonitions and alerts

- Defined dark mode base styles for admonitions with consistent background, border, and text colors
- Customized tip, info, caution, and danger admonitions with harmonious dark color schemes
- Ensured proper styling of admonition content including paragraphs and links in dark mode
- Added alert styles for both light and dark themes with distinct color palettes per alert type
- Applied consistent alert content styling for text and links in all themes
- Included root-level CSS variable override for alert background in dark mode
- Enhanced specificity for dark mode alert content to maintain color inheritance and link decoration
---
 opsimate-docs/src/css/custom.css | 243 +++++++++++++++++++++++++++++++
 1 file changed, 243 insertions(+)

diff --git a/opsimate-docs/src/css/custom.css b/opsimate-docs/src/css/custom.css
index 411b86c..53aac87 100644
--- a/opsimate-docs/src/css/custom.css
+++ b/opsimate-docs/src/css/custom.css
@@ -877,3 +877,246 @@ button[class*="toggle"] {
 .admonitionContent_pbrs p a:hover {
   text-decoration-color: currentColor;
 }
+
+/* ===== DARK MODE ADMONITION STYLES ===== */
+
+/* Base admonition styles for dark mode */
+[data-theme="dark"] .admonition {
+  background-color: #1a1a1a !important;
+  border: 1px solid #333333 !important;
+  color: #e6eef6 !important;
+}
+
+/* Tip admonition (Our Mission block) - Using a more harmonious indigo shade */
+[data-theme="dark"] .admonition-tip {
+  background-color: #252a4b !important; /* Darker, more muted indigo */
+  border: 1px solid #3949ab !important; /* Primary indigo color */
+  color: #e3f2fd !important;
+}
+
+[data-theme="dark"] .admonition-tip .admonitionHeading {
+  background-color: rgba(57, 73, 171, 0.2) !important; /* Transparent indigo */
+  color: #bbdefb !important; /* Light blue text */
+  border-bottom: 1px solid #3949ab !important;
+}
+
+/* Info admonition - Using a harmonious blue shade */
+[data-theme="dark"] .admonition-info {
+  background-color: #1a237e !important; /* Darker indigo-blue */
+  border: 1px solid #303f9f !important; /* Slightly lighter blue */
+  color: #e3f2fd !important;
+}
+
+[data-theme="dark"] .admonition-info .admonitionHeading {
+  background-color: rgba(48, 63, 159, 0.2) !important; /* Transparent blue */
+  color: #bbdefb !important;
+  border-bottom: 1px solid #303f9f !important;
+}
+
+/* Caution admonition - Using a harmonious amber shade */
+[data-theme="dark"] .admonition-caution {
+  background-color: #342d1d !important; /* Dark amber background */
+  border: 1px solid #5d4037 !important; /* Brownish amber border */
+  color: #ffecb3 !important;
+}
+
+[data-theme="dark"] .admonition-caution .admonitionHeading {
+  background-color: rgba(93, 64, 55, 0.2) !important; /* Transparent amber */
+  color: #ffecb3 !important;
+  border-bottom: 1px solid #5d4037 !important;
+}
+
+/* Danger admonition - Using a harmonious red shade */
+[data-theme="dark"] .admonition-danger {
+  background-color: #2d1b1b !important; /* Dark red background */
+  border: 1px solid #6d4c41 !important; /* Brownish red border */
+  color: #ffcdd2 !important;
+}
+
+[data-theme="dark"] .admonition-danger .admonitionHeading {
+  background-color: rgba(109, 76, 65, 0.2) !important; /* Transparent red */
+  color: #ffcdd2 !important;
+  border-bottom: 1px solid #6d4c41 !important;
+}
+
+/* Ensure content text is properly styled */
+[data-theme="dark"] .admonitionContent_pbrs {
+  color: inherit !important;
+}
+
+[data-theme="dark"] .admonitionContent_pbrs p {
+  color: inherit !important;
+  margin: 0 !important;
+}
+
+[data-theme="dark"] .admonitionContent_pbrs p a {
+  color: inherit !important;
+  text-decoration: underline !important;
+}
+
+/* ===== ALERT STYLES FOR BOTH LIGHT AND DARK MODES ===== */
+
+/* Base alert styles for consistent appearance */
+.alert {
+  color: #e6eef6 !important;
+}
+
+/* Light mode base styles */
+html[data-theme="light"] .alert,
+[data-theme="light"] .alert {
+  background-color: #e8f5e9 !important; /* Light green background */
+  border: 1px solid #4caf50 !important; /* Green border */
+  color: #2e7d32 !important; /* Dark green text */
+}
+
+/* Dark mode base styles */
+html[data-theme="dark"] .alert,
+[data-theme="dark"] .alert {
+  background-color: #121212 !important; /* Dark background */
+  border: 1px solid #333333 !important; /* Dark border */
+  color: #e6eef6 !important; /* Light text */
+}
+
+/* Tip alert - Light mode */
+html[data-theme="light"] .alert--tip,
+[data-theme="light"] .alert--tip {
+  background-color: #e8f5e9 !important; /* Light green background */
+  border: 1px solid #4caf50 !important; /* Green border */
+  color: #2e7d32 !important; /* Dark green text */
+}
+
+/* Info alert - Light mode */
+html[data-theme="light"] .alert--info,
+[data-theme="light"] .alert--info {
+  background-color: #e3f2fd !important; /* Light blue background */
+  border: 1px solid #2196f3 !important; /* Blue border */
+  color: #1565c0 !important; /* Dark blue text */
+}
+
+/* Caution alert - Light mode */
+html[data-theme="light"] .alert--caution,
+[data-theme="light"] .alert--caution {
+  background-color: #fff8e1 !important; /* Light amber background */
+  border: 1px solid #ffc107 !important; /* Amber border */
+  color: #ff8f00 !important; /* Dark amber text */
+}
+
+/* Danger alert - Light mode */
+html[data-theme="light"] .alert--danger,
+[data-theme="light"] .alert--danger {
+  background-color: #ffebee !important; /* Light red background */
+  border: 1px solid #f44336 !important; /* Red border */
+  color: #c62828 !important; /* Dark red text */
+}
+
+/* Tip alert - Dark mode */
+html[data-theme="dark"] .alert--tip,
+[data-theme="dark"] .alert--tip {
+  background-color: #121212 !important; /* Dark background */
+  border: 1px solid #3949ab !important; /* Indigo border */
+  color: #e3f2fd !important; /* Light text */
+}
+
+/* Info alert - Dark mode */
+html[data-theme="dark"] .alert--info,
+[data-theme="dark"] .alert--info {
+  background-color: #121212 !important; /* Dark background */
+  border: 1px solid #303f9f !important; /* Indigo blue border */
+  color: #e3f2fd !important; /* Light text */
+}
+
+/* Caution alert - Dark mode */
+html[data-theme="dark"] .alert--caution,
+[data-theme="dark"] .alert--caution {
+  background-color: #121212 !important; /* Dark background */
+  border: 1px solid #5d4037 !important; /* Brownish amber border */
+  color: #ffecb3 !important; /* Light amber text */
+}
+
+/* Danger alert - Dark mode */
+html[data-theme="dark"] .alert--danger,
+[data-theme="dark"] .alert--danger {
+  background-color: #121212 !important; /* Dark background */
+  border: 1px solid #6d4c41 !important; /* Brownish red border */
+  color: #ffcdd2 !important; /* Light red text */
+}
+
+/* Ensure alert content is properly styled */
+.alert__content {
+  color: inherit !important;
+}
+
+.alert__content p {
+  color: inherit !important;
+  margin: 0 !important;
+}
+
+.alert__content a {
+  color: inherit !important;
+  text-decoration: underline !important;
+}
+
+/* ===== DARK MODE SPECIFIC OVERRIDES (if needed) ===== */
+
+/* Dark mode alert background */
+[data-theme="dark"]:root {
+  --ifm-alert-background-color: #121212 !important;
+}
+
+/* Alternative approach - direct styling for alerts in dark mode */
+html[data-theme="dark"] .alert,
+[data-theme="dark"] .alert {
+  background-color: #121212 !important;
+  border: 1px solid #333333 !important;
+  color: #e6eef6 !important;
+}
+
+/* Tip alert (Our Mission block) - Dark mode */
+html[data-theme="dark"] .alert--tip,
+[data-theme="dark"] .alert--tip {
+  background-color: #121212 !important;
+  border: 1px solid #3949ab !important; /* Primary indigo color */
+  color: #e3f2fd !important;
+}
+
+/* Info alert - Dark mode */
+html[data-theme="dark"] .alert--info,
+[data-theme="dark"] .alert--info {
+  background-color: #121212 !important;
+  border: 1px solid #303f9f !important; /* Indigo blue */
+  color: #e3f2fd !important;
+}
+
+/* Caution alert - Dark mode */
+html[data-theme="dark"] .alert--caution,
+[data-theme="dark"] .alert--caution {
+  background-color: #121212 !important;
+  border: 1px solid #5d4037 !important; /* Brownish amber */
+  color: #ffecb3 !important;
+}
+
+/* Danger alert - Dark mode */
+html[data-theme="dark"] .alert--danger,
+[data-theme="dark"] .alert--danger {
+  background-color: #121212 !important;
+  border: 1px solid #6d4c41 !important; /* Brownish red */
+  color: #ffcdd2 !important;
+}
+
+/* Ensure alert content is properly styled with higher specificity for dark mode */
+html[data-theme="dark"] .alert__content,
+[data-theme="dark"] .alert__content {
+  color: inherit !important;
+}
+
+html[data-theme="dark"] .alert__content p,
+[data-theme="dark"] .alert__content p {
+  color: inherit !important;
+  margin: 0 !important;
+}
+
+html[data-theme="dark"] .alert__content a,
+[data-theme="dark"] .alert__content a {
+  color: inherit !important;
+  text-decoration: underline !important;
+}

From bfb9190c284e79d99b0a4c4d3d302d23072ccaa4 Mon Sep 17 00:00:00 2001
From: Amang2004 <amangupta.ans@gmail.com>
Date: Fri, 31 Oct 2025 14:35:04 +0530
Subject: [PATCH 2/3] fix: update GitHub links to point to main OpsiMate
 repository

---
 opsimate-docs/docusaurus.config.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/opsimate-docs/docusaurus.config.js b/opsimate-docs/docusaurus.config.js
index 71551d5..85debb6 100644
--- a/opsimate-docs/docusaurus.config.js
+++ b/opsimate-docs/docusaurus.config.js
@@ -58,7 +58,7 @@ module.exports = {
           position: 'right',
           value: `
             <div class="navbar-icons-container">
-              <a href="https://github.com/OpsiMate/documentation"
+              <a href="https://github.com/OpsiMate/OpsiMate"
                  target="_blank" rel="noopener noreferrer"
                  aria-label="GitHub repository"
                  class="navbar-icon-link">
@@ -134,7 +134,7 @@ module.exports = {
             {
               html: `
                   <div class="footer-community-icons">
-                    <a href="https://github.com/OpsiMate/documentation"
+                    <a href="https://github.com/OpsiMate/OpsiMate"
                       target="_blank" rel="noopener noreferrer"
                       aria-label="GitHub repository"
                       class="footer-community-icon-link">

From 65a600ef6598f4b71bfa3ee35b8bf2c615e39fdc Mon Sep 17 00:00:00 2001
From: Amang2004 <amangupta.ans@gmail.com>
Date: Thu, 6 Nov 2025 00:57:35 +0530
Subject: [PATCH 3/3] fix: remove dark mode styling changes from GitHub links
 PR

---
 opsimate-docs/src/css/custom.css | 241 -------------------------------
 1 file changed, 241 deletions(-)

diff --git a/opsimate-docs/src/css/custom.css b/opsimate-docs/src/css/custom.css
index 53aac87..6daa98e 100644
--- a/opsimate-docs/src/css/custom.css
+++ b/opsimate-docs/src/css/custom.css
@@ -878,245 +878,4 @@ button[class*="toggle"] {
   text-decoration-color: currentColor;
 }
 
-/* ===== DARK MODE ADMONITION STYLES ===== */
 
-/* Base admonition styles for dark mode */
-[data-theme="dark"] .admonition {
-  background-color: #1a1a1a !important;
-  border: 1px solid #333333 !important;
-  color: #e6eef6 !important;
-}
-
-/* Tip admonition (Our Mission block) - Using a more harmonious indigo shade */
-[data-theme="dark"] .admonition-tip {
-  background-color: #252a4b !important; /* Darker, more muted indigo */
-  border: 1px solid #3949ab !important; /* Primary indigo color */
-  color: #e3f2fd !important;
-}
-
-[data-theme="dark"] .admonition-tip .admonitionHeading {
-  background-color: rgba(57, 73, 171, 0.2) !important; /* Transparent indigo */
-  color: #bbdefb !important; /* Light blue text */
-  border-bottom: 1px solid #3949ab !important;
-}
-
-/* Info admonition - Using a harmonious blue shade */
-[data-theme="dark"] .admonition-info {
-  background-color: #1a237e !important; /* Darker indigo-blue */
-  border: 1px solid #303f9f !important; /* Slightly lighter blue */
-  color: #e3f2fd !important;
-}
-
-[data-theme="dark"] .admonition-info .admonitionHeading {
-  background-color: rgba(48, 63, 159, 0.2) !important; /* Transparent blue */
-  color: #bbdefb !important;
-  border-bottom: 1px solid #303f9f !important;
-}
-
-/* Caution admonition - Using a harmonious amber shade */
-[data-theme="dark"] .admonition-caution {
-  background-color: #342d1d !important; /* Dark amber background */
-  border: 1px solid #5d4037 !important; /* Brownish amber border */
-  color: #ffecb3 !important;
-}
-
-[data-theme="dark"] .admonition-caution .admonitionHeading {
-  background-color: rgba(93, 64, 55, 0.2) !important; /* Transparent amber */
-  color: #ffecb3 !important;
-  border-bottom: 1px solid #5d4037 !important;
-}
-
-/* Danger admonition - Using a harmonious red shade */
-[data-theme="dark"] .admonition-danger {
-  background-color: #2d1b1b !important; /* Dark red background */
-  border: 1px solid #6d4c41 !important; /* Brownish red border */
-  color: #ffcdd2 !important;
-}
-
-[data-theme="dark"] .admonition-danger .admonitionHeading {
-  background-color: rgba(109, 76, 65, 0.2) !important; /* Transparent red */
-  color: #ffcdd2 !important;
-  border-bottom: 1px solid #6d4c41 !important;
-}
-
-/* Ensure content text is properly styled */
-[data-theme="dark"] .admonitionContent_pbrs {
-  color: inherit !important;
-}
-
-[data-theme="dark"] .admonitionContent_pbrs p {
-  color: inherit !important;
-  margin: 0 !important;
-}
-
-[data-theme="dark"] .admonitionContent_pbrs p a {
-  color: inherit !important;
-  text-decoration: underline !important;
-}
-
-/* ===== ALERT STYLES FOR BOTH LIGHT AND DARK MODES ===== */
-
-/* Base alert styles for consistent appearance */
-.alert {
-  color: #e6eef6 !important;
-}
-
-/* Light mode base styles */
-html[data-theme="light"] .alert,
-[data-theme="light"] .alert {
-  background-color: #e8f5e9 !important; /* Light green background */
-  border: 1px solid #4caf50 !important; /* Green border */
-  color: #2e7d32 !important; /* Dark green text */
-}
-
-/* Dark mode base styles */
-html[data-theme="dark"] .alert,
-[data-theme="dark"] .alert {
-  background-color: #121212 !important; /* Dark background */
-  border: 1px solid #333333 !important; /* Dark border */
-  color: #e6eef6 !important; /* Light text */
-}
-
-/* Tip alert - Light mode */
-html[data-theme="light"] .alert--tip,
-[data-theme="light"] .alert--tip {
-  background-color: #e8f5e9 !important; /* Light green background */
-  border: 1px solid #4caf50 !important; /* Green border */
-  color: #2e7d32 !important; /* Dark green text */
-}
-
-/* Info alert - Light mode */
-html[data-theme="light"] .alert--info,
-[data-theme="light"] .alert--info {
-  background-color: #e3f2fd !important; /* Light blue background */
-  border: 1px solid #2196f3 !important; /* Blue border */
-  color: #1565c0 !important; /* Dark blue text */
-}
-
-/* Caution alert - Light mode */
-html[data-theme="light"] .alert--caution,
-[data-theme="light"] .alert--caution {
-  background-color: #fff8e1 !important; /* Light amber background */
-  border: 1px solid #ffc107 !important; /* Amber border */
-  color: #ff8f00 !important; /* Dark amber text */
-}
-
-/* Danger alert - Light mode */
-html[data-theme="light"] .alert--danger,
-[data-theme="light"] .alert--danger {
-  background-color: #ffebee !important; /* Light red background */
-  border: 1px solid #f44336 !important; /* Red border */
-  color: #c62828 !important; /* Dark red text */
-}
-
-/* Tip alert - Dark mode */
-html[data-theme="dark"] .alert--tip,
-[data-theme="dark"] .alert--tip {
-  background-color: #121212 !important; /* Dark background */
-  border: 1px solid #3949ab !important; /* Indigo border */
-  color: #e3f2fd !important; /* Light text */
-}
-
-/* Info alert - Dark mode */
-html[data-theme="dark"] .alert--info,
-[data-theme="dark"] .alert--info {
-  background-color: #121212 !important; /* Dark background */
-  border: 1px solid #303f9f !important; /* Indigo blue border */
-  color: #e3f2fd !important; /* Light text */
-}
-
-/* Caution alert - Dark mode */
-html[data-theme="dark"] .alert--caution,
-[data-theme="dark"] .alert--caution {
-  background-color: #121212 !important; /* Dark background */
-  border: 1px solid #5d4037 !important; /* Brownish amber border */
-  color: #ffecb3 !important; /* Light amber text */
-}
-
-/* Danger alert - Dark mode */
-html[data-theme="dark"] .alert--danger,
-[data-theme="dark"] .alert--danger {
-  background-color: #121212 !important; /* Dark background */
-  border: 1px solid #6d4c41 !important; /* Brownish red border */
-  color: #ffcdd2 !important; /* Light red text */
-}
-
-/* Ensure alert content is properly styled */
-.alert__content {
-  color: inherit !important;
-}
-
-.alert__content p {
-  color: inherit !important;
-  margin: 0 !important;
-}
-
-.alert__content a {
-  color: inherit !important;
-  text-decoration: underline !important;
-}
-
-/* ===== DARK MODE SPECIFIC OVERRIDES (if needed) ===== */
-
-/* Dark mode alert background */
-[data-theme="dark"]:root {
-  --ifm-alert-background-color: #121212 !important;
-}
-
-/* Alternative approach - direct styling for alerts in dark mode */
-html[data-theme="dark"] .alert,
-[data-theme="dark"] .alert {
-  background-color: #121212 !important;
-  border: 1px solid #333333 !important;
-  color: #e6eef6 !important;
-}
-
-/* Tip alert (Our Mission block) - Dark mode */
-html[data-theme="dark"] .alert--tip,
-[data-theme="dark"] .alert--tip {
-  background-color: #121212 !important;
-  border: 1px solid #3949ab !important; /* Primary indigo color */
-  color: #e3f2fd !important;
-}
-
-/* Info alert - Dark mode */
-html[data-theme="dark"] .alert--info,
-[data-theme="dark"] .alert--info {
-  background-color: #121212 !important;
-  border: 1px solid #303f9f !important; /* Indigo blue */
-  color: #e3f2fd !important;
-}
-
-/* Caution alert - Dark mode */
-html[data-theme="dark"] .alert--caution,
-[data-theme="dark"] .alert--caution {
-  background-color: #121212 !important;
-  border: 1px solid #5d4037 !important; /* Brownish amber */
-  color: #ffecb3 !important;
-}
-
-/* Danger alert - Dark mode */
-html[data-theme="dark"] .alert--danger,
-[data-theme="dark"] .alert--danger {
-  background-color: #121212 !important;
-  border: 1px solid #6d4c41 !important; /* Brownish red */
-  color: #ffcdd2 !important;
-}
-
-/* Ensure alert content is properly styled with higher specificity for dark mode */
-html[data-theme="dark"] .alert__content,
-[data-theme="dark"] .alert__content {
-  color: inherit !important;
-}
-
-html[data-theme="dark"] .alert__content p,
-[data-theme="dark"] .alert__content p {
-  color: inherit !important;
-  margin: 0 !important;
-}
-
-html[data-theme="dark"] .alert__content a,
-[data-theme="dark"] .alert__content a {
-  color: inherit !important;
-  text-decoration: underline !important;
-}