طرح سند

طرح سند

طرح سند یک الگوی دو ستونه برای صفحات مستندات است — توضیح در سمت چپ، کد در سمت راست — که در تلفن همراه به یک ستون کاهش می‌یابد.

ساختار

.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'
}) }}