<div class="o-col o-col-sm-md-4 c-header__menu-actions">
<h2 class="u-sr-only">Helpful Items</h2>
<div class="c-header__search">
<form class="c-header__search-form">
<div class="o-fancy-form-item o-fancy-input">
<label class="c-header__search-label o-fancy-form-item__label" for="header-menu-search-input-2270">Search</label>
<input class="c-header__search-input o-fancy-form-item__input" type="search" id="header-menu-search-input-2270" />
<span class="c-header__search-icon" aria-hidden="true">
<svg width="14" height="14" viewbox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path class="u-ct-stroke" d="M6.90519 12.5466C10.1665 12.5466 12.8104 9.96179 12.8104 6.77329C12.8104 3.58479 10.1665 1 6.90519 1C3.64383 1 1 3.58479 1 6.77329C1 9.96179 3.64383 12.5466 6.90519 12.5466Z" class="u-ct-stroke" stroke-width="1.5" stroke-miterlimit="10" />
<path class="u-ct-stroke" d="M11.0859 10.8608L15.9998 15.6649" class="u-ct-stroke" stroke-width="1.5" stroke-miterlimit="10" />
</svg>
</span>
</div>
</form>
</div>
<p class="c-header__hours f-text--small">The Academy is open today<br /><span>10 am - 5:00 pm</span></p>
<div class="c-header__ticket">
<a href="#" class="c-header__ticket-link o-btn o-btn--primary">Buy a Ticket</a>
</div>
<ul class="c-header__helpful-items" aria-label="Helpful Links">
<li class="c-header__helpful-item">
<a href="#" class="c-header__helpful-link">Become a Member</a>
</li>
<li class="c-header__helpful-item">
<a href="#" class="c-header__helpful-link">Donate</a>
</li>
</ul>
</div>
{% set inputID = 'header-menu-search-input-' ~ random(5000) %}
<div class="o-col o-col-sm-md-4 c-header__menu-actions">
<h2 class="u-sr-only">Helpful Items</h2>
<div class="c-header__search">
<form class="c-header__search-form">
<div class="o-fancy-form-item o-fancy-input">
<label class="c-header__search-label o-fancy-form-item__label" for="{{ inputID }}">Search</label>
<input class="c-header__search-input o-fancy-form-item__input" type="search" id="{{ inputID }}" />
<span class="c-header__search-icon" aria-hidden="true">
{% include "03-icons/search" %}
</span>
</div>
</form>
</div>
<p class="c-header__hours f-text--small">The Academy is open today<br/><span>{{ todaysHours }}</span></p>
{% if modalTicketURL %}
<div class="c-header__ticket">
<a href="{{ modalTicketURL }}" class="c-header__ticket-link o-btn o-btn--primary">Buy a Ticket</a>
</div>
{% endif %}
<ul class="c-header__helpful-items" aria-label="Helpful Links">
{% for link in modalLinks %}
<li class="c-header__helpful-item">
<a href="{{ link.url }}" class="c-header__helpful-link">{{ link.title }}</a>
</li>
{% endfor %}
</ul>
</div>
{
"pageColorTheme": "teal",
"todaysHours": "10 am - 5:00 pm",
"modalTicketURL": "#",
"modalLinks": [
{
"title": "Become a Member",
"url": "#"
},
{
"title": "Donate",
"url": "#"
}
]
}
No notes defined.