Custom theme (replace with client name)

Profile Mini 

<div class="profile-mini">
    <div class="profile-mini__cards-grid">
    </div>
</div>
 
<div class="profile-mini">
    {% if fields.showTitle | default %}
        <h2 class="profile-mini__title"
            id="{{ fields.title|sanitize }}">
            {{ fields.title }}
        </h2>
    {% endif %}
    <div class="profile-mini__cards-grid">
        {% for person in fields.profiles %}
            <div class="profile-mini__card">
                {% include 'partials/profile-card/profile-card.twig' %}
            </div>
        {% endfor %}
    </div>
    {% if fields.showCTALink | default %}
        <div class="profile-mini__cta-container" data-cy="profile-mini__cta-container"
            {{ fields.showCTALink ? 'data-show-cta="true"' : 'data-show-cta="false"' }}>
            {% include 'bits/standard-button/standard-button.twig' with {
                button: {
                    text: fields.linkText,
                    url: fields.linkUrl
                }
            } %}
        </div>
    {% endif %}
</div>
 
{
  "component": {
    "type": "profile-mini",
    "title": "The latest news about kittens",
    "cards": [
      {
        "fullName": "Terence J. Galbraith",
        "titles": "",
        "photo": {
          "src": "https://placekitten.com/272/352",
          "altText": "friendly kitten"
        },
        "emailAddress": "TerenceJGalbraith@jourrapide.com",
        "phoneNumber": "623-327-6582",
        "permalink": "#"
      },
      {
        "fullName": "Wendy D. Sanchez",
        "titles": "",
        "photo": {
          "src": "https://placekitten.com/272/352",
          "altText": "friendly kitten"
        },
        "emailAddress": "WendyDSanchez@teleworm.us",
        "phoneNumber": "615-691-3250",
        "permalink": "#"
      },
      {
        "fullName": "Antone T. Grissom",
        "titles": "",
        "photo": {
          "src": "https://placekitten.com/272/352",
          "altText": "friendly kitten"
        },
        "emailAddress": "AntoneTGrissom@rhyta.com",
        "phoneNumber": "425-502-0739",
        "permalink": "#"
      }
    ],
    "callToAction": {
      "text": "See all staff",
      "url": "#"
    }
  }
}
  • Content: 
    .profile-mini
    @extends $componentWithMargin

    &__title
        @extends $headline1
        color charcoalLight
        margin-bottom 48px

    &__cards-grid
        margin-bottom 48px
  • URL: /components/raw/profile-mini/profile-mini.styl
  • Filesystem Path: patterns/blocks/profile-mini/profile-mini.styl
  • Size: 191 Bytes

No notes defined.