Enhanced MkDocs configuration with updated theme settings, custom styling, and added a CI workflow for deployment.

Author: nikan-negaresh-informed

.github/workflows/mkdocs.yml

@@ -0,0 +1,25 @@
+name: ci
+on:
+  push:
+    branches:
+      - feature/DPAV-1838
+permissions:
+  contents: write
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v5
+      - name: Configure Git Credentials
+        uses: actions/setup-python@v5
+        with:
+          python-version: 3.x
+      - run: echo "cache_id=$(date --utc '+%V')" >> $GITHUB_ENV
+      - uses: actions/cache@v4
+        with:
+          key: mkdocs-material-${{ env.cache_id }}
+          path: ~/.cache
+          restore-keys: |
+            mkdocs-material-
+      - run: pip install mkdocs-material
+      - run: mkdocs gh-deploy --force

docs/stylesheets/extra.css

@@ -16,6 +16,49 @@
   --md-primary-fg-color--dark: #00152e;
 }
 
+/* Increase logo size in the header */
+.md-header__button.md-logo img,
+.md-header__button.md-logo svg {
+  height: 0.8rem; /* default is ~1.8rem; increase for better visibility */
+  width: auto;
+}
+
+/* Improve link readability in dark (slate) mode */
+[data-md-color-scheme="slate"] .md-typeset a:link {
+  /* Light blue for high contrast on dark backgrounds */
+  color: #8ab4f8;
+}
+[data-md-color-scheme="slate"] .md-typeset a:visited {
+  /* Slightly desaturated/lighter to distinguish visited links */
+  color: #b3c7ff;
+}
+[data-md-color-scheme="slate"] .md-typeset a:hover,
+[data-md-color-scheme="slate"] .md-typeset a:focus {
+  color: #c4ddff;
+}
+/* Also adjust visited links in navigation (sidebar, toc) */
+[data-md-color-scheme="slate"] .md-nav__link:visited {
+  color: #b3c7ff;
+}
+
+/* Custom primary color for Material for MkDocs */
+
+/* Light (default) scheme */
+:root {
+  /* Primary brand color used for header, active nav, etc. */
+  --md-primary-fg-color: #002244;
+  /* Optional variants (used for hover/focus states) */
+  --md-primary-fg-color--light: #2e4a6f;
+  --md-primary-fg-color--dark: #00152e;
+}
+
+/* Dark (slate) scheme */
+[data-md-color-scheme="slate"] {
+  --md-primary-fg-color: #002244;
+  --md-primary-fg-color--light: #2e4a6f;
+  --md-primary-fg-color--dark: #00152e;
+}
+
 /* Increase logo size in the header */
 .md-header__button.md-logo img,
 .md-header__button.md-logo svg {
@@ -40,3 +83,38 @@
 [data-md-color-scheme="slate"] .md-nav__link:visited {
   color: #b3c7ff;
 }
+
+/* Footer styling: background #00152e and white text/links */
+.md-footer,
+.md-footer__inner,
+.md-footer-meta,
+.md-footer-meta__inner {
+  background-color: #00152e !important;
+}
+
+/* Ensure all footer text is white for readability */
+.md-footer,
+.md-footer * {
+  color: #ffffff !important;
+}
+
+/* Footer links states */
+.md-footer a,
+.md-footer a:visited {
+  color: #ffffff !important;
+  text-decoration: underline;
+}
+
+.md-footer a:hover,
+.md-footer a:focus {
+  color: #ffffff !important;
+  opacity: 0.85;
+  text-decoration: underline;
+}
+
+/* Reduce header logo size for better balance */
+.md-header__button.md-logo img,
+.md-header__button.md-logo svg {
+  height: 1.6rem !important; /* smaller than the previous 3.6rem */
+  width: auto;
+}

mkdocs.yml

@@ -3,29 +3,32 @@ site_description: Federator is a middleware solution for connecting different tr
 site_author: NDTP
 site_url: https://www.ndtp.co.uk
 repo_url: https://github.com/National-Digital-Twin/federator
-features:
-    - content.action.edit
-    - content.action.view
+edit_uri: edit/main/docs/
+theme:
+  features:
     - content.code.annotate
     - content.code.copy
     - content.code.select
     - content.tooltips
-    - navigation.tabs
-    - navigation.sections
-    - navigation.footer
     - navigation.indexes
-    - navigation.top
     - navigation.tracking
     - search.highlight
     - search.share
     - search.suggest
+    - search.share
+    - navigation.instant
+    - navigation.instant.prefetch
+    - navigation.instant
+    - navigation.instant.progress
+    - navigation.path
     - toc.follow
-theme:
+
+
   icon:
     repo: fontawesome/brands/github
-  lang: en
+  language: en
   name: material
-  logo: assets/ndtp-logo.png
+  logo: assets/light-page_header_logo.png
   favicon: assets/android-chrome-512x512-1-150x150.png
   palette:
     - media: "(prefers-color-scheme: light)"
@@ -44,22 +47,34 @@ theme:
     text: Roboto
     code: Roboto Mono
 markdown_extensions:
+  - admonition
+  - pymdownx.details
+  - pymdownx.superfences
+  - tables
   - pymdownx.highlight:
       anchor_linenums: true
       line_spans: __span
       pygments_lang_class: true
   - pymdownx.inlinehilite
   - pymdownx.snippets
   - pymdownx.superfences
+  - pymdownx.superfences:
+      custom_fences:
+        - name: mermaid
+          class: mermaid
+          format: !!python/name:pymdownx.superfences.fence_code_format
 extra_css:
   - stylesheets/extra.css
 extra:
   version:
     provider: mike
+  generator: false
 plugins:
+  - include-markdown:
+        rewrite_relative_urls: true
+  - search
   - git-revision-date-localized:
         enabled: true
 copyright: |
       ©Crown Copyright 2025. This work has been developed by the National Digital Twin Programme and is legally attributed to the Department for Business and Trade (UK) as the governing entity.  
-      <p>Licensed under the Open Government Licence v3.0.</p>