<!-- Contact Info Multiple -->
<div class="contact_block_multiple">
<div class="fs-row">
<div class="fs-cell">
<div class="contact_block_multiple_inner">
<div class="contact_multiple">
<div class="contact_multiple_header">
<h2 class="contact_multiple_title">Contact Multiple Component</h2>
</div>
<div class="contact_multiple_body">
<div class="contact_multiple_details">
<div class="contact_multiple_detail image">
<figure class="contact_multiple_detail_figure">
<img class="contact_multiple_detail_image" srcset="https://images.fastspot.com/fim/300x300/1 300w, https://images.fastspot.com/fim/100x100/1 100w" src="https://images.fastspot.com/fim/100x100/1" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
<div class="contact_multiple_detail name">
<h2 class="contact_multiple_detail_info contact_multiple_detail_info_strong">Firstname Lastname</h2>
<div class="contact_multiple_detail_info contact_multiple_detail_info_em">Community Engagement Coordinator</div>
</div>
<div class="contact_multiple_detail contacts">
<div class="contact_multiple_detail_info">
<a class="contact_multiple_detail_info_link" href="tel:4105551234">(410) 555-1234</a>
</div>
<div class="contact_multiple_detail_info">
<a class="contact_multiple_detail_info_link" href="tel:community@thefim.org">community@thefim.org</a>
</div>
</div>
</div>
<div class="contact_multiple_details">
<div class="contact_multiple_detail image">
<figure class="contact_multiple_detail_figure">
<img class="contact_multiple_detail_image" srcset="https://images.fastspot.com/fim/300x300/1 300w, https://images.fastspot.com/fim/100x100/1 100w" src="https://images.fastspot.com/fim/100x100/1" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
<div class="contact_multiple_detail name">
<h2 class="contact_multiple_detail_info contact_multiple_detail_info_strong">Firstname Lastname</h2>
<div class="contact_multiple_detail_info contact_multiple_detail_info_em">Community Engagement Coordinator</div>
</div>
<div class="contact_multiple_detail contacts">
<div class="contact_multiple_detail_info">
<a class="contact_multiple_detail_info_link" href="tel:4105551234">(410) 555-1234</a>
</div>
<div class="contact_multiple_detail_info">
<a class="contact_multiple_detail_info_link" href="tel:community@thefim.org">community@thefim.org</a>
</div>
</div>
</div>
<div class="contact_multiple_details">
<div class="contact_multiple_detail image">
<figure class="contact_multiple_detail_figure">
<img class="contact_multiple_detail_image" srcset="https://images.fastspot.com/fim/300x300/1 300w, https://images.fastspot.com/fim/100x100/1 100w" src="https://images.fastspot.com/fim/100x100/1" alt="" loading="lazy" width="100" height="100">
</figure>
</div>
<div class="contact_multiple_detail name">
<h2 class="contact_multiple_detail_info contact_multiple_detail_info_strong">Firstname Lastname</h2>
<div class="contact_multiple_detail_info contact_multiple_detail_info_em">Community Engagement Coordinator</div>
</div>
<div class="contact_multiple_detail contacts">
<div class="contact_multiple_detail_info">
<a class="contact_multiple_detail_info_link" href="tel:4105551234">(410) 555-1234</a>
</div>
<div class="contact_multiple_detail_info">
<a class="contact_multiple_detail_info_link" href="tel:community@thefim.org">community@thefim.org</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END: Contact Info -->
{#
{% include '@component-contact-info' with {
item: {
name: 'Full Name',
job_title: 'Director of Department',
image: '1',
phone_numbers: [
{
label: 'mobile',
type: 'telephone',
number: '(410) 555-1234'
}
],
email: 'name@university.edu',
location: '1234 Maple Bacon Ln.<br>Baltimore, MD 21211',
office_hours: [
{
label: 'Monday',
hours: '9am - 5pm'
}
],
social_links: [
{
title: 'LinkedIn',
url: '#'
}
]
}
} %}
#}
<!-- Contact Info Multiple -->
<div class="contact_block_multiple">
<div class="fs-row">
<div class="fs-cell">
<div class="contact_block_multiple_inner">
<div class="contact_multiple">
<div class="contact_multiple_header">
<h2 class="contact_multiple_title">{{ title }}</h2>
</div>
<div class="contact_multiple_body">
{% for item in items %}
<div class="contact_multiple_details">
{% if item.image %}
<div class="contact_multiple_detail image">
<figure class="contact_multiple_detail_figure">
{% include '@partial-image' with {
class: 'contact_multiple_detail',
alt: '',
image: item.image,
loading: 'lazy',
sources: [
img.square.xxsml,
img.square.thumb
]
} %}
</figure>
</div>
{% endif %}
<div class="contact_multiple_detail name">
<h2 class="contact_multiple_detail_info contact_multiple_detail_info_strong">{{ item.name }}</h2>
<div class="contact_multiple_detail_info contact_multiple_detail_info_em">{{ item.job_title }}</div>
</div>
<div class="contact_multiple_detail contacts">
<div class="contact_multiple_detail_info">
<a class="contact_multiple_detail_info_link" href="tel:{{ tel(item.phone_number) }}">{{ item.phone_number }}</a>
</div>
<div class="contact_multiple_detail_info">
<a class="contact_multiple_detail_info_link" href="tel:{{ item.email }}">{{ item.email }}</a>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END: Contact Info -->
No notes defined.