<figcaption class="o-caption">
      Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.
  </figcaption>
{% set base_class = caption.base_class|default('o-caption') %}
{% if caption %}
  <figcaption class="{{ bem(base_class, caption.element, caption.modifiers, caption.extra) }}" >
    {% if caption.icon %}
    {% include "@icon" with {
      "icon": {
        "name": "caption"
      }
    } %}
    {% endif %}
    {{ caption.text }}
  </figcaption>
{% endif %}
{
  "caption": {
    "text": "Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit."
  }
}
  • Content:
    /* ------------------------------------ *\
      $CAPTION
    \* ------------------------------------ */
    
    .o-caption,
    figcaption {
      margin-top: var(--ds-space-sm);
      @include o-typography-body--caption-1('primary');
    }
    
    // D.School caption styles (matching Typography spec/examples in Figma)
    
    .o-caption--primary-caption1 {
      @include o-typography-body--caption-1('primary');
    }
    
    .o-caption--secondary-caption1 {
      @include o-typography-body--caption-1('secondary');
    }
    
    .o-caption--primary-caption2 {
      @include o-typography-body--caption-2();
    }
    
  • URL: /components/raw/caption/_caption.scss
  • Filesystem Path: components/01-atoms/text/caption/_caption.scss
  • Size: 537 Bytes

No notes defined.