🚨This repository is not actively maintained. Use sphinx-design
instead! See the migration guide and this github issue for more information.🚨
A sphinx extension for creating document components optimised for HTML+CSS.
The panels
directive creates panels of content in a grid layout, utilising both the Bootstrap 4 grid system, and cards layout.
The link-button
directive creates a click-able button, linking to a URL or reference, and can also be used to make an entire panel click-able.
The dropdown
directive creates toggle-able content.
The tabbed
directive creates tabbed content.
opticon
and fa
(fontawesome) roles allow for inline icons to be added.
.. panels::
Content of the top-left panel
---
Content of the top-right panel
---
Content of the bottom-left panel
---
Content of the bottom-right panel
The link-button
directive can be used to create buttons, which link to a URL (default) or reference.
They can be styled by Bootstrap button classes:
.. panels::
.. link-button:: https://example.com
:type: url
:tooltip: hallo
:classes: btn-success
---
This entire panel is clickable.
+++
.. link-button:: panels/usage
:type: ref
:text: Go To Reference
:classes: btn-outline-primary btn-block stretched-link
The dropdown
directive combines a Bootstrap card
with the HTML details tag to create a collapsible
drop-down panel.
.. dropdown:: Click on me to see my content!
I'm the content which can be anything:
.. link-button:: https://example.com
:text: Like a Button
:classes: btn-primary
To run the tests:
pip install tox
tox -e py37-sphinx3
To test building the docs:
tox -e docs-clean html
tox -e docs-rebuild html
For live builds of the docs:
tox -e docs-live html
You can also build the docs in different themes, by setting HTML_THEME
to one of alabaster
, sphinx_rtd_theme
, pydata_sphinx_theme
, sphinx_book_theme
:
export HTML_THEME=sphinx_book_theme
tox -e docs-live
For code style and SCSS -> CSS updating:
pip install pre-commit
pre-commit run --all