{{#> web/layout/default title="Text" parentPageName="Helpers" }}

<section class="UNSTABLE_Section">

  <div class="Container">

    <h2 class="docs-Heading">Truncate</h2>

    <div class="docs-Stack docs-Stack--start">

      <div style="width: 400px">
        <p class="text-truncate">
          This is a truncated single-line text.
          Lorem ipsum dolor sit amet, consectetur adipisicing elit.
        </p>
      </div>

    </div>

  </div>

</section>

<section class="UNSTABLE_Section">

  <div class="Container">

    <h2 class="docs-Heading">Truncate multiline</h2>

    <div class="docs-Stack docs-Stack--start">

      <div style="width: 400px">
        <p class="text-truncate-multiline">
          This is a truncated multi-line text.
          Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam at excepturi laudantium magnam mollitia
          perferendis reprehenderit, voluptate. Cum delectus dicta ducimus eligendi excepturi natus perferendis
          provident unde. Eveniet, iste, molestiae?
        </p>
      </div>

    </div>
    
  </div>

</section>

{{/web/layout/default}}
