Макет документа

Макет документа — это двухколоночный шаблон для страниц документации: описание слева, код справа. На мобильных устройствах он сворачивается в одну колонку.

Структура

Используйте .doc в качестве внешнего контейнера и .doc-section для каждой строки. Каждая секция имеет колонку .doc-section--description и .doc-section--code.

Основная секция

Типичная секция сочетает блок описания с фрагментом кода.

Демонстрационный контент

<div class="doc">
  <div class="doc-section">
    <div class="doc-section--description">
      <h3>Title</h3>
      <p>Description</p>
    </div>
    <div class="doc-section--code">
      <!-- code snippet -->
    </div>
  </div>
</div>

С блоком кода

Используйте частичное представление code-block внутри .doc-section--code для примеров с подсветкой синтаксиса.

Демонстрационный контент

{{ include('@Bundle/partials/code-block.html.twig', {
  lang: 'bash',
  code: 'curl https://api.example.com/resource'
}) }}