<div class="faqs-link">
    <h4 class="faqs-link__title">FAQs</h4>
    <p class="faqs-link__content">Check out our Frequently Asked Questions.</p>
    <a class="faqs-link__call-to-action button button--outlined" href="#">FAQs</a>
</div>
<div class="faqs-link">
  {{#if title}}
  <h4 class="faqs-link__title">{{title}}</h4>
  {{/if}}
  {{#if content}}
  <p class="faqs-link__content">{{content}}</p>
  {{/if}}
  {{#if callToAction}}
  <a class="faqs-link__call-to-action button button--outlined" href="{{callToAction.path}}">{{callToAction.label}}</a>
  {{/if}}
</div>
{
  "title": "FAQs",
  "content": "Check out our Frequently Asked Questions.",
  "callToAction": {
    "label": "FAQs",
    "path": "#"
  }
}
  • Content:
    .faqs-link {
      margin-bottom: 50px;
    }
    
    .faqs-link__title {
      margin: 0 0 13px;
      color: $color-dark;
      font-size: 1.6rem;
      font-weight: $font-weight-bold;
      letter-spacing: 1px;
      line-height: 1.9rem;
      text-transform: uppercase;
    
      @include breakpoint($breakpoint-md) {
        margin-bottom: 10px;
      }
    
      @include breakpoint($breakpoint-xl) {
        margin-bottom: 11px;
        font-size: 2.4rem;
        line-height: 2.8rem;
      }
    }
    
    .faqs-link__content {
      color: $color-dark;
      font-size: 1.4rem;
      line-height: 1.7rem;
    
      @include breakpoint($breakpoint-xl) {
        font-size: 1.9rem;
        line-height: 2.3rem;
      }
    }
    
    .faqs-link__call-to-action {
      @include breakpoint($breakpoint-md-only) {
        max-width: 100%;
      }
    }
    
  • URL: /components/raw/faqs-link/faqs-link.scss
  • Filesystem Path: src/components/01-elements/text-blocks/faqs-link/faqs-link.scss
  • Size: 707 Bytes
  • Handle: @faqs-link
  • Preview:
  • Filesystem Path: src/components/01-elements/text-blocks/faqs-link/faqs-link.html

There are no notes for this item.