Asiakirjan asettelu

Asiakirjan asettelu on kaksikolumnainen malli dokumentaatiosivuille — kuvaus vasemmalla, koodi oikealla — joka kutistuu yhdelle kolumnalle mobiilissa.

Rakenne

.doc toimii ulkoisena kehikkona ja .doc-section jokaiselle riville. Jokaisella osalla on .doc-section--description ja .doc-section--code sarake.

Perusosa

Tyypillinen osa yhdistää kuvauksen ja koodin pätkän.

Demon sisältö

<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>

Koodilohkolla

Käytä code-block-osaa .doc-section--code sisällä syntaksin korostetuille esimerkeille.

Demon sisältö

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