diff --git a/.github/workflows/docs.yml b/.github/workflows/docs.yml index 54d9da7..d271096 100644 --- a/.github/workflows/docs.yml +++ b/.github/workflows/docs.yml @@ -37,7 +37,7 @@ jobs: python-version: '3.x' - name: Install mkdocs and dependencies - run: pip install mkdocs mkdocs-bootswatch + run: pip install mkdocs mkdocs-material - name: Build documentation run: mkdocs build --strict diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index af0ac57..f848fd5 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -28,7 +28,7 @@ jobs: python-version: '3.x' - name: Install mkdocs and dependencies - run: pip install mkdocs mkdocs-bootswatch + run: pip install mkdocs mkdocs-material - name: Build documentation run: mkdocs build --strict diff --git a/docs/styles/custom-header.css b/docs/styles/custom-header.css index f3b6931..0dd9e42 100644 --- a/docs/styles/custom-header.css +++ b/docs/styles/custom-header.css @@ -1,11 +1,18 @@ -/* Widen the navbar container */ -.navbar .container { - max-width: 100%; /* adjust to your target width */ - width: 95%; +/* Material header tweaks */ +.md-header, +.md-tabs { + background-color: #101014; } -/* Tighter spacing between navbar items */ -.navbar-nav > li > a { - padding-left: 8px; - padding-right: 8px; +.md-header { + border-bottom: 1px solid rgba(255, 152, 0, 0.28); +} + +.md-tabs { + border-bottom: 1px solid rgba(255, 152, 0, 0.16); +} + +.md-tabs__link--active, +.md-tabs__link:hover { + color: #ffb74d; } diff --git a/docs/styles/links.css b/docs/styles/links.css index 28a7e96..b637893 100644 --- a/docs/styles/links.css +++ b/docs/styles/links.css @@ -1,65 +1,44 @@ -/* Normal links */ -a { - color: orange; +/* Material dark palette overrides */ +[data-md-color-scheme="slate"] { + --md-default-bg-color: #0f1117; + --md-default-fg-color: #e8eaed; + --md-primary-fg-color: #101014; + --md-primary-fg-color--light: #1a1a21; + --md-primary-fg-color--dark: #09090d; + --md-accent-fg-color: #ff9800; + --md-accent-fg-color--transparent: rgba(255, 152, 0, 0.14); + --md-typeset-a-color: #ffb74d; + --md-code-bg-color: #171a22; + --md-code-fg-color: #f5f7fa; } - -/* On hover/focus */ -a:hover, -a:focus { - color: #ff9900; /* a slightly different orange, optional */ -} -/* Navbar background */ -.navbar, -.navbar-default, -.navbar-inverse { - background-color: #a26228 !important; /* your orange */ - border-color: #ff6600 !important; +.md-typeset a { + color: var(--md-typeset-a-color); } -/* Navbar brand + links */ -.navbar .navbar-brand, -.navbar .navbar-nav > li > a { - color: #ffffff !important; +.md-typeset a:hover, +.md-typeset a:focus { + color: #ffd180; } -/* Active and hover states */ -.navbar .navbar-nav > .active > a, -.navbar .navbar-nav > .active > a:focus, -.navbar .navbar-nav > .active > a:hover, -.navbar .navbar-nav > li > a:hover, -.navbar .navbar-nav > li > a:focus { - color: #ffffff !important; -} -/* === DROPDOWN MENU BACKGROUND === */ -.navbar .dropdown-menu { - border-color: #ff6600 !important; +.md-tabs__item--active > .md-tabs__link, +.md-tabs__link:hover, +.md-nav__link:hover, +.md-nav__link:focus, +.md-nav__link--active, +.md-nav__item .md-nav__link--active { + color: #ffb74d; } -/* Caret icon (the little triangle) */ -.navbar .dropdown-toggle .caret { - border-top-color: #ffffff !important; - border-bottom-color: #ffffff !important; +.md-typeset .md-button { + border-color: #ff9800; + color: #ffb74d; } -/* === BOOTSTRAP 3 STYLE ITEMS (mkdocs + bootswatch darkly often use this) === */ -.navbar .dropdown-menu > li > a { - color: #ffffff !important; -} - -.navbar .dropdown-menu > li > a:hover, -.navbar .dropdown-menu > li > a:focus { - background-color: #e65c00 !important; /* darker orange on hover */ - color: #ffffff !important; -} - -/* === BOOTSTRAP 4+ STYLE ITEMS (if your theme uses .dropdown-item) === */ -.navbar .dropdown-item { - color: #ffffff !important; -} - -.navbar .dropdown-item:hover, -.navbar .dropdown-item:focus { - background-color: #e65c00 !important; - color: #ffffff !important; +.md-typeset .md-button:hover, +.md-typeset .md-button:focus, +.md-typeset .md-button--primary { + background-color: #ff9800; + border-color: #ff9800; + color: #111111; } diff --git a/mkdocs.yml b/mkdocs.yml index c40b40d..25d3f94 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -1,7 +1,28 @@ site_name: OMATH Docs theme: - name: darkly + name: material + font: + text: Roboto + code: Roboto Mono + palette: + scheme: slate + primary: black + accent: orange + features: + - navigation.instant + - navigation.tracking + - navigation.sections + - navigation.top + - search.highlight + - content.code.copy +markdown_extensions: + - pymdownx.highlight: + anchor_linenums: true + line_spans: __span + pygments_lang_class: true + - pymdownx.inlinehilite + - pymdownx.superfences extra_css: - styles/center.css - styles/custom-header.css - - styles/links.css \ No newline at end of file + - styles/links.css