-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
373 lines (349 loc) · 24.8 KB
/
Copy pathindex.html
File metadata and controls
373 lines (349 loc) · 24.8 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
<!doctype html>
<html lang="en" data-bs-theme="dark">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Summit — Free Bootstrap 6 Conference & Event Website Template</title>
<meta name="description" content="Summit is a free Bootstrap 6 conference template — oversized marquee hero, live countdown, day-tabbed schedule table, speakers, tickets and a fixed booking bar.">
<link rel="stylesheet" href="assets/vendor/bootstrap6/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/base.css">
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body data-bs-spy="scroll" data-bs-target="#navScroll" data-bs-top-margin="96px" data-bs-smooth-scroll="true">
<a class="visually-hidden-focusable btn-solid theme-primary m-2" href="#main">Skip to main content</a>
<header class="site-header">
<nav class="navbar lg:navbar-expand" aria-label="Main">
<div class="container">
<a class="navbar-brand d-flex align-items-center gap-2 fw-semibold" href="index.html">
<span class="brand-mark" aria-hidden="true">S</span> Summit 26
</a>
<dialog class="drawer drawer-end" tabindex="-1" id="navDrawer" aria-labelledby="navDrawerLabel">
<div class="drawer-header">
<h5 class="drawer-title" id="navDrawerLabel">Menu</h5>
<button type="button" class="btn-close" data-bs-dismiss="drawer" aria-label="Close"></button>
</div>
<div class="drawer-body mb-2 lg:mb-0">
<ul class="nav navbar-nav me-auto" id="navScroll">
<li class="nav-item"><a class="nav-link" href="#speakers">Speakers</a></li>
<li class="nav-item"><a class="nav-link" href="#schedule">Schedule</a></li>
<li class="nav-item"><a class="nav-link" href="#tickets">Tickets</a></li>
<li class="nav-item"><a class="nav-link" href="#venue">Venue</a></li>
<li class="nav-item"><a class="nav-link" href="#faq">FAQ</a></li>
</ul>
</div>
</dialog>
<div class="d-flex align-items-center gap-2 ms-auto">
<button class="btn-icon" type="button" id="themeToggle" aria-label="Toggle color mode">
<svg class="theme-icon-light" width="18" height="18" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" aria-hidden="true"><circle cx="8" cy="8" r="3.25"/><path d="M8 1v1.5M8 13.5V15M15 8h-1.5M2.5 8H1m11-4-1 1M5 11l-1 1m0-8 1 1m6 6 1 1"/></svg>
<svg class="theme-icon-dark" width="18" height="18" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M6 .278a.77.77 0 0 1 .08.858 7.2 7.2 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277q.792-.001 1.533-.16a.79.79 0 0 1 .81.316.73.73 0 0 1-.031.893A8.35 8.35 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.75.75 0 0 1 6 .278"/></svg>
</button>
<button class="btn-icon navbar-toggler" type="button" data-bs-toggle="drawer" data-bs-target="#navDrawer" aria-controls="navDrawer" aria-label="Open navigation">
<span class="navbar-toggler-icon" aria-hidden="true"></span>
</button>
</div>
</div>
</nav>
</header>
<!-- Marquee hero -->
<section class="marquee has-hero-img" style="--hero-pos:center 30%">
<img class="hero-bg" src="img/hero.jpg" alt="" width="1800" height="1000" loading="eager">
<div class="container">
<p class="eyebrow fs-sm fg-primary mb-4">The engineering leadership conference</p>
<h1 class="marquee-title mb-5">Summit<br><span class="marquee-accent">Twenty‑Six</span></h1>
<div class="d-flex flex-wrap align-items-center gap-4 mb-6">
<span class="datebox"><b>14–16</b><span>October 2026</span></span>
<span class="fs-lg fg-2">Barbican Centre, London</span>
</div>
<div class="countdown mb-6" id="countdown" aria-label="Time until the conference">
<span class="count-cell"><b id="cdD">78</b><span>Days</span></span>
<span class="count-cell"><b id="cdH">14</b><span>Hours</span></span>
<span class="count-cell"><b id="cdM">22</b><span>Mins</span></span>
<span class="count-cell"><b id="cdS">09</b><span>Secs</span></span>
</div>
<div class="d-flex flex-wrap gap-3">
<a class="btn-solid theme-primary btn-lg" href="#tickets">Get tickets</a>
<a class="btn-outline theme-secondary btn-lg" href="#schedule">See the schedule</a>
</div>
</div>
</section>
<main id="main">
<!-- Numbers -->
<section class="section pb-0">
<div class="container">
<dl class="stat-band">
<div><dt>3</dt><dd>days, two tracks</dd></div>
<div><dt>42</dt><dd>speakers, no keynote fluff</dd></div>
<div><dt>1,200</dt><dd>attendees, capped</dd></div>
<div><dt>11</dt><dd>years running</dd></div>
</dl>
</div>
</section>
<!-- Speakers -->
<section class="section" id="speakers">
<div class="container">
<div class="d-flex flex-wrap justify-content-between align-items-end gap-3 mb-6">
<div>
<p class="eyebrow fs-sm fg-primary mb-2">Speakers</p>
<h2 class="fs-4xl fw-bold mb-0" style="letter-spacing:-.03em">Who's talking</h2>
</div>
<p class="fg-3 fs-sm mb-0">42 confirmed · more announced monthly</p>
</div>
<div class="row g-4">
<div class="sm:col-6 lg:col-3"><article class="speaker"><div class="ph ph-1x1">PN</div><div class="speaker-name"><p class="fw-semibold mb-0">Priya Nadkarni</p><p class="fs-xs mb-0" style="opacity:.75">VP Engineering, Northwind</p></div></article></div>
<div class="sm:col-6 lg:col-3"><article class="speaker"><div class="ph ph-1x1">EL</div><div class="speaker-name"><p class="fw-semibold mb-0">Erik Lindqvist</p><p class="fs-xs mb-0" style="opacity:.75">CTO, Kestrel</p></div></article></div>
<div class="sm:col-6 lg:col-3"><article class="speaker"><div class="ph ph-1x1">DR</div><div class="speaker-name"><p class="fw-semibold mb-0">Dana Reyes</p><p class="fs-xs mb-0" style="opacity:.75">Principal Engineer, Lumen</p></div></article></div>
<div class="sm:col-6 lg:col-3"><article class="speaker"><div class="ph ph-1x1">TB</div><div class="speaker-name"><p class="fw-semibold mb-0">Tomas Bergman</p><p class="fs-xs mb-0" style="opacity:.75">Director of Platform, Fieldstone</p></div></article></div>
<div class="sm:col-6 lg:col-3"><article class="speaker"><div class="ph ph-1x1">AO</div><div class="speaker-name"><p class="fw-semibold mb-0">Amara Okafor</p><p class="fs-xs mb-0" style="opacity:.75">Head of SRE, Arbor</p></div></article></div>
<div class="sm:col-6 lg:col-3"><article class="speaker"><div class="ph ph-1x1">ML</div><div class="speaker-name"><p class="fw-semibold mb-0">Marcus Leclerc</p><p class="fs-xs mb-0" style="opacity:.75">Engineering Manager, Kestrel</p></div></article></div>
<div class="sm:col-6 lg:col-3"><article class="speaker"><div class="ph ph-1x1">JW</div><div class="speaker-name"><p class="fw-semibold mb-0">Joy Whitmore</p><p class="fs-xs mb-0" style="opacity:.75">Staff Engineer, Lumen</p></div></article></div>
<div class="sm:col-6 lg:col-3"><article class="speaker"><div class="ph ph-1x1">+34</div><div class="speaker-name"><p class="fw-semibold mb-0">34 more</p><p class="fs-xs mb-0" style="opacity:.75">Full line-up announced in August</p></div></article></div>
</div>
</div>
</section>
<!-- Schedule -->
<section class="section bg-2" id="schedule">
<div class="container">
<div class="mb-6">
<p class="eyebrow fs-sm fg-primary mb-2">Schedule</p>
<h2 class="fs-4xl fw-bold mb-0" style="letter-spacing:-.03em">Three days, two tracks</h2>
</div>
<ul class="nav nav-tabs mb-4" id="dayTab" role="tablist">
<li class="nav-item" role="presentation"><button class="nav-link active" id="d1-tab" data-bs-toggle="tab" data-bs-target="#d1" type="button" role="tab" aria-controls="d1" aria-selected="true">Wed 14</button></li>
<li class="nav-item" role="presentation"><button class="nav-link" id="d2-tab" data-bs-toggle="tab" data-bs-target="#d2" type="button" role="tab" aria-controls="d2" aria-selected="false">Thu 15</button></li>
<li class="nav-item" role="presentation"><button class="nav-link" id="d3-tab" data-bs-toggle="tab" data-bs-target="#d3" type="button" role="tab" aria-controls="d3" aria-selected="false">Fri 16</button></li>
</ul>
<div class="tab-content">
<div class="tab-pane fade show active" id="d1" role="tabpanel" aria-labelledby="d1-tab" tabindex="0">
<div class="table-responsive">
<table class="sched">
<caption class="visually-hidden">Wednesday 14 October schedule</caption>
<thead><tr><th scope="col">Time</th><th scope="col">Session</th><th scope="col">Speaker</th><th scope="col">Track</th></tr></thead>
<tbody>
<tr><td class="time">09:00</td><td><strong>Registration & coffee</strong></td><td class="fg-3">—</td><td><span class="chip track-tag">All</span></td></tr>
<tr><td class="time">10:00</td><td><strong>The org chart is the architecture</strong><p class="fg-3 fs-sm mb-0">Why your services look like your reporting lines, and what to do about it.</p></td><td>Priya Nadkarni</td><td><span class="chip track-tag">Leadership</span></td></tr>
<tr><td class="time">11:15</td><td><strong>Cutting a 40-minute build to four</strong><p class="fg-3 fs-sm mb-0">A year of unglamorous CI work, itemised.</p></td><td>Dana Reyes</td><td><span class="chip track-tag">Platform</span></td></tr>
<tr><td class="time">13:45</td><td><strong>Hiring without take-home tests</strong></td><td>Marcus Leclerc</td><td><span class="chip track-tag">Leadership</span></td></tr>
<tr><td class="time">15:00</td><td><strong>Incident review, live</strong><p class="fg-3 fs-sm mb-0">A real postmortem run on stage, with the people who were there.</p></td><td>Amara Okafor</td><td><span class="chip track-tag">Platform</span></td></tr>
<tr><td class="time">17:00</td><td><strong>Opening party</strong></td><td class="fg-3">—</td><td><span class="chip track-tag">All</span></td></tr>
</tbody>
</table>
</div>
</div>
<div class="tab-pane fade" id="d2" role="tabpanel" aria-labelledby="d2-tab" tabindex="0">
<div class="table-responsive">
<table class="sched">
<caption class="visually-hidden">Thursday 15 October schedule</caption>
<thead><tr><th scope="col">Time</th><th scope="col">Session</th><th scope="col">Speaker</th><th scope="col">Track</th></tr></thead>
<tbody>
<tr><td class="time">09:30</td><td><strong>Platform teams that people actually use</strong></td><td>Tomas Bergman</td><td><span class="chip track-tag">Platform</span></td></tr>
<tr><td class="time">10:45</td><td><strong>Migrating 400 services without a freeze</strong></td><td>Erik Lindqvist</td><td><span class="chip track-tag">Platform</span></td></tr>
<tr><td class="time">13:30</td><td><strong>Performance reviews for engineers</strong><p class="fg-3 fs-sm mb-0">What to measure when velocity is a lie.</p></td><td>Joy Whitmore</td><td><span class="chip track-tag">Leadership</span></td></tr>
<tr><td class="time">15:15</td><td><strong>Open spaces</strong><p class="fg-3 fs-sm mb-0">Attendee-proposed sessions, decided that morning.</p></td><td class="fg-3">—</td><td><span class="chip track-tag">All</span></td></tr>
</tbody>
</table>
</div>
</div>
<div class="tab-pane fade" id="d3" role="tabpanel" aria-labelledby="d3-tab" tabindex="0">
<div class="table-responsive">
<table class="sched">
<caption class="visually-hidden">Friday 16 October schedule</caption>
<thead><tr><th scope="col">Time</th><th scope="col">Session</th><th scope="col">Speaker</th><th scope="col">Track</th></tr></thead>
<tbody>
<tr><td class="time">09:30</td><td><strong>Workshops begin</strong><p class="fg-3 fs-sm mb-0">Six parallel sessions, 25 people each. Workshop ticket required.</p></td><td class="fg-3">Various</td><td><span class="chip track-tag">Workshop</span></td></tr>
<tr><td class="time">14:00</td><td><strong>Unconference</strong></td><td class="fg-3">—</td><td><span class="chip track-tag">All</span></td></tr>
<tr><td class="time">16:30</td><td><strong>Closing remarks</strong></td><td>Priya Nadkarni</td><td><span class="chip track-tag">All</span></td></tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</section>
<!-- Tickets -->
<section class="section" id="tickets">
<div class="container">
<div class="section-narrow text-center mb-7">
<p class="eyebrow fs-sm fg-primary mb-2">Tickets</p>
<h2 class="fs-4xl fw-bold mb-3" style="letter-spacing:-.03em">No tiered nonsense</h2>
<p class="fs-lg fg-2 mb-0">Three options. Everyone gets the same seats, the same food and the same talks.</p>
</div>
<div class="row g-4">
<div class="md:col-4">
<div class="ticket">
<h3 class="fs-lg fw-semibold mb-1">Community</h3>
<p class="fg-3 fs-sm mb-4">Self-funded, students, between jobs</p>
<p class="ticket-price mb-4">£145</p>
<ul class="vstack gap-2 fs-sm list-unstyled mb-5">
<li>All three days</li><li>Both tracks</li><li>Lunch and the party</li>
</ul>
<button class="btn-outline theme-secondary w-100 mt-auto" type="button" data-bs-toggle="dialog" data-bs-target="#checkoutDialog">Select</button>
</div>
</div>
<div class="md:col-4">
<div class="ticket is-featured">
<div class="d-flex justify-content-between align-items-start">
<h3 class="fs-lg fw-semibold mb-1">Standard</h3>
<span class="badge theme-primary">Most bought</span>
</div>
<p class="fg-3 fs-sm mb-4">Company-funded</p>
<p class="ticket-price mb-4">£495</p>
<ul class="vstack gap-2 fs-sm list-unstyled mb-5">
<li>Everything in Community</li><li>Talk recordings</li><li>Invoice on request</li><li>Free transfer to a colleague</li>
</ul>
<button class="btn-solid theme-primary w-100 mt-auto" type="button" data-bs-toggle="dialog" data-bs-target="#checkoutDialog">Select</button>
</div>
</div>
<div class="md:col-4">
<div class="ticket">
<h3 class="fs-lg fw-semibold mb-1">Workshop</h3>
<p class="fg-3 fs-sm mb-4">Includes Friday sessions</p>
<p class="ticket-price mb-4">£790</p>
<ul class="vstack gap-2 fs-sm list-unstyled mb-5">
<li>Everything in Standard</li><li>One Friday workshop</li><li>Capped at 25 people</li>
</ul>
<button class="btn-outline theme-secondary w-100 mt-auto" type="button" data-bs-toggle="dialog" data-bs-target="#checkoutDialog">Select</button>
</div>
</div>
</div>
</div>
</section>
<!-- Venue -->
<section class="section bg-2" id="venue">
<div class="container">
<div class="row g-6 align-items-center">
<div class="lg:col-6">
<p class="eyebrow fs-sm fg-primary mb-2">Venue</p>
<h2 class="fs-3xl fw-bold mb-4" style="letter-spacing:-.02em">Barbican Centre, London</h2>
<p class="fg-2 mb-4">Silk Street, EC2Y 8DS. Five minutes from Barbican and Moorgate, ten from Liverpool Street. Step-free throughout, with a quiet room on level 2 for the whole three days.</p>
<ul class="vstack gap-2 fs-sm list-unstyled mb-4">
<li class="d-flex gap-2"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="fg-primary flex-shrink-0 mt-1" aria-hidden="true"><path d="m3 8 3.5 3.5L13 5"/></svg>Step-free access to every room</li>
<li class="d-flex gap-2"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="fg-primary flex-shrink-0 mt-1" aria-hidden="true"><path d="m3 8 3.5 3.5L13 5"/></svg>Live captioning on both tracks</li>
<li class="d-flex gap-2"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="fg-primary flex-shrink-0 mt-1" aria-hidden="true"><path d="m3 8 3.5 3.5L13 5"/></svg>Quiet room and a prayer room</li>
<li class="d-flex gap-2"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="fg-primary flex-shrink-0 mt-1" aria-hidden="true"><path d="m3 8 3.5 3.5L13 5"/></svg>All catering vegetarian by default</li>
</ul>
<a class="btn-outline theme-secondary" href="#">Travel & accommodation</a>
</div>
<div class="lg:col-6"><div class="venue-map"></div></div>
</div>
</div>
</section>
<!-- FAQ -->
<section class="section" id="faq">
<div class="container">
<div class="section-narrow">
<h2 class="fs-3xl fw-bold text-center mb-6" style="letter-spacing:-.02em">Before you book</h2>
<div class="accordion">
<details class="accordion-item" name="cfaq" open>
<summary class="accordion-header">Can I transfer my ticket?
<svg class="accordion-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="m2 5 6 6 6-6"/></svg>
</summary>
<div class="accordion-body">Yes, free, up to 24 hours before. Standard and Workshop tickets can be transferred to anyone; Community tickets only to someone who also qualifies.</div>
</details>
<details class="accordion-item" name="cfaq">
<summary class="accordion-header">Are talks recorded?
<svg class="accordion-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="m2 5 6 6 6-6"/></svg>
</summary>
<div class="accordion-body">All main-track talks are recorded and go to Standard and Workshop ticket holders within three weeks, then public after six months. Open spaces are never recorded.</div>
</details>
<details class="accordion-item" name="cfaq">
<summary class="accordion-header">Is there financial support?
<svg class="accordion-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="m2 5 6 6 6-6"/></svg>
</summary>
<div class="accordion-body">We hold 80 free tickets plus travel and accommodation each year. Applications open in June and are decided by a panel that does not see names or employers.</div>
</details>
<details class="accordion-item" name="cfaq">
<summary class="accordion-header">What's the refund policy?
<svg class="accordion-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="m2 5 6 6 6-6"/></svg>
</summary>
<div class="accordion-body">Full refund up to 30 days before, 50% up to 7 days before. If you're unwell on the day, tell us and we'll refund you — no note required.</div>
</details>
</div>
</div>
</div>
</section>
</main>
<footer class="site-footer py-6" style="border-top:1px solid var(--bs-border-color)">
<div class="container d-flex flex-wrap justify-content-between align-items-center gap-3">
<p class="fg-3 fs-xs mb-0">© <span data-year>2026</span> Summit Conference. A free template for uicookies.</p>
<p class="fg-3 fs-xs mb-0">Built with Bootstrap 6.0.0-alpha1</p>
</div>
</footer>
<!-- Signature: fixed bottom ticket bar instead of a header CTA -->
<div class="ticket-bar">
<div class="container d-flex flex-wrap align-items-center gap-3">
<div class="me-auto">
<p class="fw-semibold fs-sm mb-0">14–16 October · Barbican, London</p>
<p class="fg-3 fs-xs mb-0">Standard tickets from £495 · 214 remaining</p>
</div>
<a class="btn-outline theme-secondary d-none md:d-inline-flex" href="#schedule">Schedule</a>
<button class="btn-solid theme-primary" type="button" data-bs-toggle="dialog" data-bs-target="#checkoutDialog">Get tickets</button>
</div>
</div>
<!-- Checkout -->
<dialog class="dialog dialog-lg" id="checkoutDialog" aria-labelledby="checkoutTitle">
<div class="dialog-header">
<h1 class="dialog-title fs-lg" id="checkoutTitle">Book your place</h1>
<button type="button" class="btn-close" data-bs-dismiss="dialog" aria-label="Close"></button>
</div>
<form class="dialog-body row g-4" id="ticketForm" data-demo-form data-bs-validate novalidate>
<div class="md:col-6">
<div class="form-field">
<label class="form-label" for="tkName">Full name</label>
<input type="text" class="form-control" id="tkName" required>
<div class="invalid-feedback">Required.</div>
</div>
</div>
<div class="md:col-6">
<div class="form-field">
<label class="form-label" for="tkEmail">Email</label>
<input type="email" class="form-control" id="tkEmail" required>
<div class="invalid-feedback">Required.</div>
</div>
</div>
<div class="md:col-6">
<label class="form-label">Ticket type</label>
<button class="form-control combobox-toggle" type="button" data-bs-toggle="combobox" data-bs-name="ticket" data-bs-placeholder="Standard — £495">
<span class="combobox-value">Standard — £495</span>
<svg class="combobox-caret" width="10" height="16" viewBox="0 0 10 16" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="M0.46967 5.46967C0.762563 5.17678 1.23744 5.17678 1.53033 5.46967L5 8.93934L8.46967 5.46967C8.76256 5.17678 9.23744 5.17678 9.53033 5.46967C9.82322 5.76256 9.82322 6.23744 9.53033 6.53033L5.53033 10.5303C5.23744 10.8232 4.76256 10.8232 4.46967 10.5303L0.46967 6.53033C0.176777 6.23744 0.176777 5.76256 0.46967 5.46967Z" fill="currentcolor"/></svg>
</button>
<div class="menu">
<button class="menu-item" type="button" data-bs-value="community">Community — £145</button>
<button class="menu-item" type="button" data-bs-value="standard">Standard — £495</button>
<button class="menu-item" type="button" data-bs-value="workshop">Workshop — £790</button>
</div>
</div>
<div class="md:col-6">
<label class="form-label">Workshop choice</label>
<button class="form-control combobox-toggle" type="button" data-bs-toggle="combobox" data-bs-search="true" data-bs-name="workshop" data-bs-placeholder="Not attending">
<span class="combobox-value">Not attending</span>
<svg class="combobox-caret" width="10" height="16" viewBox="0 0 10 16" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="M0.46967 5.46967C0.762563 5.17678 1.23744 5.17678 1.53033 5.46967L5 8.93934L8.46967 5.46967C8.76256 5.17678 9.23744 5.17678 9.53033 5.46967C9.82322 5.76256 9.82322 6.23744 9.53033 6.53033L5.53033 10.5303C5.23744 10.8232 4.76256 10.8232 4.46967 10.5303L0.46967 6.53033C0.176777 6.23744 0.176777 5.76256 0.46967 5.46967Z" fill="currentcolor"/></svg>
</button>
<div class="menu">
<button class="menu-item" type="button" data-bs-value="none">Not attending</button>
<button class="menu-item" type="button" data-bs-value="incident">Running incident reviews</button>
<button class="menu-item" type="button" data-bs-value="ci">CI that finishes before lunch</button>
<button class="menu-item" type="button" data-bs-value="hiring">Interviewing without take-homes</button>
</div>
</div>
<div class="col-12">
<label class="form-label" for="tkDiet">Dietary requirements</label>
<div class="chip-input" data-bs-chips>
<span class="chip">vegan</span>
<input type="text" class="form-ghost" id="tkDiet" placeholder="Add…">
</div>
</div>
<div class="col-12">
<div class="form-field">
<div class="switch"><input type="checkbox" value="" id="tkUpdates" role="switch" switch checked></div>
<label for="tkUpdates">Email me schedule changes only — no marketing</label>
</div>
</div>
</form>
<div class="dialog-footer">
<button type="button" class="btn-text" data-bs-dismiss="dialog">Cancel</button>
<button type="submit" form="ticketForm" class="btn-solid theme-primary" data-done-text="Booked ✓">Continue to payment</button>
</div>
</dialog>
<script type="module" src="assets/js/main.js"></script>
</body>
</html>