https://github.com/asiffer/mkdocs-shadcn
Documentation that also shines
https://github.com/asiffer/mkdocs-shadcn
mkdocs mkdocs-theme shadcn shadcn-ui
Last synced: about 2 months ago
JSON representation
Documentation that also shines
- Host: GitHub
- URL: https://github.com/asiffer/mkdocs-shadcn
- Owner: asiffer
- License: mit
- Created: 2025-02-02T15:16:24.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2025-03-22T20:44:42.000Z (about 1 year ago)
- Last Synced: 2025-03-30T07:01:42.773Z (about 1 year ago)
- Topics: mkdocs, mkdocs-theme, shadcn, shadcn-ui
- Language: CSS
- Homepage: https://asiffer.github.io/mkdocs-shadcn/
- Size: 676 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-shadcn-ui - Link - 07-07 | (Ports)
- awesome-shadcn-ui-browser - Link - 07-07 | (Ports)
README
> [!IMPORTANT]
> This is an unofficial port of shadcn/ui to MkDocs, and is not affiliated with [@shadcn](https://twitter.com/shadcn).
## Documentation
Yes, yes, the [documentation](https://asiffer.github.io/mkdocs-shadcn/) is built with this theme.
## Quick start
`mkdocs-shadcn` can be installed with `pip`
```shell
pip install mkdocs-shadcn
```
Add the following line to `mkdocs.yml`:
```yaml
theme:
name: shadcn
```
## Extensions
The theme tries to support the built-in extensions along with some `pymdownx` ones.
- [x] [`admonition`](https://python-markdown.github.io/extensions/admonition/)
- [x] [`codehilite`](https://python-markdown.github.io/extensions/code_hilite/)
- [x] [`fenced_code`](https://python-markdown.github.io/extensions/fenced_code_blocks/)
- [x] [`footnotes`](https://python-markdown.github.io/extensions/footnotes/)
- [x] [`pymdownx.tabbed`](https://facelessuser.github.io/pymdown-extensions/extensions/tabbed/)
- [x] [`pymdownx.blocks.details`](https://facelessuser.github.io/pymdown-extensions/extensions/blocks/plugins/details/)
- [x] [`pymdownx.blocks.tab`](https://facelessuser.github.io/pymdown-extensions/extensions/blocks/plugins/tab/)
- [x] [`pymdownx.progressbar`](https://facelessuser.github.io/pymdown-extensions/extensions/progressbar/)
- [x] [`pymdownx.arithmatex`](https://facelessuser.github.io/pymdown-extensions/extensions/arithmatex/)
- [x] builtin [`shadcn.echarts`](https://asiffer.github.io/mkdocs-shadcn/extensions/echarts/)
- [x] builtin [`shadcn.iconify`](https://asiffer.github.io/mkdocs-shadcn/extensions/iconify/)
- [x] builtin [`shadcn.codexec`](https://asiffer.github.io/mkdocs-shadcn/extensions/codexec/)
## Plugins
- [x] builtin [`excalidraw`](https://excalidraw.com/) - With this plugin, you can directly edit your excalidraw scene in dev mode (kind of WYSIWYG) while it is rendered as svg at build time.
- [x] [`mkdocstrings`](https://mkdocstrings.github.io/) - a MkDocs plugin for auto-generating API documentation from docstrings. (alpha)
## Developers
This project is open to contributions. In general, we need to apply the shadcn/ui style to already existing plugins or extensions.
We recently release the css sources we use to style the theme. It mainly uses [`tailwindcss`](https://tailwindcss.com/).
### Setup
First clone the repo:
```shell
git clone https://github.com/asiffer/mkdocs-shadcn
cd mkdocs-shadcn
```
Then you can install python dependencies ([`uv`](https://docs.astral.sh/uv/) required):
```shell
uv sync --all-extras
```
Finally, you can install tailwind with your favourite package manager (npm, yarn, bun, etc.):
```shell
bun install
```
### Dev mode
We use the project pages to as a test project for this theme. You can run the local server in the `pages/` subdirectory.
```shell
cd pages/
uv run mkdocs serve --watch-theme -w ..
```
In parallel, you are likely to run the tailwind watcher to compile the css sources. In the root folder:
```shell
bun dev
```
### Testing
Tests are managed by [`pytest`](https://docs.pytest.org/en/stable/) and are located in the [tests/](./tests/) folder.
Currently we only test that there is no browser issue through [playwright](https://playwright.dev/).