Info Window
The info window component is used to show a brief summary of content. Example: used within the context of a Google map, the info window shows more details about any map marker when clicked.
{{ attach_library('h4h_theme/info-window') }}
{% import '@h4h_theme/icons/icons.twig' as icons %}
<div style="position: relative; height: 300px">
<section class="info-window is-active">
<button class="info-window__close">{{ icons.get('close', 'icon info-window__icon') }}</button>
<h2 class="info-window__heading">{{ heading }}</h2>
<div class="info-window__desc">{{ desc|raw }}</div>
<div class="info-window__group">
<a class="info-window__btn" href="{{ phone }}">{{ icons.get('phone', 'icon info-window__icon') }}</a>
<a class="info-window__btn" href="{{ email }}">{{ icons.get('mail', 'icon info-window__icon') }}</a>
<a class="info-window__btn" href="{{ website }}">{{ icons.get('website', 'icon info-window__icon') }}</a>
</div>
</section>
</div>