SU-SWS/stanford_profile

View on GitHub
themes/stanford_basic/src/scss/ckeditor5.scss

Summary

Maintainability
Test Coverage
.ck {
  &.ck-style-grid__button__preview > * {
    margin: 0;
    padding: 0;
  }

  &.ck-content {
    font-family: Source Sans Pro, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 21px;
    line-height: 1.7;

    p {
      font-size: 21px;
      line-height: 35px;
      margin-bottom: 38px;

      &:last-child {
        margin-bottom: 0;
      }
    }

    :first-child {
      margin-top: 0;
      padding-top: 0;
    }

    a {
      color: #006cb8;
      font-weight: 600;

      &:hover,
      &:focus,
      &:active {
        color: #2e2d29;
      }
    }

    h2,
    h3,
    h4,
    h5,
    h6 {
      margin-top: 0;
      clear: both;
      font-weight: 700;
      line-height: 1.2;

      a[href] {
        color: #b1040e;
        text-decoration: none;

        &:hover,
        &:focus,
        &:active {
          text-decoration: underline;
        }

        &::after {
          content: ">";
          margin-right: 0.3em;
          margin-left: 0.4em;
          text-decoration: none;
        }
      }
    }

    h2 {
      font-size: 37px;
      letter-spacing: -0.016em;
      padding-top: 3rem;
      margin-bottom: 1.5rem;
    }

    h3 {
      font-size: 30px;
      letter-spacing: -0.012em;
      padding-top: 1.8rem;
      margin-bottom: 1.25rem;
    }

    h4 {
      font-size: 24px;
      letter-spacing: -0.01em;
      padding-top: 1.8rem;
      margin-bottom: 1.25rem;
    }

    h5 {
      font-size: 19px;
      padding-top: 1.25rem;
      margin-bottom: 1.25rem;
    }

    figure.table,
    table {
      width: 100%;
    }

    .table {
      table {
        border: 0;

        tr:last-of-type {
          border-bottom: 0;
        }

        th {
          background: #fff;
          border: 0;
        }

        td {
          border: 0;
        }
      }

      figcaption {
        text-align: left;
        background-color: white;
        color: #53565a;
        line-height: 1.3;
        padding-bottom: 0;
        padding-left: 0;
      }
    }

    .su-intro-text {
      margin-bottom: 2.5rem;
      font-weight: 400;
      line-height: 1.5;
      max-width: 85rem;
      letter-spacing: -0.012em;
      font-size: 30px;
    }

    .su-font-splash {
      margin-top: 0;
      clear: both;
      font-weight: 700;
      line-height: 1.2;
      font-size: 46px;
      letter-spacing: -0.016em;
      padding-top: 1.2rem;
      margin-bottom: 3.2rem;
    }

    blockquote {
      border-left: 0;
    }

    .su-quote-text {
      font-size: 37px;
      letter-spacing: -0.016em;
      line-height: 1.7;
      font-style: italic;
    }

    .su-drop-cap {
      font-size: 30px;
      font-weight: 400;
      line-height: 1.5;
      max-width: 85rem;
      letter-spacing: -0.012em;
      margin-top: 0;
    }

    .su-drop-cap:first-letter {
      margin: 11px 12px 0 0;
      float: left;
      font-style: normal;
      font-weight: 700;
      font-size: 90px;
      line-height: .6;
      text-transform: uppercase
    }

    .su-related-text {
      margin-bottom: 3.5rem;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
      padding: 25px;
      border: 1px solid #e3e3e3;
    }

    .su-callout-text {
      padding-top: 1.9rem;
      font-size: 28px;
      margin-bottom: 3.5rem;
      line-height: 1.3;
      font-weight: 700;
    }

    .su-subheading {
      font-size: 24px;
    }

    ul {
      list-style-type: disc;
      line-height: 1.7;

      ul {
        list-style-type:circle;

        ul {
          list-style-type: square;
        }
      }
    }

    ol {
      line-height: 1.7;
      list-style-type: number;

      &[type="a"] {
        list-style-type: lower-alpha
      }
      &[type="A"] {
        list-style-type: upper-alpha
      }
      &[type="i"] {
        list-style-type: lower-roman;
      }
      &[type="I"] {
        list-style-type: upper-roman
      }
    }

    li {
      line-height: 1.4;
      margin-bottom: 10px;
    }

    a.su-button {
      display: inline-block;
      padding: 0.5rem 1rem 0.575rem;
      background-color: #b1040e;
      color: white;
      text-decoration: none;
      font-weight: 400;
      font-size: 20px;
      margin-bottom: 1.75rem;

      &:hover,
      &:focus,
      &:active {
        text-decoration: underline;
        background-color: #2e2d29;
      }
    }

    a.su-button--big {
      display: inline-block;
      padding: 0.75rem 1.5rem 0.9rem;
      background-color: #b1040e;
      color: white;
      text-decoration: none;
      font-weight: 400;
      font-size: 30px;
      margin-bottom: 1.75rem;

      &:hover,
      &:focus,
      &:active {
        text-decoration: underline;
        background-color: #2e2d29;
      }
    }

    a.su-button--secondary {
      display: inline-block;
      padding: 0.5rem 1rem 0.575rem;
      border: 2px solid #b1040e;
      color: #b1040e;
      text-decoration: none;
      font-weight: 400;
      font-size: 20px;
      margin-bottom: 1.75rem;

      &:hover,
      &:focus,
      &:active {
        text-decoration: underline;
        color: #2e2d29;
        border: 2px solid #2e2d29;
      }
    }

    a.su-link--action {
      text-decoration: underline;

      &::after {
        content: ">";
        margin-right: 0.3em;
        margin-left: 0.4em;
        text-decoration: none;
      }
    }

    div:after,
    p:after {
      display: table;
      clear: both;
      content: "";
    }
  }
}