<!-- Basic contact card -->
<div class="card">
<div class="card-body">
<h5 class="font-size-lg card-title mb-3 py-1">Chicago, USA</h5>
<ul class="contact-list">
<li>
<div class="contact-icon">
<i data-feather="map-pin"></i>
</div>
<div class="contact-details">
<span>Find us</span>
<a href="link-to-google-map" class="contact-link">769, Industrial Dr, West Chicago, IL 60185, USA</a>
</div>
</li>
<li>
<div class="contact-icon">
<i data-feather="phone"></i>
</div>
<div class="contact-details">
<span>Call us</span>
<a href="tel:+184725276533" class="contact-link">+1 (847) 252 765 33</a>
</div>
</li>
<li>
<div class="contact-icon">
<i data-feather="mail"></i>
</div>
<div class="contact-details">
<span>Write us</span>
<a href="mailto:email@example.com" class="contact-link">email@example.com</a>
</div>
</li>
</ul>
</div>
</div>
// Basic contact card
.card
.card-body
h5.font-size-lg.card-title.mb-3.py-1 Chicago, USA
ul.contact-list
li
.contact-icon
i(data-feather="map-pin")
.contact-details
span.contact-label Find us
a.contact-link(href="link-to-google-map") 769, Industrial Dr, West Chicago, IL 60185, USA
li
.contact-icon
i(data-feather="phone")
.contact-details
span.contact-label Call us
a.contact-link(href="tel:+184725276533") +1 (847) 252 765 33
li
.contact-icon
i(data-feather="mail")
.contact-details
span.contact-label Write us
a.contact-link(href="mailto:email@example.com") email@example.com
<!-- Contact card with image -->
<div class="card">
<img src="path-to-image" class="card-img-top" alt="Chicago">
<div class="card-body">
<h5 class="font-size-lg card-title mb-3 py-1">Chicago, USA</h5>
<ul class="contact-list">
<li>
<div class="contact-icon">
<i data-feather="map-pin"></i>
</div>
<div class="contact-details">
<span>Find us</span>
<a href="link-to-google-map" class="contact-link">769, Industrial Dr, West Chicago, IL 60185, USA</a>
</div>
</li>
<li>
<div class="contact-icon">
<i data-feather="phone"></i>
</div>
<div class="contact-details">
<span>Call us</span>
<a href="tel:+184725276533" class="contact-link">+1 (847) 252 765 33</a>
</div>
</li>
<li>
<div class="contact-icon">
<i data-feather="mail"></i>
</div>
<div class="contact-details">
<span>Write us</span>
<a href="mailto:email@example.com" class="contact-link">email@example.com</a>
</div>
</li>
</ul>
</div>
</div>
// Contact card with image
.card
+image("path-to-image", "Chicago")(class="card-img-top")
.card-body
h5.font-size-lg.card-title.mb-3.py-1 Chicago, USA
ul.contact-list
li
.contact-icon
i(data-feather="map-pin")
.contact-details
span.contact-label Find us
a.contact-link(href="link-to-google-map") 769, Industrial Dr, West Chicago, IL 60185, USA
li
.contact-icon
i(data-feather="phone")
.contact-details
span.contact-label Call us
a.contact-link(href="tel:+184725276533") +1 (847) 252 765 33
li
.contact-icon
i(data-feather="mail")
.contact-details
span.contact-label Write us
a.contact-link(href="mailto:email@example.com") email@example.com
<!-- Contact card with Google map -->
<div class="card">
<iframe width="600" height="250" id="gmap_canvas" src="link-to-map"></iframe>
<div class="card-body">
<h5 class="font-size-lg card-title mb-3 py-1">Chicago, USA</h5>
<ul class="contact-list">
<li>
<div class="contact-icon">
<i data-feather="map-pin"></i>
</div>
<div class="contact-details">
<span>Find us</span>
<a href="link-to-google-map" class="contact-link">769, Industrial Dr, West Chicago, IL 60185, USA</a>
</div>
</li>
<li>
<div class="contact-icon">
<i data-feather="phone"></i>
</div>
<div class="contact-details">
<span>Call us</span>
<a href="tel:+184725276533" class="contact-link">+1 (847) 252 765 33</a>
</div>
</li>
<li>
<div class="contact-icon">
<i data-feather="mail"></i>
</div>
<div class="contact-details">
<span>Write us</span>
<a href="mailto:email@example.com" class="contact-link">email@example.com</a>
</div>
</li>
</ul>
</div>
</div>
// Contact card with Google map
.card
iframe(width="600", height="250", id="gmap_canvas", src="link-to-map")
.card-body
h5.font-size-lg.card-title.mb-3.py-1 Chicago, USA
ul.contact-list
li
.contact-icon
i(data-feather="map-pin")
.contact-details
span.contact-label Find us
a.contact-link(href="link-to-google-map") 769, Industrial Dr, West Chicago, IL 60185, USA
li
.contact-icon
i(data-feather="phone")
.contact-details
span.contact-label Call us
a.contact-link(href="tel:+184725276533") +1 (847) 252 765 33
li
.contact-icon
i(data-feather="mail")
.contact-details
span.contact-label Write us
a.contact-link(href="mailto:email@example.com") email@example.com