Joran design system

Headings: Subhead 

<div class="u-subhead">[SUBHEAD] Bro ipsum dolor sit amet gaper backside single track, manny Bike epic clipless.</div>
 
<div{% if styleModifier %} class="{{ styleModifier }}"{% endif %}>{{ text }}</div>
 
{
  "text": "[SUBHEAD] Bro ipsum dolor sit amet gaper backside single track, manny Bike epic clipless.",
  "styleModifier": "u-subhead"
}
  • Content: 
    /* ======================================================================
 # _utilities.headings.css
 ====================================================================== */

/***
 * Take a look in `tailwind.config.js` for more typography settings
 */


/* -----------------------------------
  # Subhead
  ----------------------------------- */

.u-subhead {
  @extend %subhead;
}

/* -----------------------------------
 # Heanding 1
 ----------------------------------- */

.u-h1 {
  @extend %h1;
}

/* -----------------------------------
 # Heanding 2
 ----------------------------------- */

.u-h2 {
  @extend %h2;
}

/* -----------------------------------
 # Heanding 3
 ----------------------------------- */

.u-h3 {
  @extend %h3;
}

/* -----------------------------------
 # Heanding 4
 ----------------------------------- */

.u-h4 {
  @extend %h4;
}

/* -----------------------------------
 # Heanding 5
 ----------------------------------- */

.u-h5 {
  @extend %h5;
}

/* -----------------------------------
 # Heanding 6
 ----------------------------------- */

.u-h6 {
  @extend %h6;
}

/* -----------------------------------
 # Caption
 ----------------------------------- */

.u-caption {
  @extend %caption;
}

/* -----------------------------------
 # CTA
 ----------------------------------- */

.u-cta {
  @extend %cta;
}
  • URL: /components/raw/headings/_utilities.headings.css
  • Filesystem Path: src/components/02-Utilities/headings/_utilities.headings.css
  • Size: 1.3 KB

No notes defined.