<div class="data-section__container">
</div>
<div class="data-section__container">
    {% if component.title %}<h2 class="data-section__header">{{ component.title }}</h2> {% endif %}
    {% if post.dataContent %}<div class="data-section__body-text">{{ post.dataContent }}</div> {% endif %}
    {% for card in component.cards %}
        {% include 'partials/data-card/data-card.twig' with {
            card: card
        } %}
    {% endfor %}
    {% if post.enableDataCTA or component.enableDataCTA %}
        {% include 'bits/cta-button/cta-button.twig' with {
            background: 'dark',
            link: post.dataCTALink | default(component.dataCTALink),
            linkText: 'Get a Closer Look at This Data',
            icon: 'right-arrow',
        }  %}
    {% endif %}
</div>
/* No context defined. */
  • Content:
    .data-section
        --buttonBackgroundColor sapphire
    
        &__header
            @extends $headline2
            color jet
    
        &__body-text
            @extends $richText
            font-size 20px
            font-weight 300
            line-height 1.75em
            margin-top 24px
    
        &__cta-container
            padding 24px 0 0 0
    
        &__cta-button
            background-color sapphire
            display flex
            justify-content center
            padding 8px 0
            text-decoration none
    
        &__cta-text
            @extends $hypertext
            color white
            text-decoration none
    
            &:hover
            &:active
            &:focus
                color greenApple
    
        &__cta-icon
            padding-left 8px
    
    
    
  • URL: /components/raw/data-block-component/data-block-component.styl
  • Filesystem Path: patterns/components/data-block-component/data-block-component.styl
  • Size: 677 Bytes
  • Handle: @data-block-component
  • Preview:
  • Filesystem Path: patterns/components/data-block-component/data-block-component.twig

No notes defined.