Description List

A way to render data in a table like way, but with labels on the left side

    Usage

    Full name
    Jane Doe
    Application name
    AppSignal
    Environment
    Production
    Description
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vestibulum interdum turpis quis rutrum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed quis consectetur mauris. Integer mauris lectus, elementum non justo vitae, maximus pulvinar nunc. 
    <dl class="c-description-list bg-white">
  <dt class="c-description-list__label">Full name</dt>
  <dd class="c-description-list__value">Jane Doe</dd>

  <dt class="c-description-list__label">Application name</dt>
  <dd class="c-description-list__value">AppSignal</dd>

  <dt class="c-description-list__label">Environment</dt>
  <dd class="c-description-list__value">Production</dd>

  <dt class="c-description-list__label">Description</dt>
  <dd class="c-description-list__value">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vestibulum interdum turpis quis rutrum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed quis consectetur mauris. Integer mauris lectus, elementum non justo vitae, maximus pulvinar nunc. 
  </dd>
</dl>
    Show more

    Implementation

    TypeName
    Elements
    Root element.c-description-list
    Label element.c-description-list__label
    Value element.c-description-list__value
    ModifiersNone
    StatesNone