как сделать 2 столбца со сфинксом - PullRequest
Новая
       16

как сделать 2 столбца со сфинксом

0 голосов
/ 25 июня 2019

Я хочу сделать несколько столбцов в моей документации.

В целом, я хотел бы сделать что-то похожее на эту домашнюю страницу , где есть 3 столбца: один с текущим выпуском, одинс новостями и обновлениями, а также Основами.

Когда я искал в Google несколько столбцов в Sphinx, я обнаружил, что разделение списка на 2 столбца не является моим случаем

В вики толькоВещи, которые я нашел с несколькими столбцами - это таблица, но я не думаю, что это применимо здесь?

Возможно ли это в первых файлах с использованием Sphinx?

Большое спасибо

1 Ответ

1 голос
/ 01 июля 2019

Есть несколько способов сделать это, так что вы либо найдете тему сфинкса на основе трех столбцов (не знаю ни о чем), или, как @ Steve_Piercy предложили, вы можете создать свою собственную тему что, вероятно, будет довольно сложной задачей. Однако вместо этого вы можете использовать выбранную тему и просто настроить содержимое файла .rst и перезаписать свою тему, чтобы отобразить содержимое в 3 колонках. Для этого вам понадобится HTML и CSS.

Итак, сначала вам нужно создать test.rst с вашим контентом в виде HTML-кода, например: 

Test
======

.. raw:: html

    <div class="row">
      <div class="column" style="background-color:#aaa;">
        <h2>Column 1</h2>
        <p>Some text..</p>
      </div>
      <div class="column" style="background-color:#bbb;">
        <h2>Column 2</h2>
        <p>Some text..</p>
      </div>
      <div class="column" style="background-color:#ccc;">
        <h2>Column 3</h2>
        <p>Some text..</p>
      </div>
    </div>

Теперь, когда содержимое готово, мы создаем для него файл стиля под _static/custom_style.css, который включает следующий код: 

/* Create three equal columns that floats next to each other */
.column {
  float: left;
  width: 33.33%;
  padding: 10px;
  height: 500px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

Последний шаг - добавить этот стиль в файл conf.py, чтобы добавить его в вашу тему. Итак, в вашем conf.py добавьте следующие строки: 

def setup(app):
    app.add_stylesheet('custom_style.css')

Вот и все, теперь запустите и проверьте. Вывод должен выглядеть примерно так (в зависимости от вашей темы): enter image description here

...