2013-10-18 04:29:09 +08:00
|
|
|
.. _readthedocs.org: http://www.readthedocs.org
|
|
|
|
.. _bower: http://www.bower.io
|
|
|
|
.. _sphinx: http://www.sphinx-doc.org
|
|
|
|
.. _compass: http://www.compass-style.org
|
2013-11-04 06:50:38 +08:00
|
|
|
.. _sass: http://www.sass-lang.com
|
2013-10-30 13:45:38 +08:00
|
|
|
.. _wyrm: http://www.github.com/snide/wyrm/
|
|
|
|
.. _grunt: http://www.gruntjs.com
|
2013-10-30 13:52:04 +08:00
|
|
|
.. _node: http://www.nodejs.com
|
2013-10-31 03:32:50 +08:00
|
|
|
.. _demo: http://docs.readthedocs.org
|
2013-10-18 04:29:09 +08:00
|
|
|
|
|
|
|
**************************
|
|
|
|
Read the Docs Sphinx Theme
|
|
|
|
**************************
|
|
|
|
|
2013-10-31 03:32:50 +08:00
|
|
|
View a working demo_ over on readthedocs.org_.
|
|
|
|
|
2013-10-30 13:45:38 +08:00
|
|
|
This is a prototype mobile-friendly sphinx_ theme I made for readthedocs.org_. It's
|
|
|
|
currently in development and includes some rtd variable checks that can be ignored
|
2013-10-30 13:52:04 +08:00
|
|
|
if you're just trying to use it on your project outside of that site.
|
2013-10-18 04:29:09 +08:00
|
|
|
|
2013-11-12 08:30:04 +08:00
|
|
|
**This repo also exists as a submodule within the readthedocs itself**, so please make your edits to
|
|
|
|
the SASS files here, rather than the .css files on RTD.
|
|
|
|
|
2013-10-18 22:59:08 +08:00
|
|
|
.. image:: screen_mobile.png
|
|
|
|
:width: 100%
|
|
|
|
|
2013-10-18 04:29:09 +08:00
|
|
|
Installation
|
|
|
|
============
|
|
|
|
|
2013-11-03 11:26:36 +08:00
|
|
|
Via package
|
|
|
|
-----------
|
|
|
|
|
|
|
|
Download the package or add it to your ``requirements.txt`` file:
|
|
|
|
|
2013-11-04 08:46:07 +08:00
|
|
|
.. code:: bash
|
2013-11-03 11:26:36 +08:00
|
|
|
|
2013-11-04 08:32:45 +08:00
|
|
|
$ pip install sphinx_rtd_theme
|
2013-11-03 11:26:36 +08:00
|
|
|
|
|
|
|
In your ``conf.py`` file:
|
|
|
|
|
2013-11-04 08:46:07 +08:00
|
|
|
.. code:: python
|
2013-11-03 11:26:36 +08:00
|
|
|
|
|
|
|
import sphinx_rtd_theme
|
|
|
|
|
|
|
|
html_theme = "sphinx_rtd_theme"
|
|
|
|
|
|
|
|
html_theme_path = [sphinx_rtd_theme.get_html_theme_path()]
|
|
|
|
|
|
|
|
Via git or download
|
|
|
|
-------------------
|
|
|
|
|
2013-10-30 13:45:38 +08:00
|
|
|
Symlink or subtree the ``sphinx_rtd_theme/sphinx_rtd_theme`` repository into your documentation at
|
|
|
|
``docs/_themes/sphinx_rtd_theme`` then add the following two settings to your Sphinx
|
2013-10-18 04:29:09 +08:00
|
|
|
conf.py file:
|
|
|
|
|
2013-11-04 08:46:07 +08:00
|
|
|
.. code:: python
|
2013-11-04 07:02:50 +08:00
|
|
|
|
2013-11-04 07:01:40 +08:00
|
|
|
html_theme = "sphinx_rtd_theme"
|
|
|
|
html_theme_path = ["_themes", ]
|
2013-10-18 04:29:09 +08:00
|
|
|
|
2013-10-30 13:45:38 +08:00
|
|
|
How the Table of Contents builds
|
|
|
|
================================
|
|
|
|
|
2013-10-30 13:52:04 +08:00
|
|
|
Currently the left menu will build based upon any ``toctree(s)`` defined in your index.rst file.
|
2013-10-30 13:45:38 +08:00
|
|
|
It outputs 2 levels of depth, which should give your visitors a high level of access to your
|
|
|
|
docs. If no toctrees are set the theme reverts to sphinx's usual local toctree.
|
|
|
|
|
|
|
|
It's important to note that if you don't follow the same styling for your rST headers across
|
|
|
|
your documents, the toctree will misbuild, and the resulting menu might not show the correct
|
|
|
|
depth when it renders.
|
|
|
|
|
2013-10-18 04:29:09 +08:00
|
|
|
Contributing or modifying the theme
|
|
|
|
===================================
|
|
|
|
|
2013-11-04 06:50:38 +08:00
|
|
|
The sphinx_rtd_theme is primarily a sass_ project that requires a few other sass libraries. I'm
|
|
|
|
using bower_ to manage these dependencies and compass_ to build the css. The good news is
|
|
|
|
I have a very nice set of grunt_ operations that will not only load these dependecies, but watch
|
2013-11-06 03:43:17 +08:00
|
|
|
for changes, rebuild the sphinx demo docs and build a distributable version of the theme.
|
|
|
|
The bad news is this means you'll need to set up your environment similar to that
|
2013-11-04 06:50:38 +08:00
|
|
|
of a front-end developer (vs. that of a python developer). That means installing node and ruby.
|
2013-10-18 04:29:09 +08:00
|
|
|
|
2013-11-04 06:50:38 +08:00
|
|
|
Set up your environment
|
|
|
|
-----------------------
|
2013-10-18 04:29:09 +08:00
|
|
|
|
2013-11-04 07:01:40 +08:00
|
|
|
1. Install sphinx_ into a virtual environment.
|
2013-11-04 06:50:38 +08:00
|
|
|
|
2013-11-04 08:46:07 +08:00
|
|
|
.. code::
|
2013-11-04 07:02:50 +08:00
|
|
|
|
2013-11-04 07:11:34 +08:00
|
|
|
pip install sphinx
|
|
|
|
|
|
|
|
2. Install sass and compass
|
|
|
|
|
2013-11-04 08:46:07 +08:00
|
|
|
.. code::
|
2013-11-04 07:11:34 +08:00
|
|
|
|
|
|
|
gem install sass compass
|
2013-11-04 06:50:38 +08:00
|
|
|
|
|
|
|
2. Install node, bower and grunt.
|
|
|
|
|
2013-11-04 08:46:07 +08:00
|
|
|
.. code::
|
2013-11-04 07:02:50 +08:00
|
|
|
|
2013-11-04 07:01:40 +08:00
|
|
|
// Install node
|
|
|
|
brew install node
|
2013-11-04 06:50:38 +08:00
|
|
|
|
2013-11-04 07:01:40 +08:00
|
|
|
// Install bower and grunt
|
|
|
|
npm install -g bower grunt-cli
|
2013-11-04 06:50:38 +08:00
|
|
|
|
2013-11-05 11:17:23 +08:00
|
|
|
// Now that everything is installed, let's install the theme dependecies.
|
|
|
|
npm install
|
|
|
|
|
2013-11-04 06:50:38 +08:00
|
|
|
Now that our environment is set up, make sure you're in your virtual environment, go to
|
|
|
|
this repository in your terminal and run grunt:
|
|
|
|
|
2013-11-04 08:46:07 +08:00
|
|
|
.. code::
|
2013-11-04 07:02:50 +08:00
|
|
|
|
2013-11-04 07:01:40 +08:00
|
|
|
grunt
|
2013-11-04 06:50:38 +08:00
|
|
|
|
|
|
|
This default task will do the following **very cool things that make it worth the trouble**.
|
|
|
|
|
|
|
|
1. It'll install and update any bower dependencies.
|
|
|
|
2. It'll run sphinx and build new docs.
|
|
|
|
3. It'll watch for changes to the sass files and build css from the changes.
|
|
|
|
4. It'll rebuild the sphinx docs anytime it notices a change to .rst, .html, .js
|
|
|
|
or .css files.
|
|
|
|
|
2013-11-05 01:13:03 +08:00
|
|
|
Before you send a Pull Request
|
|
|
|
------------------------------
|
2013-11-04 06:50:38 +08:00
|
|
|
|
2013-11-05 01:13:03 +08:00
|
|
|
When you're done with your edits, you can run ``grunt build`` to clean out the old
|
|
|
|
files and rebuild a new distribution, compressing the css and cleaning out
|
|
|
|
extraneous files. Please do this before you send in a PR.
|
2013-10-19 06:15:23 +08:00
|
|
|
|
2013-10-30 13:45:38 +08:00
|
|
|
TODO
|
|
|
|
====
|
2013-11-04 07:34:24 +08:00
|
|
|
* Build real demo docs with lots of rst examples
|
2013-11-04 07:05:39 +08:00
|
|
|
* Update to font-awesome 4.0 and have it build from bower, not the copy/paste hack I have now.
|
2013-10-30 13:45:38 +08:00
|
|
|
* Separate some sass variables at the theme level so you can overwrite some basic colors.
|
|
|
|
* Add the ability to set a logo.
|