SU-HKKU/cardinal_service_profile

View on GitHub
themes/cardinal_service/lib/scss/wysiwyg/_headings.scss

Summary

Maintainability
Test Coverage
@charset "UTF-8";

.text-with-summary,
.text-long {
  //
  // Headings overrides
  //
  h1 {
    @include responsive-spacing('margin', 4 null 5 null);
  }

  h2 {
    @include responsive-spacing('margin', null null 0 null);
    @include responsive-spacing('padding', 2 null null null);
    // 56 character line length.
    max-width: 40ch;
  }

  h3 {
    @include responsive-spacing('margin', null null -1 null);
    @include responsive-spacing('padding', 0 null null null);
    // 60 character line length.
    max-width: 48ch;
  }

  h4 {
    @include responsive-spacing('margin', null null -1 null);
    @include responsive-spacing('padding', 0 null null null);
    // 64 character line length.
    max-width: 60ch;
  }

  h5 {
    @include responsive-spacing('margin', null null -1 null);
    @include responsive-spacing('padding', -1 null null null);
    // 76 character line length.
    max-width: 75ch;
  }

  h6 {
    @include responsive-spacing('margin-bottom', -2);
    // 84 character line length.
    max-width: 78ch;
  }

  h2,
  h3,
  h4,
  h5,
  h6 {

    &.text-align-center {
      @include margin(null auto);
    }

    &.text-align-left {
      @include margin(null auto null 0);
    }

    &.text-align-right {
      @include margin(null 0 null auto);
    }

    a {
      @include link-icon(caret-right, 0.65em, right);
      color: $su-color-bright-red;

      &:active,
      &:focus,
      &:hover {
        color: $su-color-black;
        text-decoration: underline;
      }

      &::after {
        background-color: $su-color-bright-red;
      }
    }
  }
}