Agenda
A schedule of times, sessions, speakers and tracks, for events, courses and programmes.
Agenda
- Main stage
Opening: interfaces are surfaces
Ilinca Sava · Field Notes
- Studio
Type that survives translation
Jonas Olsen · Kestrel
Coffee and noodles
<section class="mn-section mn-section-sm"><div class="mn-container"><ol class="mn-agenda">
<li class="mn-agenda-item"><time class="mn-agenda-time" datetime="09:30">09:30</time><div class="mn-agenda-body"><h3 class="mn-agenda-title">Opening: interfaces are surfaces</h3><p class="mn-agenda-who">Ilinca Sava · Field Notes</p></div><span class="mn-badge mn-badge-outline mn-neutral">Main stage</span></li>
<li class="mn-agenda-item"><time class="mn-agenda-time" datetime="10:15">10:15</time><div class="mn-agenda-body"><h3 class="mn-agenda-title">Type that survives translation</h3><p class="mn-agenda-who">Jonas Olsen · Kestrel</p></div><span class="mn-badge mn-badge-outline mn-neutral">Studio</span></li>
<li class="mn-agenda-item mn-agenda-item-break"><time class="mn-agenda-time" datetime="11:00">11:00</time><div class="mn-agenda-body"><h3 class="mn-agenda-title">Coffee and noodles</h3></div></li>
</ol></div></section>Installation
Everything ships in one stylesheet. There is nothing to import per component.
<link rel="stylesheet" href="https://mian.ro/dist/mian.css">Prefer to own the files? /r/agenda.json is a registry item with this component's CSS and example markup, ready to copy into your project with any tool that reads the open registry-item format.
Class reference
| Class / attribute | Description |
|---|---|
| mn-agenda | The list (a <ol>). |
| mn-agenda-item | A row: mn-agenda-time, mn-agenda-body (mn-agenda-title, mn-agenda-who) and an optional badge. mn-agenda-item-break for breaks. |
Accessibility
- Use <time datetime="…"> for times.
- Use an ordered list: the order is the schedule.