<div class="
page-header
" id="page-header">
<div class="page-header__inner">
<div class="fw-container">
<div class="
page-header__group
page-header__group--wide
">
<div class="page-header__breadcrumb">
<div class="page-header__breadcrumb-inner">
<div class="
breadcrumb
" id="breadcrumb-10">
<nav class="breadcrumb__nav" aria-labelledby="breadcrumb-10__nav-title">
<div class="breadcrumb__nav-header">
<h2 class="breadcrumb__nav-title" id="breadcrumb-10__nav-title">
You are here:
</h2>
</div>
<ol class="breadcrumb__list" aria-labelledby="breadcrumb-10__nav-title">
<li class="breadcrumb__item breadcrumb__item--home">
<a class="breadcrumb__pill breadcrumb__pill--link" href="#">
<span class="breadcrumb__pill-inner">
<span class="breadcrumb__pill-icon" aria-hidden="true">
<svg class="icon icon--home">
<use href="/images/icons.svg?1.0.0#home" />
</svg>
</span>
<span class="breadcrumb__pill-label">
Home
</span>
</span>
</a>
<span class="breadcrumb__divider" aria-hidden="true">
<svg class="icon icon--caret-right">
<use href="/images/icons.svg?1.0.0#caret-right" />
</svg>
</span>
</li>
<li class="breadcrumb__item" aria-current="page">
<span class="breadcrumb__pill">
<span class="breadcrumb__pill-inner">
<span class="breadcrumb__pill-label">Upcoming Events</span>
</span>
</span>
</li>
</ol>
</nav>
</div>
</div>
</div>
<div class="page-header__intro" id="skip-main-destination" tabindex="-1">
<div class="page-header__intro-inner">
<h1 class="page-header__title" id="page-header__title" tabindex="-1">Upcoming Events</h1>
<p class="page-header__description">
Dis facilisis tellus ultricies vestibulum cubilia risus, blandit commodo hac ut posuere ex cursus, class libero imperdiet nullam odio.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="full-width-components" id="full-width-components" tabindex="-1">
<!-- Filter -->
<div class="filter" id="filter-5">
<div class="fw-container">
<div class="filter__inner">
<form class="filter__form" action="#" method="get">
<div class="filter__form-item filter__form-item--select">
<label class="filter__form-item-label" for="filter__form-item-select-1">Category</label>
<div class="filter__form-item-select-wrapper">
<select class="filter__form-item-select" id="filter__form-item-select-1">
<option value="All Categories">All Categories</option>
<option value="Category One">Category One</option>
<option value="Another Category">Another Category</option>
</select>
<span class="filter__form-item-select-icon" aria-hidden="true">
<svg class="icon icon--expand">
<use href="/images/icons.svg?1.0.0#expand" />
</svg>
</span>
</div>
</div>
<div class="filter__form-item filter__form-item--search">
<label class="filter__form-item-label" for="filter-5__search">
Search
</label>
<div class="filter__form-item-search-wrapper">
<input class="filter__form-item-search-input" id="filter-5__search" placeholder="Search by keyword" type="search">
<span class="filter__form-item-search-icon" aria-hidden="true">
<svg class="icon icon--search">
<use href="/images/icons.svg?1.0.0#search" />
</svg>
</span>
</div>
</div>
<div class="filter__form-item filter__form-item--action">
<div class="filter__form-item-submit">
<button class="filter__form-submit
" type="submit">
<span class="filter__form-submit-inner"> <span class="filter__form-submit-label">Submit</span>
<span class="filter__form-submit-icon" aria-hidden="true"><svg class="icon icon--arrow-right-alt">
<use href="/images/icons.svg?1.0.0#arrow-right-alt" />
</svg></span>
</span>
</button>
</div>
</div>
</form>
<div class="filter__results">
<p class="filter__results-description">
<span class="filter__results-label">
0 Results found for
</span>
<span class="filter__results-category">search string</span>
</p>
<div class="filter__results-action">
<a class="filter__results-reset-link
" href="#">
<span class="filter__results-reset-link-inner"> <span class="filter__results-reset-link-label">Reset Selections</span>
<span class="filter__results-reset-link-icon" aria-hidden="true">
<svg class="icon icon--reset">
<use href="/images/icons.svg?1.0.0#reset" />
</svg>
</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- END: Filter -->
<div class="no-results-message" id="no-results-message-1">
<div class="fw-container">
<div class="no-results-message__inner typography">
<p>There are no results matching these criteria.</p>
</div>
</div>
</div>
</div>
{% include '@component-page-header--wide' with {
page: page
} %}
<div
class="full-width-components"
id="full-width-components"
tabindex="-1"
>
{% include '@component-filter' with {
title: '',
action_category: '#',
selects: [
{
label: 'Category',
options: [
{
title: 'All Categories'
},
{
title: 'Category One'
},
{
title: 'Another Category'
}
]
}
],
search_placeholder: 'Search by keyword',
results: '0',
category: 'search string'
} %}
{% render '@component-no-results-message' %}
</div>
No notes defined.