MkDocs DAP Theme

A beautiful, production-ready MkDocs theme.
Dark by default. Light when you want. Always fast.

---

Features

🌙 Dark & Light mode	User-toggleable, persisted with no flash on load
🎨 5 accent colors	Green, cyan, purple, orange, red — all adapt to both schemes
🗂 Two nav menus	Sidebar from nav:, top bar from extra.navmenu: — independent
♾️ Unlimited nesting	Dropdowns and sidebar sections nest as deep as you need
🔍 Syntax highlighting	Full Pygments token map, dark and light
📈 Google Analytics	GA4 + UA, with GDPR/LOPD cookie consent banner
🔎 SEO ready	Open Graph, Twitter Cards, JSON-LD, canonical, sitemap
🌐 i18n	English and Spanish built-in, easy to extend
⭐ GitHub button	GitHub repository ref
📋 Copy code	One-click copy on every code block
📦 Fully modular	CSS files · JS files · Jinja2 partials

---

Quick start

1. Install dependencies

pip install mkdocs pymdown-extensions

2. Clone or download

git clone https://github.com/davidalvarezp/mkdocs-dap.git
cd mkdocs-dap

Or download the latest release ZIP and copy the themes/dap folder into your project.

3. Configure

Minimum mkdocs.yml:

site_name: My Project

theme:
  name: null
  custom_dir: themes/dap

4. Run

mkdocs serve

Open http://127.0.0.1:8000.

---

Configuration overview

extra:
  language: en              # en | es | add yours
  color_scheme: dark        # dark | light
  accent_color: green       # green | cyan | purple | orange | red

  sidebar:
    image: assets/img/avatar.png
    name: My Project
    tagline: Great documentation
    links:
      - platform: github
        url: https://github.com/user/repo
      - platform: twitter
        url: https://twitter.com/user
      # Add your socials

  navmenu:                  # Independent top navigation menu
    - title: Home
      url: /
    - title: Docs
      children:
        - title: Install
          url: /getting-started/install/

  analytics:
    provider: google
    property: G-XXXXXXXXXX
    cookie_consent: true    # GDPR/LOPD banner
    privacy_policy: /privacy/

  seo:
    og_image: assets/img/og-default.png
    twitter_site: "@yourhandle"

  social:
    - platform: github
      url: https://github.com/user

Full reference: reference/configuration

---

File structure

themes/dap/
├── main.html                  Root template
├── partials/
│   ├── analytics.html         Google Analytics
│   ├── cookie-banner.html     GDPR consent banner
│   ├── footer.html            Footer
│   ├── header.html            Sticky header + theme panel
│   ├── icons.html             Shared social SVG macro
│   ├── page-nav.html          Prev/Next navigation
│   ├── seo.html               All SEO meta tags
│   ├── sidebar.html           Profile card + collapsible nav
│   ├── toc.html               Table of contents
│   └── topnav.html            Top navigation bar
└── assets/
    ├── css/
    │   ├── vars.css           Design tokens + color schemes
    │   ├── sidebar.css
    │   ├── header.css
    │   ├── topnav.css
    │   ├── content.css
    │   ├── footer.css
    │   ├── highlight.css      Pygments theme
    │   └── cookie-banner.css
    └── js/
        ├── theme-toggle.js
        ├── sidebar.js
        ├── topnav.js
        ├── toc.js
        ├── copy-code.js
        ├── github-btn.js
        └── cookie-banner.js

---

Documentation

Full documentation is included in the docs/ folder and is deployed with the theme itself.

Page	Description
Installation	Step-by-step setup
Configuration	Quick configuration guide
Colors & Theming	Schemes, accents, CSS variables
Sidebar	Profile card, links, nav tree
Navigation	Sidebar nav + top nav bar
SEO	Meta tags, OG, JSON-LD
Analytics & Cookies	GA4, UA, GDPR banner
i18n	Translations
Full Config Reference	Every option documented

---

Browser support

Chrome 90+, Firefox 88+, Safari 14+, Edge 90+.
Uses color-mix() and CSS custom properties. No IE support.

---

Contributing

Contributions are welcome! See CONTRIBUTING.md for guidelines.

---

License

MIT LICENSE © davidalvarezp

Consider keeping the "Designed by" credit in the footer.