Copy environment

Stats 

<div class="stats">
    <div class="stats__text">
        Avatud krediiti
    </div>
    <div class="stats__item">
        <span class="stats__item-value">-657.32€</span>
        <div class="stats__item-info">/ 166% kasutatud</div>
    </div>
</div>
 
<div class="stats">
    {% if data.title %}
        <div class="stats__text">
            {{ data.title }}
        </div>
    {% endif %}
    <div class="stats__item">
        <span class="stats__item-value">{{ data.value }}</span>
        {% if data.info %}
            <div class="stats__item-info">{{ data.info }}</div>
        {% endif %}
    </div>
</div>

{
  "language": "en-US",
  "data": {
    "image": true,
    "title": "Avatud krediiti",
    "value": "-657.32€",
    "info": "/ 166% kasutatud"
  }
}
  • Content: 
    .stats {
    margin-bottom: 8px;

    @include bp(sm-min) {
        margin-bottom: 0;
    }
}

.stats__text {
    line-height: 1.2;
    letter-spacing: $letter-spacing-default;
    margin-bottom: 8px;
}

.stats__item {
    display: flex;
    align-items: baseline;
    vertical-align: baseline;
}

.stats__item-value {
    display: inline-block;
    font-size: $font-size-extra-large-xs;
    font-weight: $font-weight-medium;
    letter-spacing: $letter-spacing-default;
    line-height: 20px;

    @include bp(sm-min) {
        font-size: $font-size-h3-xs;
        font-weight: $font-weight-bold;
        line-height: $line-height-h3-xs;
    }
}

.stats__item-info {
    display: inline-block;
    font-size: $font-size-base;
    margin-left: 5px;
}
  • URL: /components/raw/stats/stats.scss
  • Filesystem Path: src/patterns/components/stats/stats.scss
  • Size: 751 Bytes
  • Handle: @stats--default
  • Filesystem Path: src/patterns/components/stats/stats.twig
  • Referenced by (1): @dashboard