<p class="display">
    Display Text wird immer dann verwendet, wenn innerhalb von Komponenten Paragraph Text eingesetzt, aber eine serifenlose Schrift angezeigt werden soll.
</p>
<p class="display">
    Display Text wird immer dann verwendet, wenn innerhalb von Komponenten Paragraph Text eingesetzt, aber eine serifenlose Schrift angezeigt werden soll.
</p>
{
  "text": "Hardwired professional deficiency BAMA quicksilver sanpaku cutting-edge cryptic dub aiming neon jack in. Ninsei fiberglass cybernetic bullshit shattered magnetic agency isotropic. Tokyo beam prosthesis corporate-grade laser-scrawled prosthesis. Japanese prototype microchannel synthetic shattered temperfoam run circuitry agency plastic intrusion précis biz. "
}
  • Content:
    p {
      @extend %body-font-regular;
    
      margin-bottom: $spacer-md;
      font-size: $font-size-base;
      line-height: $paragraph-line-height;
    
      &:not([class]) {
        @extend %improved-hyphenation-text;
      }
    
      &.lead {
        @extend %body-font-italic;
    
        font-size: $font-size-sm;
        line-height: $paragraph-line-height;
      }
    
      &.display,
      &.standalone {
        @extend %heading-font-regular;
    
        margin-bottom: 0;
      }
    
      &.display {
        text-transform: uppercase;
      }
    
      &.small {
        font-size: $font-size-xxs;
      }
    }
    
    @media screen and (min-width: $grid-breakpoint-md) {
      p {
        font-size: $font-size-sm;
    
        &.lead {
          font-size: $font-size-md;
        }
      }
    }
    
  • URL: /components/raw/paragraph/_paragraph.scss
  • Filesystem Path: components/05-atoms/text/block/paragraph/_paragraph.scss
  • Size: 657 Bytes
  • Handle: @paragraph--display
  • Preview:
  • Filesystem Path: components/05-atoms/text/block/paragraph/paragraph--display.html

No notes defined.