<form class="performance-filter-form">
<div class="container-fluid">
<div class="row my-2">
<div class="col-12 col-md-4 px-1 ps-md-2 pe-md-3">
<div class="d-grid gap-2">
<label id="label-date" aria-labels="section-date">
Date
</label>
</div>
<div id="section-date" class="container-fluid">
<div class="row my-2">
<div class="col-6 border-end border-secondary border-2 pb-2">
<label for="date" class="form-label">From</label>
<input type="date" class="form-control" id="date" name="date" value="" size="60" maxlength="128" placeholder="">
</div>
<div class="col-6 pb-2">
<label for="date" class="form-label">To</label>
<input type="date" class="form-control" id="date" name="date" value="" size="60" maxlength="128" placeholder="">
</div>
</div>
</div>
<div class="d-grid gap-2">
<label id="label-time" aria-labels="section-time">
Time
</label>
</div>
<div id="section-time" class="container-fluid">
<div class="row my-2">
<div class="col-6 border-end border-secondary border-2 pb-2">
<div class="time-select-group">
<label for="time-select-group" class="form-label">From</label>
<div class="container-fluid">
<div id="time-select-group" class="row">
<div class="col-6 p-0 pe-1">
<div>
<select id="radio" name="radio" class="form-select" aria-label="From (hour)">
<option selected>--</option>
<option value="0">00</option>
<option value="1">01</option>
<option value="2">02</option>
<option value="3">03</option>
<option value="4">04</option>
<option value="5">05</option>
<option value="6">06</option>
<option value="7">07</option>
<option value="8">08</option>
<option value="9">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
</select>
</div>
</div>
<div class="col-6 p-0 ps-1">
<div>
<select id="radio" name="radio" class="form-select" aria-label="From (minute)">
<option selected>--</option>
<option value="0">00</option>
<option value="15">15</option>
<option value="30">30</option>
<option value="45">45</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6 pb-2">
<div class="time-select-group">
<label for="time-select-group" class="form-label">To</label>
<div class="container-fluid">
<div id="time-select-group" class="row">
<div class="col-6 p-0 pe-1">
<div>
<select id="radio" name="radio" class="form-select" aria-label="To (hour)">
<option selected>--</option>
<option value="0">00</option>
<option value="1">01</option>
<option value="2">02</option>
<option value="3">03</option>
<option value="4">04</option>
<option value="5">05</option>
<option value="6">06</option>
<option value="7">07</option>
<option value="8">08</option>
<option value="9">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
</select>
</div>
</div>
<div class="col-6 p-0 ps-1">
<div>
<select id="radio" name="radio" class="form-select" aria-label="To (minute)">
<option selected>--</option>
<option value="0">00</option>
<option value="15">15</option>
<option value="30">30</option>
<option value="45">45</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<hr class="my-2 d-md-none">
<div class="col-12 col-md-4 px-1 ps-md-3 pe-md-3 border-start border-secondary border-2 border-md-down-none">
<div class="d-grid gap-2">
<label id="label-performance-location" class="filter-form__heading chevron chevron-down" data-bs-toggle="collapse" data-bs-target="#section-performance-location" aria-expanded="false" aria-controls="section-performance-location">
Location
</label>
</div>
<div id="section-performance-location" class="my-2 collapse d-md-block" aria-labelledby="label-performance-location">
<div id="edit-location-performance" class="form-boolean-group form-checkboxes"><input type="checkbox" class="btn-check" id="location-performance-edinburgh" name="location-performance-edinburgh" value=""><label for="location-performance-edinburgh" class=" btn btn-primary d-inline-block my-1 me-1">Edinburgh</label><input type="checkbox" class="btn-check" id="location-performance-london" name="location-performance-london" value=""><label for="location-performance-london" class=" btn btn-primary d-inline-block my-1 me-1">London</label><input type="checkbox" class="btn-check" id="location-performance-pleasance-courtyard" name="location-performance-pleasance-courtyard" value=""><label for="location-performance-pleasance-courtyard" class=" btn btn-primary d-inline-block my-1 me-1">Pleasance Courtyard</label><input type="checkbox" class="btn-check" id="location-performance-main-house" name="location-performance-main-house" value=""><label for="location-performance-main-house" class=" btn btn-primary d-inline-block my-1 me-1">Main House</label></div>
</div>
</div>
<hr class="my-2 d-md-none">
<div class="col-12 col-md-4 d-flex flex-column justify-content-end border-start border-2 border-secondary border-md-down-none px-1 ps-md-3 pe-md-2">
<div>
<p class="d-grid gap-2 my-2">
<button type="submit" class="btn btn-apply chevron order-2" id="button" name="button">Apply filters</button>
<button type="submit" class="btn btn-primary order-1" id="button" name="button">Clear filters</button>
</p>
</div>
</div>
</div>
</div>
</form>
<form class="performance-filter-form">
<div class="container-fluid">
<div class="row my-2">
<div class="col-12 col-md-4 px-1 ps-md-2 pe-md-3">
<div class="d-grid gap-2">
<label id="label-date" aria-labels="section-date">
Date
</label>
</div>
<div id="section-date" class="container-fluid">
<div class="row my-2">
<div class="col-6 border-end border-secondary border-2 pb-2">
{% render "@input-date" with { "title": "From" } %}
</div>
<div class="col-6 pb-2">
{% render "@input-date" with { "title": "To" } %}
</div>
</div>
</div>
<div class="d-grid gap-2">
<label id="label-time" aria-labels="section-time">
Time
</label>
</div>
<div id="section-time" class="container-fluid">
<div class="row my-2">
<div class="col-6 border-end border-secondary border-2 pb-2">
{% render "@time-select-group" with { "title": "From" } %}
</div>
<div class="col-6 pb-2">
{% render "@time-select-group" with { "title": "To" } %}
</div>
</div>
</div>
</div>
<hr class="my-2 d-md-none">
<div class="col-12 col-md-4 px-1 ps-md-3 pe-md-3 border-start border-secondary border-2 border-md-down-none">
<div class="d-grid gap-2">
<label id="label-performance-location" class="filter-form__heading chevron chevron-down" data-bs-toggle="collapse" data-bs-target="#section-performance-location" aria-expanded="false" aria-controls="section-performance-location">
Location
</label>
</div>
<div id="section-performance-location" class="my-2 collapse d-md-block" aria-labelledby="label-performance-location">
{% apply spaceless %}
<div id="edit-location-performance" class="form-boolean-group form-checkboxes">
{% render "@input-checkbox" with { "id": "location-performance-edinburgh", "toggle": true, "inline": true, "title": "Edinburgh" } %}
{% render "@input-checkbox" with { "id": "location-performance-london", "toggle": true, "inline": true, "title": "London" } %}
{% render "@input-checkbox" with { "id": "location-performance-pleasance-courtyard", "toggle": true, "inline": true, "title": "Pleasance Courtyard" } %}
{% render "@input-checkbox" with { "id": "location-performance-main-house", "toggle": true, "inline": true, "title": "Main House" } %}
</div>
{% endapply %}
</div>
</div>
<hr class="my-2 d-md-none">
<div class="col-12 col-md-4 d-flex flex-column justify-content-end border-start border-2 border-secondary border-md-down-none px-1 ps-md-3 pe-md-2">
<div>
<p class="d-grid gap-2 my-2">
<button type="submit" class="btn btn-apply chevron order-2" id="button" name="button">Apply filters</button>
<button type="submit" class="btn btn-primary order-1" id="button" name="button">Clear filters</button>
</p>
</div>
</div>
</div>
</div>
</form>
/* No context defined. */
No notes defined.