/mkdocs-pure

Primary LanguageHTMLBSD 2-Clause "Simplified" LicenseBSD-2-Clause

MkDocs Pure Theme

Theme free from JavaScript and external links.

site example

PyPI Downloads PyPI Version

Installation

First, install the package via PyPI:

pip3 install mkdocs-pure

Then include the theme in your mkdocs.yml file:

theme:
  name: pure

Or clone for custom:

git clone https://github.com/notoriginalnik/mkdocs-pure
pip3 install .

Use pip install for win.

auto dark and light mode

:root {
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root {
  --main-bg-color: black;
  --text-color: white;
  --code-color: #0f0;
  --details-color: #432;
  }
}
@media (prefers-color-scheme: light) {
  :root {
  --main-bg-color: ffd;
  --text-color: black;
  --code-color: green;
  --details-color: #ffe;
  }
  /* bug */
  #menu {
	background: #fff;
}

Customize

Change colors and sidebar-width at ./css/theme.ccss

Blog

For simple blogging prefer naming like logs YYYY-MM-DD-*.md:

docs/
    2015-10-30.md
    2018-12-31.md
    2019-01-02.md

or
docs/
    2015/10-30.md
    2018/12-31.md
    2019/01-02.md

or even
docs/
    2015/10/30.md
    2018/12/31.md
    2019/01/02.md

Template blocks

Theme provide the standart blocks:

site_meta: Contains meta tags in the document head.
htmltitle: Contains the page title in the document head.
styles: Contains the link tags for stylesheets.
libs: Contains the JavaScript libraries (jQuery, etc) included in the page header.
scripts: Contains JavaScript scripts which should execute after a page loads.
analytics: Contains the analytics script.
extrahead: An empty block in the <head> to insert custom tags/scripts/etc.
site_name: Contains the site name in the navigation bar.
site_nav: Contains the site navigation in the navigation bar.
search_button: Contains the search box in the navigation bar.
next_prev: Contains the next and previous buttons in the navigation bar.
repo: Contains the repository link in the navigation bar.
content: Contains the page content and table of contents for the page.
footer: Contains the page footer.

links

  1. mkdocs-basic-theme
  2. pure-css repository
  3. pure-css site
  4. side-menu
  5. CSS-SideBar-Toggle
  6. example css menu
  7. dark mode
  8. layout blog
  9. repository layout blog
  10. blogging-plugin
  11. blogging-plugin-example
  12. git-revision-date-plugin
  13. material theme request git-revision-date-plugin
  14. material theme blog
https://beautifuljekyll.com/
https://deanattali.com/popular/
https://ethanschoonover.com/solarized/
https://idratherbewriting.com/
http://waylan.limberg.name/mkdocs-nature/features/

Notes

v0.1
remove search
remove js
store all files localy
added sidebar
toogle sidebar
auto resize site for mobile
auto dark and light mode

v0.2
added simple blog

v0.3
complete sidebar behavior
change color scheme to solarized