<div class="directory">
<div class="listing-content">
<div class="listing-content__content">
<form class="taxonomy-filter" data-taxonomy-filter method="get">
<div class="taxonomy-filter__container">
<label class="taxonomy-filter__input-label" for="search-input">Search for keywords</label>
<input class="taxonomy-filter__input" placeholder="Enter search term" type="text" id="search-input" value="" name="search" />
<button class="taxonomy-filter__clear-button" type="button" role="button" onclick="document.getElementById('search-input').value = '';document.getElementById('search-input').focus();">
<span class="taxonomy-filter__clear-button-text">
Clear input field
</span>
<span class="taxonomy-filter__clear-button-icon">
<svg aria-hidden="true" class="clear-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path class="clear-icon__shape" fill="#E84A27" d="M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm0 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2zM8.613 7.21l.094.083L12 10.585l3.293-3.292c.39-.39 1.024-.39 1.414 0 .36.36.388.928.083 1.32l-.083.094L13.415 12l3.292 3.293c.39.39.39 1.024 0 1.414-.36.36-.928.388-1.32.083l-.094-.083L12 13.415l-3.293 3.292c-.39.39-1.024.39-1.414 0-.36-.36-.388-.928-.083-1.32l.083-.094L10.585 12 7.293 8.707c-.39-.39-.39-1.024 0-1.414.36-.36.928-.388 1.32-.083z" />
</svg>
</span>
</button>
<input class="taxonomy-filter__submit" type="submit" id="search-submit" value="Search" />
<div class="taxonomy-filter__submit-icon">
<svg aria-hidden="true" class="search-icon" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path class="_mark" fill="inherit" d="M6 12A6 6 0 116 0a6 6 0 010 12zm0-2a4 4 0 100-8 4 4 0 000 8zm5.293 2.707a1 1 0 011.414-1.414l3 3a1 1 0 01-1.414 1.414l-3-3z" />
</svg>
</div>
<div class="taxonomy-filter__local-taxonomy">
<label class="taxonomy-filter__select-label" for="local-taxonomy-select">Tags</label>
<select class="taxonomy-filter__select" name="local-taxonomy" id="local-taxonomy-select">
<option class="taxonomy-filter__select-option" value="all">All
</option>
</select>
</div>
<div class="taxonomy-filter__buttons">
<button type="tertiary" class="
standard-button
standard-button--natural-width
">
<div class="standard-button__container">
<span class="standard-button__text">
View
</span>
</div>
</button>
<button type="tertiary" class="
standard-button
standard-button--natural-width
">
<div class="standard-button__container">
<span class="standard-button__text">
Clear
</span>
</div>
</button>
</div>
</div>
</form>
<div class="listing-content__list">
<div class="directory__listing">
<article class="person-card">
<div class="person-card__image">
<picture class="profile-card__picture">
<source srcset="https://placekitten.com/272/352?a" type="image/webp">
<source srcset="https://placekitten.com/272/352?a" type="image/jpeg">
<img class="profile-card__image" src="https://placekitten.com/272/352?a" data-cy="profile-card__image" width="260" height="160" alt='friendly kitten' />
</picture>
</div>
<div class="person-card__info-and-related">
<div class="person-card__info">
<div class="profile-card__title">
<div class="card-title">
<div class="card-title__title">
<h2 class="linked-title linked-title--">
<a href="#" class="linked-title__link">
John C. Gunnels
<span class="linked-title__link-icon">
<svg class="right-chevron" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="8" height="16" viewBox="0 0 8 16">
<path class="_mark right-chevron__shape" fill-rule="nonzero" d="M.232 1.65A1.028 1.028 0 0 1 .336.24a.937.937 0 0 1 1.356.11L8 8l-6.308 7.65a.937.937 0 0 1-1.356.11c-.403-.36-.45-.991-.104-1.41L5.466 8 .232 1.65z" />
</svg>
</span>
</a>
</h2>
</div>
</div>
</div>
<div class="profile-card__contact">
<div class="profile-card__contact-email">
<a href="mailto:JohnCGunnels@teleworm.us" class="profile-card__contact-email-link">
JohnCGunnels@teleworm.us
</a>
</div>
<div class="profile-card__contact-phone">
<a href="tel:832-731-9009" class="profile-card__contact-phone-link">
832-731-9009
</a>
</div>
</div>
</div>
<div class="person-card__related">
</div>
</div>
</article>
<article class="person-card">
<div class="person-card__image">
<picture class="profile-card__picture">
<source srcset="https://placekitten.com/272/352?b" type="image/webp">
<source srcset="https://placekitten.com/272/352?b" type="image/jpeg">
<img class="profile-card__image" src="https://placekitten.com/272/352?b" data-cy="profile-card__image" width="260" height="160" alt='friendly kitten' />
</picture>
</div>
<div class="person-card__info-and-related">
<div class="person-card__info">
<div class="profile-card__title">
<div class="card-title">
<div class="card-title__title">
<h2 class="linked-title linked-title--">
<a href="#" class="linked-title__link">
Terence J. Galbraith
<span class="linked-title__link-icon">
<svg class="right-chevron" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="8" height="16" viewBox="0 0 8 16">
<path class="_mark right-chevron__shape" fill-rule="nonzero" d="M.232 1.65A1.028 1.028 0 0 1 .336.24a.937.937 0 0 1 1.356.11L8 8l-6.308 7.65a.937.937 0 0 1-1.356.11c-.403-.36-.45-.991-.104-1.41L5.466 8 .232 1.65z" />
</svg>
</span>
</a>
</h2>
</div>
</div>
</div>
<div class="profile-card__contact">
<div class="profile-card__contact-email">
<a href="mailto:TerenceJGalbraith@jourrapide.com" class="profile-card__contact-email-link">
TerenceJGalbraith@jourrapide.com
</a>
</div>
<div class="profile-card__contact-phone">
<a href="tel:623-327-6582" class="profile-card__contact-phone-link">
623-327-6582
</a>
</div>
</div>
</div>
<div class="person-card__related">
</div>
</div>
</article>
<article class="person-card">
<div class="person-card__image">
<picture class="profile-card__picture">
<source srcset="https://placekitten.com/272/352?c" type="image/webp">
<source srcset="https://placekitten.com/272/352?c" type="image/jpeg">
<img class="profile-card__image" src="https://placekitten.com/272/352?c" data-cy="profile-card__image" width="260" height="160" alt='friendly kitten' />
</picture>
</div>
<div class="person-card__info-and-related">
<div class="person-card__info">
<div class="profile-card__title">
<div class="card-title">
<div class="card-title__title">
<h2 class="linked-title linked-title--">
<a href="#" class="linked-title__link">
Wendy D. Sanchez
<span class="linked-title__link-icon">
<svg class="right-chevron" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="8" height="16" viewBox="0 0 8 16">
<path class="_mark right-chevron__shape" fill-rule="nonzero" d="M.232 1.65A1.028 1.028 0 0 1 .336.24a.937.937 0 0 1 1.356.11L8 8l-6.308 7.65a.937.937 0 0 1-1.356.11c-.403-.36-.45-.991-.104-1.41L5.466 8 .232 1.65z" />
</svg>
</span>
</a>
</h2>
</div>
</div>
</div>
<div class="profile-card__contact">
<div class="profile-card__contact-email">
<a href="mailto:WendyDSanchez@teleworm.us" class="profile-card__contact-email-link">
WendyDSanchez@teleworm.us
</a>
</div>
<div class="profile-card__contact-phone">
<a href="tel:615-691-3250" class="profile-card__contact-phone-link">
615-691-3250
</a>
</div>
</div>
</div>
<div class="person-card__related">
</div>
</div>
</article>
<article class="person-card">
<div class="person-card__image">
<picture class="profile-card__picture">
<source srcset="https://placekitten.com/272/352?d" type="image/webp">
<source srcset="https://placekitten.com/272/352?d" type="image/jpeg">
<img class="profile-card__image" src="https://placekitten.com/272/352?d" data-cy="profile-card__image" width="260" height="160" alt='friendly kitten' />
</picture>
</div>
<div class="person-card__info-and-related">
<div class="person-card__info">
<div class="profile-card__title">
<div class="card-title">
<div class="card-title__title">
<h2 class="linked-title linked-title--">
<a href="#" class="linked-title__link">
Antone T. Grissom
<span class="linked-title__link-icon">
<svg class="right-chevron" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="8" height="16" viewBox="0 0 8 16">
<path class="_mark right-chevron__shape" fill-rule="nonzero" d="M.232 1.65A1.028 1.028 0 0 1 .336.24a.937.937 0 0 1 1.356.11L8 8l-6.308 7.65a.937.937 0 0 1-1.356.11c-.403-.36-.45-.991-.104-1.41L5.466 8 .232 1.65z" />
</svg>
</span>
</a>
</h2>
</div>
</div>
</div>
<div class="profile-card__contact">
<div class="profile-card__contact-email">
<a href="mailto:AntoneTGrissom@rhyta.com" class="profile-card__contact-email-link">
AntoneTGrissom@rhyta.com
</a>
</div>
<div class="profile-card__contact-phone">
<a href="tel:425-502-0739" class="profile-card__contact-phone-link">
425-502-0739
</a>
</div>
</div>
</div>
<div class="person-card__related">
</div>
</div>
</article>
<article class="person-card">
<div class="person-card__image">
<picture class="profile-card__picture">
<source srcset="https://placekitten.com/272/352?e" type="image/webp">
<source srcset="https://placekitten.com/272/352?e" type="image/jpeg">
<img class="profile-card__image" src="https://placekitten.com/272/352?e" data-cy="profile-card__image" width="260" height="160" alt='friendly kitten' />
</picture>
</div>
<div class="person-card__info-and-related">
<div class="person-card__info">
<div class="profile-card__title">
<div class="card-title">
<div class="card-title__title">
<h2 class="linked-title linked-title--">
<a href="#" class="linked-title__link">
Angela E. Stpierre
<span class="linked-title__link-icon">
<svg class="right-chevron" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="8" height="16" viewBox="0 0 8 16">
<path class="_mark right-chevron__shape" fill-rule="nonzero" d="M.232 1.65A1.028 1.028 0 0 1 .336.24a.937.937 0 0 1 1.356.11L8 8l-6.308 7.65a.937.937 0 0 1-1.356.11c-.403-.36-.45-.991-.104-1.41L5.466 8 .232 1.65z" />
</svg>
</span>
</a>
</h2>
</div>
</div>
</div>
<div class="profile-card__contact">
<div class="profile-card__contact-email">
<a href="mailto:AngelaEStpierre@armyspy.com" class="profile-card__contact-email-link">
AngelaEStpierre@armyspy.com
</a>
</div>
<div class="profile-card__contact-phone">
<a href="tel:706-307-8998" class="profile-card__contact-phone-link">
706-307-8998
</a>
</div>
</div>
</div>
<div class="person-card__related">
</div>
</div>
</article>
</div>
</div>
</div>
</div>
</div>
<div class="directory">
{% embed "templates/listing-content/listing-content.twig" with {
withCards: true,
} %}
{% block filter %}
{% include 'partials/taxonomy-filter/taxonomy-filter.twig' with {
includeSearch: true
} %}
{% endblock %}
{% block content %}
{% if post.list | length > 0 %}
<div class="directory__listing">
{% for person in post.list %}
{% include 'partials/profile-card/profile-card.twig' %}
{% endfor %}
</div>
{% else %}
{% include 'partials/empty-listing-error/empty-listing-error.twig' %}
{% endif %}
{% endblock %}
{% endembed %}
</div>
{
"fields": {
"title": "Meet our faculty",
"introText": "<p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas auguae, eu vulputate magna eros.</p>"
},
"count": 10,
"post": {
"list": [
{
"fullName": "John C. Gunnels",
"titles": "",
"featuredImage": {
"src": "https://placekitten.com/272/352?a",
"altText": "friendly kitten"
},
"emailAddress": "JohnCGunnels@teleworm.us",
"phoneNumber": "832-731-9009",
"permalink": "#"
},
{
"fullName": "Terence J. Galbraith",
"titles": "",
"featuredImage": {
"src": "https://placekitten.com/272/352?b",
"altText": "friendly kitten"
},
"emailAddress": "TerenceJGalbraith@jourrapide.com",
"phoneNumber": "623-327-6582",
"permalink": "#"
},
{
"fullName": "Wendy D. Sanchez",
"titles": "",
"featuredImage": {
"src": "https://placekitten.com/272/352?c",
"altText": "friendly kitten"
},
"emailAddress": "WendyDSanchez@teleworm.us",
"phoneNumber": "615-691-3250",
"permalink": "#"
},
{
"fullName": "Antone T. Grissom",
"titles": "",
"featuredImage": {
"src": "https://placekitten.com/272/352?d",
"altText": "friendly kitten"
},
"emailAddress": "AntoneTGrissom@rhyta.com",
"phoneNumber": "425-502-0739",
"permalink": "#"
},
{
"fullName": "Angela E. Stpierre",
"titles": "",
"featuredImage": {
"src": "https://placekitten.com/272/352?e",
"altText": "friendly kitten"
},
"emailAddress": "AngelaEStpierre@armyspy.com",
"phoneNumber": "706-307-8998",
"permalink": "#"
}
]
}
}
.directory
& .person-card__image--grid
display none
+above(600px)
display block
No notes defined.