web-dev-qa-db-ja.com

Sphinx Read The Docsテーマの色を変更しますか？

APIライブラリのドキュメントを作成していて、readthedocs.ioにドキュメントをホストしていて、Sphinxでサポートされています。 pip installを使用してSphinx用にReadThe Docsテーマをインストールしましたが、Read the DocsWebサイトで現在ドキュメントが実行されています。

ドキュメントの色を変更したいのですが。私は彼らのGitHubリポジトリを検索しました GitHub.com そしてsassファイルを編集するという話を見ました。しかし、これらのファイルがどこにあるのかわからないようです。

Example of a Read The Docs with other colors

どんな助けでも大歓迎です！

colorsread-the-docs
15
falling cat

正規の方法は、_staticフォルダーを作成し、その中にCSSファイルを含めてから、テンプレート内のそのCSSを_templatesフォルダー内のインクルードで参照することだと思います。

これを示すために、layout.htmlファイルの単純なオーバーライドを試すことができます。まず、docsフォルダーに_templatesがまだ存在しない場合は作成し、次にlayout.htmlという名前のファイルを作成します。 。

次のように入力します。

{% extends "!layout.html" %}
  {% block footer %} {{ super() }}

  <style>
    /* Sidebar header (and topbar for mobile) */
    .wy-side-nav-search, .wy-nav-top {
      background: #00ff00;
    }
    /* Sidebar */
    .wy-nav-side {
      background: #ff0000;
    }
  </style>
{% endblock %}

ドキュメントを再構築すると、派手なサイドバーとヘッダーが表示されます。 （私はSphinx/Read The Docsテーマで同様の手法を使用しました 実装 。ソースなどを表示して、オーバーライドするビットを確認します。）

14
Aidan Fitzpatrick

カスタムCSSファイルを_staticに追加することで、テーマの色を変更できます。 Sphinxにそのファイルを実際に使用させるには、これをconf.pyに追加します。

def setup(app):
    app.add_css_file('custom.css')

サイドバーの色を濃い緑色に変更するCSS（custom.css）のサンプル（@afitの回答に基づく）：

.wy-side-nav-search, .wy-nav-top {
    background: #0b750a;
}
3
Gustavo Bezerra

ナビゲーションヘッダーの色のみを変更したい場合は、html_theme_optionsのconf.py変数を使用して変更できます。 'style_nav_header_background'というパラメータがあります。

https://sphinx-rtd-theme.readthedocs.io/en/stable/configuring.html#theme-options

1
Daniel Ching