<div class="my-4">
<h2 class="h3 text-center text-uppercase">Performances</h2>
<p class="text-center">All orders will be subject to a handling fee of £1.50 per ticket, capped at £6. This will show as an 'Order Fee' at checkout.</p>
</div>
<table class="performance-list d-block table table-borderless fs-5">
<thead class="d-none">
<tr class="performance-list--headings">
<th>Date</th>
<th>Time</th>
<th>Information</th>
<th>Price</th>
<th>Actions</th>
</tr>
</thead>
<tbody class="d-block">
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
Preview
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<span class="text-uppercase fs-6 d-inline-block align-middle">Sold out</span>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
<mark aria-label="Audio-Described" title="Audio-Described" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
AD
</mark> <mark aria-label="Captioned" title="Captioned" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
CAP
</mark> <mark aria-label="Touch Tour" title="Touch Tour" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
TT
</mark>
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<a href="#" class="btn btn-primary align-middle">Tickets</a>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<span class="text-uppercase fs-6 d-inline-block align-middle">Sold out</span>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<span class="text-uppercase fs-6 d-inline-block align-middle">Sold out</span>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<a href="#" class="btn btn-primary align-middle">Tickets</a>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<a href="#" class="btn btn-primary align-middle">Tickets</a>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<span class="text-uppercase fs-6 d-inline-block align-middle">Sold out</span>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
<mark aria-label="Audio-Described" title="Audio-Described" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
AD
</mark> <mark aria-label="Captioned" title="Captioned" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
CAP
</mark> <mark aria-label="Chilled" title="Chilled" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
CHILL
</mark> <mark aria-label="Relaxed" title="Relaxed" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
REL
</mark> <mark aria-label="Signed (Interpreted)" title="Signed (Interpreted)" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
BSL
</mark> <mark aria-label="Touch Tour" title="Touch Tour" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
TT
</mark>
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<a href="#" class="btn btn-primary align-middle">Tickets</a>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
Royal Command Performance
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<span class="text-uppercase fs-6 d-inline-block align-middle">Sold out</span>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
<mark aria-label="Audio-Described" title="Audio-Described" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
AD
</mark> <mark aria-label="Captioned" title="Captioned" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
CAP
</mark> <mark aria-label="Chilled" title="Chilled" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
CHILL
</mark>
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<a href="#" class="btn btn-primary align-middle">Tickets</a>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<span class="text-uppercase fs-6 d-inline-block align-middle">Sold out</span>
</td>
</tr>
<tr class="performance-list--item d-flex flex-wrap">
<td class="performance-list--item-date px-4 py-2"><span class="fw-bold align-middle">15 Aug</span></td>
<td class="performance-list--item-time px-4 py-2"><span class="fw-bold align-middle">12:34</span></td>
<td class="performance-list--item-title px-4 py-2 flex-grow-1">
<mark aria-label="Relaxed" title="Relaxed" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
REL
</mark> <mark aria-label="Signed (Interpreted)" title="Signed (Interpreted)" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
BSL
</mark> <mark aria-label="Touch Tour" title="Touch Tour" class="performance-access-tag d-inline-block badge text-bg-dark rounded text-center fs-6 fw-bold align-middle m-0 py-0">
TT
</mark>
</td>
<td class="performance-list--item-price px-4 py-2"><span class="fw-bold align-middle">£12.34</span></td>
<td class="performance-list--item-actions px-4 py-2 flex-shrink-0">
<span class="text-uppercase fs-6 d-inline-block align-middle">Sold out</span>
</td>
</tr>
</tbody>
</table>
<div class="my-4">
<h2 class="h3 text-center text-uppercase">Performances</h2>
<p class="text-center">All orders will be subject to a handling fee of £1.50 per ticket, capped at £6. This will show as an 'Order Fee' at checkout.</p>
</div>
<table class="performance-list d-block table table-borderless fs-5">
<thead class="d-none">
<tr class="performance-list--headings">
<th>Date</th>
<th>Time</th>
<th>Information</th>
<th>Price</th>
<th>Actions</th>
</tr>
</thead>
<tbody class="d-block">
{% render "@performance-list-item" with {
title: "Preview",
sold_out: true
} %}
{% render "@performance-list-item" with {
title: "",
access_tags: [
{ label: "AD", title: "Audio-Described" },
{ label: "CAP", title: "Captioned" },
{ label: "TT", title: "Touch Tour" }
]
} %}
{% render "@performance-list-item" with {
title: "",
sold_out: true
} %}
{% render "@performance-list-item" with {
title: "",
sold_out: true
} %}
{% render "@performance-list-item" with {
title: ""
} %}
{% render "@performance-list-item" with {
title: ""
} %}
{% render "@performance-list-item" with {
title: "",
sold_out: true
} %}
{% render "@performance-list-item" with {
title: "",
access_tags: [
{ label: "AD", title: "Audio-Described" },
{ label: "CAP", title: "Captioned" },
{ label: "CHILL", title: "Chilled" },
{ label: "REL", title: "Relaxed" },
{ label: "BSL", title: "Signed (Interpreted)" },
{ label: "TT", title: "Touch Tour" }
]
} %}
{% render "@performance-list-item" with {
title: "Royal Command Performance",
sold_out: true
} %}
{% render "@performance-list-item" with {
title: "",
access_tags: [
{ label: "AD", title: "Audio-Described" },
{ label: "CAP", title: "Captioned" },
{ label: "CHILL", title: "Chilled" },
]
} %}
{% render "@performance-list-item" with {
title: "",
sold_out: true
} %}
{% render "@performance-list-item" with {
title: "",
access_tags: [
{ label: "REL", title: "Relaxed" },
{ label: "BSL", title: "Signed (Interpreted)" },
{ label: "TT", title: "Touch Tour" }
],
sold_out: true
} %}
</tbody>
</table>
/* No context defined. */
No notes defined.