dxw style

Headings 

<div class="grid-container">
    <div class="column-two-thirds">
        <h1 class="h1">A heading with a class of h1</h1>
        <h2 class="h2">A heading with a class of h2</h2>
        <h3 class="h3">A heading with a class of h3</h3>
        <h4 class="h4">A heading with a class of h4</h4>
        <h5 class="h5">A heading with a class of h5</h5>
        <h6 class="h6">A heading with a class of h6</h6>

        <p class="h1">A paragraph with a class of h1</p>
        <p class="h2">A paragraph with a class of h2</p>
        <p class="h3">A paragraph with a class of h3</p>
        <p class="h4">A paragraph with a class of h4</p>
        <p class="h5">A paragraph with a class of h5</p>
        <p class="h6">A paragraph with a class of h6</p>
    </div>
</div>
 
<div class="grid-container">
  <div class="column-two-thirds">
    <h1 class="h1">A heading with a class of h1</h1>
    <h2 class="h2">A heading with a class of h2</h2>
    <h3 class="h3">A heading with a class of h3</h3>
    <h4 class="h4">A heading with a class of h4</h4>
    <h5 class="h5">A heading with a class of h5</h5>
    <h6 class="h6">A heading with a class of h6</h6>

    <p class="h1">A paragraph with a class of h1</p>
    <p class="h2">A paragraph with a class of h2</p>
    <p class="h3">A paragraph with a class of h3</p>
    <p class="h4">A paragraph with a class of h4</p>
    <p class="h5">A paragraph with a class of h5</p>
    <p class="h6">A paragraph with a class of h6</p>
  </div>
</div>
 
/* No context defined for this component. */
  • Content: 
    h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  margin: 1em 0 0.75em;
  font-family: $base-font;
  line-height: $header-line-height;
  font-weight: 500;
}

h1, .h1 {
  @include font-size-map($h1-font-size);
  font-weight: bold;
}

h2, .h2 {
  @include font-size-map($h2-font-size);
}

h3, .h3 {
  @include font-size-map($h3-font-size);
}

h4, .h4 {
  @include font-size-map($h4-font-size);
}

h5, .h5 {
  @include font-size-map($h5-font-size);
}

h6, .h5 {
  @include font-size-map($h6-font-size);
}
  • URL: /components/raw/headings/headings.scss
  • Filesystem Path: components/typography/headings/headings.scss
  • Size: 509 Bytes

There are no notes for this item.