| 1 | |
| 2 | <div class="rst-page" > |
| 3 | <p><a class="rst-btn" href="#a">Plain</a> |
| 4 | <a class="rst-btn rst-btn--primary" href="#a">Primary</a> |
| 5 | <a class="rst-btn rst-btn--ghost" href="#a">Ghost</a> |
| 6 | <button class="rst-btn rst-btn--danger" type="button">Danger</button> |
| 7 | <button class="rst-btn" type="button" aria-busy="true" disabled><span class="rst-spin" aria-hidden="true"></span>Saving</button></p> |
| 8 | |
| 9 | <!-- The size scale. lg reaches the fixture through form-foot and |
| 10 | confirm-form, which both emit it; sm and block are rendered by no |
| 11 | partial, so they are here or their pairing is unproven. --> |
| 12 | <p><button class="rst-btn rst-btn--sm" type="button">Small</button> |
| 13 | <button class="rst-btn rst-btn--lg" type="button">Large</button></p> |
| 14 | <p><button class="rst-btn rst-btn--primary rst-btn--lg rst-btn--block" type="button">Block</button></p> |
| 15 | |
| 16 | <p><span class="rst-badge rst-badge--positive" >Paid</span> |
| 17 | <span class="rst-badge rst-badge--warning" >Due</span> |
| 18 | <span class="rst-badge rst-badge--negative" >Failed</span> |
| 19 | <span class="rst-badge rst-badge--neutral" >Draft</span></p> |
| 20 | |
| 21 | <p><span class="rst-status" data-tone="positive">Published</span> |
| 22 | <span class="rst-status" data-tone="warning">Pending</span> |
| 23 | <span class="rst-status" data-tone="negative">Failed</span> |
| 24 | <span class="rst-status" >Neutral</span></p> |
| 25 | |
| 26 | <div class="rst-callout" data-tone="positive"><span class="rst-callout__ic" ><svg class="icon" viewBox="0 0 16 16"><circle cx="8" cy="8" r="7"></circle></svg></span><div class="rst-callout__body" ><strong>Saved</strong><p>Only child.</p></div></div> |
| 27 | <div class="rst-callout" data-tone="warning"><span class="rst-callout__ic" ><svg class="icon" viewBox="0 0 16 16"><circle cx="8" cy="8" r="7"></circle></svg></span><div class="rst-callout__body" ><p>One</p><p>Two</p><ul><li>Item</li></ul></div></div> |
| 28 | <div class="rst-callout" data-tone="negative"><span class="rst-callout__ic" ><svg class="icon" viewBox="0 0 16 16"><circle cx="8" cy="8" r="7"></circle></svg></span><div class="rst-callout__body" ><p>Gone.</p></div></div> |
| 29 | |
| 30 | <!-- The card corner rules: a full-bleed first and last child, and a |
| 31 | self-shaped child that must keep its own corners. --> |
| 32 | <div class="rst-list" > |
| 33 | <div class="rst-lbar" ><search><form class="rst-search" method="get" action="/x"><svg class="icon" viewBox="0 0 16 16"><circle cx="8" cy="8" r="7"></circle></svg><input type="search" name="q" value="a" aria-label="Search"><a class="rst-search__clear" href="/x" aria-label="Clear">x</a><button class="rst-sr-only" type="submit">Search</button></form></search></div> |
| 34 | <div class="rst-row" ><span class="rst-row__lead" data-lead="positive"></span><div class="rst-row__main" ><a href="#a">Name</a><span class="rst-row__sub" >Sub</span></div><span class="rst-status" data-tone="positive">Live</span><a class="rst-row__action" href="#a">Edit</a></div> |
| 35 | <div class="rst-row" ><span class="rst-row__lead" data-lead="warning"></span><div class="rst-row__main" ><a href="#a">Second</a></div></div> |
| 36 | <div class="rst-row" ><span class="rst-row__lead" data-lead="positive"></span><div class="rst-row__main" ><a href="#a">Third</a><span class="rst-row__sub" >Sub</span></div><span class="rst-status rst-status--inline" data-tone="positive">Live</span><a class="rst-row__action" href="#a">Edit</a></div> |
| 37 | </div> |
| 38 | <div class="rst-list" ><form class="rst-search" method="get" action="/x"><input type="search" name="q" aria-label="Search"></form></div> |
| 39 | <div class="rst-list" ><div class="rst-empty" ><h2 class="rst-empty__title" >Nothing yet</h2><p class="rst-empty__body" >Body.</p><a class="rst-btn rst-btn--primary rst-empty__cta" href="#a">Start</a></div></div> |
| 40 | |
| 41 | <div class="rst-card" style="--rst-cols: 2fr 110px 32px"> |
| 42 | <div class="rst-lrow rst-lrow--head" ><span>Order</span><span class="rst-m-hide" >Status</span><span></span></div> |
| 43 | <div class="rst-lrow" ><a class="rst-nm" href="#a">#1001<small>Yesterday</small></a><span class="rst-cell-mut" >Paid</span> |
| 44 | <details class="rst-row-menu" ><summary aria-label="Actions">…</summary><div class="rst-row-menu__panel" ><a href="#a">Open</a><form method="post" action="#a"><button type="button"><span class="rst-spin" aria-hidden="true"></span>Archive</button></form><hr><button class="rst-danger" type="button"><span class="rst-spin" aria-hidden="true"></span>Delete…</button></div></details></div> |
| 45 | <div class="rst-lrow" ><span class="rst-person rst-person--lg" ><span class="rst-person__av" >A</span><span class="rst-person__meta" ><span class="rst-person__name" >Ana</span><span class="rst-person__email" >a@example.com</span></span></span><span class="rst-cell-mut" >—</span><span></span></div> |
| 46 | <div class="rst-lrow" ><span class="rst-person" ><span class="rst-person__av rst-person__av--empty" ></span><span class="rst-person__meta" ><span class="rst-person__name" >Unassigned</span></span></span><span></span><span></span></div> |
| 47 | <div class="rst-no-match" >No match. <a href="#a">Clear</a></div> |
| 48 | </div> |
| 49 | <p class="rst-count-line" >3 of 40</p> |
| 50 | <div class="rst-card" ><div class="rst-lrow" ><a class="rst-person" href="#a"><span class="rst-person__av" >A</span><span class="rst-person__meta" ><span class="rst-person__name" >Ada</span></span></a><span class="rst-cell-mut" >Owner</span></div></div> |
| 51 | <!-- A list-row-action row with no link: its hover rule must not match. --> |
| 52 | <div class="rst-list" ><div class="rst-row" ><div class="rst-row__main" ><span>Archived</span><span class="rst-row__sub" >No page</span></div></div></div> |
| 53 | |
| 54 | <p><span class="rst-ftok" ><span class="rst-ftok__k" >Status</span> Paid <a href="#a" aria-label="Remove">x</a></span></p> |
| 55 | |
| 56 | <details class="rst-dropdown" name="rst-fixture-menus"><summary class="rst-btn" >Filter <span class="rst-caret" ><svg class="icon" viewBox="0 0 16 16"><path d="M2 5l6 6 6-6"></path></svg></span></summary> |
| 57 | <div class="rst-dropdown__menu" ><a href="#a" aria-current="true">All</a><a href="#a">Draft</a><hr><button class="rst-danger" type="button" >Reset</button> |
| 58 | <details class="rst-menu-group" ><summary>More</summary><div><a href="#a">Nested</a></div></details></div></details> |
| 59 | <div class="rst-locale" ><form method="post" action="#a"><button type="button" aria-current="true">English</button></form><hr><form method="post" action="#a"><button type="button">Español</button></form></div> |
| 60 | |
| 61 | <nav class="rst-pagination" aria-label="Pagination"><a href="#a">Previous</a><span class="rst-pagination__disabled" >First</span><span class="rst-pagination__gap" >…</span><span class="rst-pagination__gap rst-pagination__gap--narrow" aria-hidden="true">…</span><a href="#a" aria-current="page">2</a><a href="#a">Next</a></nav> |
| 62 | |
| 63 | <div class="rst-seg-tabs" ><a href="#a" aria-current="page">All</a><a href="#a">Open</a><a href="#a">Closed</a></div> |
| 64 | <div class="rst-seg-tabs" role="group" aria-label="View"><button type="button" aria-pressed="true">List</button><button type="button" aria-pressed="false">Grid</button></div> |
| 65 | |
| 66 | <div class="rst-meter" ><meter class="rst-meter__bar" value="40" min="0" max="100" aria-hidden="true"></meter><span class="rst-meter__num" >40%</span></div> |
| 67 | <div class="rst-job" ><span class="rst-spin" aria-hidden="true"></span> <strong>Import</strong> is running — 128 of 400…<progress class="rst-job__bar" value="32" min="0" max="100" aria-hidden="true"></progress></div> |
| 68 | |
| 69 | <dl class="rst-detail" ><dt>Reference</dt><dd class="rst-mono" >AB-1001</dd></dl> |
| 70 | <div class="rst-snippet" ><code dir="ltr" translate="no"><link rel="stylesheet" href="https://fiesta.rastrillo.org/1/fiesta.css"></code><button class="rst-btn rst-btn--sm rst-snippet__copy" type="button">Copy</button><span class="rst-snippet__status" role="status"></span></div> |
| 71 | <div class="rst-snippet" ><code dir="ltr" translate="no">fiesta.css</code><button class="rst-btn rst-btn--sm rst-snippet__copy" type="button">Copy</button><span class="rst-snippet__status" role="status">Copied</span></div> |
| 72 | <div class="rst-side" ><nav class="rst-side__nav" aria-label="Settings"><a href="#a" aria-current="page">General</a><a href="#a">Members</a></nav><div><h2>General</h2></div></div> |
| 73 | <div style="inline-size: 300px"><div class="rst-side" ><nav class="rst-side__nav" aria-label="Settings"><a href="#a" aria-current="page">General</a><a href="#a">Members</a></nav><div><h2>General</h2></div></div></div> |
| 74 | <div class="rst-stats rst-stats--pairs" ><div class="rst-stat" ><span class="rst-stat__label" >Revenue</span><span class="rst-stat__num" >€48,210</span></div><div class="rst-stat" ><span class="rst-stat__label" >Orders</span><span class="rst-stat__num" >318</span></div><div class="rst-stat" ><span class="rst-stat__label" >Basket</span><span class="rst-stat__num" >€41.20</span></div><div class="rst-stat" ><span class="rst-stat__label" >Refunds</span><span class="rst-stat__num" >7</span></div></div> |
| 75 | |
| 76 | <form class="rst-form" method="post" action="#a"> |
| 77 | <div class="rst-form-flow" > |
| 78 | <div class="rst-field" ><label class="rst-field__label" for="v1">Name <span class="rst-field__hint" >(optional)</span><span class="rst-field__required" >*</span></label><input class="rst-input" type="text" id="v1" name="v1"><small class="rst-field__hint" >Small hint</small><p class="rst-field__help" >Help</p><p class="rst-field__error" >Error</p></div> |
| 79 | <div class="rst-field" ><label class="rst-field__label" for="v2">Notes</label><textarea class="rst-input rst-textarea" id="v2" name="v2"></textarea></div> |
| 80 | <div class="rst-field-row" ><div class="rst-field rst-grow" ><label class="rst-field__label" for="v3">City</label><input class="rst-input" type="text" id="v3" name="v3"></div><div class="rst-field" ><label class="rst-field__label" for="v4">ZIP</label><input class="rst-input rst-input--short" type="text" id="v4" name="v4"></div></div> |
| 81 | <div class="rst-field" ><label class="rst-field__label" for="v6">Title</label><input class="rst-input rst-input--primary" type="text" id="v6" name="v6"></div> |
| 82 | <div class="rst-field" ><label class="rst-field__label" for="v7">Code</label><input class="rst-input rst-input--short rst-input--primary" type="text" id="v7" name="v7"></div> |
| 83 | <fieldset class="rst-field-range" ><legend>When</legend><div class="rst-field-row" ><div class="rst-field" ><label class="rst-field__label" for="v5">From</label><input class="rst-input" type="date" id="v5" name="v5"></div></div></fieldset> |
| 84 | <label class="rst-switch" ><input type="checkbox" checked><span class="rst-switch__track" ></span> On</label> |
| 85 | <fieldset class="rst-choice" ><legend>Plan</legend><div class="rst-choice__cards" ><label><input type="radio" name="plan" checked><span class="rst-choice__title" >Free</span><span class="rst-choice__desc" >Desc</span></label><label><input type="radio" name="plan"><span class="rst-choice__title" >Pro</span></label></div></fieldset> |
| 86 | </div> |
| 87 | <div class="rst-form-bar" ><span class="rst-form-bar__note" >Saves immediately.</span><div class="rst-form-actions" ><button class="rst-btn rst-btn--primary" type="submit">Save</button></div></div> |
| 88 | <div class="rst-form-foot" ><button class="rst-btn" type="button">Cancel</button></div> |
| 89 | </form> |
| 90 | |
| 91 | <div class="rst-selbox" ><input type="checkbox" aria-label="Select"></div> |
| 92 | <div class="rst-bulkbar" ><button class="rst-bulkbar__close" type="button" aria-label="Clear"><svg class="icon" viewBox="0 0 16 16"><path d="M2 2l12 12"></path></svg></button><span class="rst-bulkbar__count" >3 selected</span><button class="rst-bulkbar__escalate" type="button">Escalate</button><details class="rst-dropdown" name="rst-fixture-menus2"><summary class="rst-btn" >Actions</summary><div class="rst-dropdown__menu" ><button type="button">Archive</button></div></details></div> |
| 93 | |
| 94 | <div class="rst-notice" >A notice.</div> |
| 95 | <div class="rst-form-error" >A form error.</div> |
| 96 | <nav class="rst-back-nav" ><a href="#a">Back</a></nav> |
| 97 | <p><span class="rst-tip" data-tip="A tip">?</span> <span class="rst-help" ><svg class="icon" viewBox="0 0 16 16"><circle cx="8" cy="8" r="7"></circle></svg></span></p> |
| 98 | |
| 99 | <div class="rst-combo" ><div class="rst-combo__rows" ><input class="rst-input" type="text" aria-label="Combo"></div><ul class="rst-combo__list" ><li class="rst-combo__option" aria-selected="true">One</li><li class="rst-combo__option is-active" >Two</li></ul><div class="rst-select__group" >Group</div></div> |
| 100 | <div class="rst-combo rst-combo__has-lead rst-combo__up" ><span class="rst-combo__lead" >🇮🇪</span><input class="rst-input" type="text" aria-label="Lead combo"><ul class="rst-combo__list" ><li class="rst-combo__option" ><span class="rst-combo__lead" >🇮🇪</span>Ireland<span class="rst-combo__desc" >+353</span></li><li class="rst-combo__sep" ></li><li class="rst-combo__empty" >No matches</li></ul></div> |
| 101 | |
| 102 | <div class="rst-dtp" ><input class="rst-input rst-dtp__input" type="text" aria-label="When"><button class="rst-dtp__pick" type="button" aria-label="Pick"><svg viewBox="0 0 16 16"><circle cx="8" cy="8" r="7"></circle></svg></button> |
| 103 | <div class="rst-dtp__list" ><div class="rst-dtp__row" ><span class="rst-dtp__label" >Today</span></div><div class="rst-dtp__row rst-dtp__row--set" ><span class="rst-dtp__label" >Set</span></div><div class="rst-dtp__row is-active" aria-selected="true"><span class="rst-dtp__label" >Tomorrow</span></div><div class="rst-dtp__quick" ><button class="rst-dtp__set" type="button">Now</button></div><p class="rst-dtp__hint" >Hint</p></div></div> |
| 104 | <div class="rst-dtp" ><div class="rst-dtp__list" ><div class="rst-dtp__row rst-dtp__row--alt" ><span class="rst-dtp__label" >5 June</span></div></div> |
| 105 | <div class="rst-cal" role="dialog" aria-label="Calendar"> |
| 106 | <div class="rst-cal__head" ><button class="rst-cal__nav" type="button" aria-label="Previous month"><svg viewBox="0 0 16 16"><path d="M10 2L4 8l6 6"></path></svg></button><div class="rst-cal__title" >September 2026</div><button class="rst-cal__nav rst-cal__nav--next" type="button" aria-label="Next month"><svg viewBox="0 0 16 16"><path d="M10 2L4 8l6 6"></path></svg></button></div> |
| 107 | <table class="rst-cal__grid" role="grid"><thead><tr role="row"><th scope="col" role="columnheader"><span aria-hidden="true">Mo</span><span class="rst-sr-only" >Monday</span></th></tr></thead> |
| 108 | <tbody><tr role="row"><td class="rst-cal__day is-outside" role="gridcell" tabindex="-1" data-rst-day="2026-08-31">31</td><td class="rst-cal__day is-today" role="gridcell" tabindex="-1" aria-current="date" data-rst-day="2026-09-01">1</td><td class="rst-cal__day is-selected" role="gridcell" tabindex="0" aria-selected="true" data-rst-day="2026-09-05">5</td><td class="rst-cal__day is-preview" role="gridcell" tabindex="-1" data-rst-day="2026-09-06">6</td><td class="rst-cal__day is-disabled" role="gridcell" tabindex="-1" aria-disabled="true" data-rst-day="2026-09-07">7</td></tr></tbody></table> |
| 109 | </div></div> |
| 110 | |
| 111 | <a class="rst-skip" href="#a">Skip to content</a> |
| 112 | <div class="rst-backdrop" ></div> |
| 113 | <div class="rst-modal-overlay" ><div class="rst-modal-panel" ><nav><a href="#a" aria-current="page">One</a><a href="#a">Two</a></nav><section>Body</section><a class="rst-modal-close" href="#a" aria-label="Close">x</a></div></div> |
| 114 | |
| 115 | <div class="rst-error" ><p class="rst-error__status" >404</p><h1 class="rst-error__title" >Not found</h1><p class="rst-error__body" >Body.</p><p class="rst-error__cta" ><a class="rst-btn rst-btn--primary" href="#a">Home</a></p><p class="rst-error__ref" >ref: abc</p></div> |
| 116 | |
| 117 | <div class="rst-shell-topbar" ><div class="rst-shell__bar" ><a class="rst-shell__brand" href="#a">Brand</a><nav class="rst-shell__nav" ><a href="#a" aria-current="page">Home</a><a href="#a">Away</a></nav><details class="rst-shell__menu" name="rst-fixture-menus3"><summary>Menu</summary></details><div class="rst-shell__tail" ><nav class="rst-shell__nav" ><a href="#a">Tail</a></nav><details class="rst-shell__account rst-dropdown" name="rst-fixture-menus4"><summary class="rst-btn" >Ana</summary><div class="rst-dropdown__menu" ><a href="#a">Sign out</a></div></details></div></div><div class="rst-shell__foot" ></div></div> |
| 118 | <div class="rst-shell-sidebar" ><details class="rst-shell__chrome" name="rst-fixture-menus5"><summary>Menu</summary></details><div class="rst-shell__rail" ><div class="rst-shell__group" >Group</div><nav class="rst-shell__nav" ><a href="#a" aria-current="page">Home</a></nav><div class="rst-shell__rail-foot" ><details class="rst-dropdown" name="rst-fixture-menus6"><summary class="rst-btn" >Ana</summary><div class="rst-dropdown__menu" ><a href="#a">Sign out</a></div></details></div></div><main class="rst-shell__main" >Main</main></div> |
| 119 | <div class="rst-shell-console" ><div class="rst-shell__bar" ><a class="rst-shell__brand" href="#a">Brand</a><details class="rst-shell__menu" name="rst-fixture-menus7"><summary>Menu</summary></details><div class="rst-shell__tail" ><details class="rst-shell__account rst-dropdown" name="rst-fixture-menus8"><summary class="rst-btn" >Ana</summary><div class="rst-dropdown__menu" ><a href="#a">Sign out</a></div></details></div></div><div class="rst-shell__rail" ><nav class="rst-shell__nav" ><a href="#a" aria-current="page">Home</a><a href="#a">Away</a></nav></div><main class="rst-shell__main" >Main</main><div class="rst-shell__foot" >Foot</div></div> |
| 120 | <div class="rst-page" ><p>Content</p><footer class="rst-page__foot" ><details class="rst-dropdown" name="rst-fixture-menus12"><summary>Language</summary><div class="rst-dropdown__menu" ><a href="#a" aria-current="true">English</a></div></details><details class="rst-dropdown" name="rst-fixture-menus12"><summary>Colour scheme</summary><div class="rst-dropdown__menu" ><a href="#a">Dark</a></div></details></footer></div><div class="rst-page" ><p>Content</p><footer class="rst-page__foot" > |
| 121 | </footer></div> |
| 122 | <div class="rst-shell-sidebar rst-shell-sidebar--index" ><div class="rst-shell__back" ><a href="#a">Sections</a></div><div class="rst-shell__rail" ><h1 class="rst-shell__title" ><span><a class="rst-shell__brand" href="#a">App</a></span><span>App</span></h1><a class="rst-shell__brand" href="#a">App</a><nav class="rst-shell__nav" ><p class="rst-shell__group" >Work</p><a href="#a">One</a><a href="#a">Two</a><p class="rst-shell__group" >More</p><a href="#a">Three</a></nav><div class="rst-shell__rail-foot" ><details class="rst-dropdown rst-shell__profile" name="rst-fixture-menus11"><summary><span class="rst-shell__avatar" ><span class="rst-person__av" aria-hidden="true">A</span><span class="rst-person__name" >Ana</span></span></summary><div class="rst-dropdown__menu" ><div class="rst-shell__who" ><span class="rst-person__name" >Ana</span><span class="rst-person__email" >ana@example.com</span></div><a href="#a">Sign out</a></div></details></div></div><main class="rst-shell__main" >Main</main></div> |
| 123 | <div class="rst-shell-sidebar rst-shell-sidebar--page" ><div class="rst-shell__back" ><a href="#a">Sections</a></div><div class="rst-shell__rail" ><h1 class="rst-shell__title" >App</h1><nav class="rst-shell__nav" ><a href="#a">One</a></nav></div><main class="rst-shell__main" >Main</main></div> |
| 124 | <div class="rst-shell-console rst-shell-console--index" ><div class="rst-shell__bar" ><h1 class="rst-shell__title" ><span><a class="rst-shell__brand" href="#a">App</a></span><span>App</span></h1><a class="rst-shell__brand" href="#a">App</a><details class="rst-shell__menu" name="rst-fixture-menus9" open><summary><span class="rst-shell__menu-label" >Menu</span><span class="rst-shell__avatar" ><span class="rst-person__av rst-person__av--empty rst-person__av--placeholder" aria-hidden="true"></span><span class="rst-person__name" >Account</span></span></summary></details><div class="rst-shell__tail" ><div class="rst-shell__who" ><span class="rst-person__av rst-person__av--empty rst-person__av--placeholder" aria-hidden="true"></span><span class="rst-person__name" >Account</span></div><details class="rst-shell__account rst-dropdown" name="rst-fixture-menus10"><summary class="rst-btn" >Ana</summary><div class="rst-dropdown__menu" ><a href="#a">Sign out</a></div></details></div></div><div class="rst-shell__back" ><a href="#a">Sections</a></div><div class="rst-shell__rail" ><nav class="rst-shell__nav" ><a href="#a">One</a><a href="#a">Two</a></nav></div><main class="rst-shell__main" >Main</main></div> |
| 125 | <div class="rst-shell-console rst-shell-console--page" ><div class="rst-shell__bar" ><a class="rst-shell__brand" href="#a">App</a></div><div class="rst-shell__back" ><a href="#a">Sections</a></div><div class="rst-shell__rail" ><nav class="rst-shell__nav" ><a href="#a">One</a></nav></div><main class="rst-shell__main" >Main</main></div> |
| 126 | <!-- The sign-in card's parts the fixture's Ask state does not render: |
| 127 | the Keymail one-tap's address, the passkey pair both shown |
| 128 | with a message and hidden with none, and the "or" beside a shown |
| 129 | pair and on each side of a hidden one, where it hides with it. --> |
| 130 | <section class="rst-signin" ><div class="rst-signin__door" ><form class="rst-signin__form" ><button class="rst-btn rst-btn--primary rst-btn--block" type="submit">Continue to Keymail</button><p class="rst-signin__remembered" >as <bdi>kay@example.org</bdi></p></form><p class="rst-signin__or" >or</p><div class="rst-signin__passkey" ><button class="rst-btn rst-btn--block" type="button">Sign in with a passkey</button><p class="rst-signin__passkey-msg" >No passkey was used.</p></div><p class="rst-signin__or" >or</p><div class="rst-signin__passkey" ><button class="rst-btn rst-btn--block" type="button" hidden>Hidden</button><p class="rst-signin__passkey-msg" ></p></div><p class="rst-signin__or" >or</p></div></section> |
| 131 | <!-- The provider stack no partial renders: the gallery's social |
| 132 | sign-in screen is the only markup that uses it. --> |
| 133 | <div class="rst-signin__providers" ><form><button class="rst-btn rst-btn--block" type="submit">Google</button></form><form><button class="rst-btn rst-btn--block" type="submit">Apple</button></form><a href="#">Use your email instead</a></div> |
| 134 | <div class="rst-stage" ><div class="rst-stage__scene" ><svg class="rst-stage-art" viewBox="0 0 10 10"><g class="rst-stage-art__glow" ><circle cx="5" cy="5" r="3"></circle></g><g class="rst-stage-art__lines" ><path d="M0 5h10"></path></g></svg></div><div class="rst-page" >Card</div><footer class="rst-stage__foot" >Foot</footer></div> |
| 135 | </div><div class="rst-page" ><div class="rst-box-head"><h2>Payout</h2><a class="rst-btn" href="/payout/edit">Edit</a></div> |
| 136 | <section class="rst-box"><p>Everything on a screen sits inside boxes.</p><div class="rst-box-foot">Last updated 2 hours ago</div></section></div><div class="rst-page" ><p><button class="rst-btn" type="button">Cancel</button> <button class="rst-btn rst-btn--primary" type="button">Save</button> <button class="rst-btn rst-btn--ghost" type="button">Preview</button> <button class="rst-btn rst-btn--danger" type="button">Delete</button></p> |
| 137 | <p><button class="rst-btn rst-btn--primary rst-btn--sm" type="button">Small</button> <button class="rst-btn rst-btn--primary" type="button">Default</button> <button class="rst-btn rst-btn--primary rst-btn--lg" type="button">Large</button> <a class="rst-btn" href="/orders">View orders</a></p> |
| 138 | <p><button class="rst-btn rst-btn--primary rst-btn--block" type="button">Continue</button></p> |
| 139 | <p><button class="rst-btn" type="button" disabled>Archived</button></p></div><div class="rst-page" ><details class="rst-dropdown" name="rst-menus"> |
| 140 | <summary>Filter<span class="rst-caret" aria-hidden="true"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></span><span class="rst-sr-only" >Filter orders: Paid</span></summary> |
| 141 | <div class="rst-dropdown__menu"> |
| 142 | <a aria-current="true" href="/orders?status=paid">Paid</a> |
| 143 | <details class="rst-menu-group" name="rst-menus-price" open><summary>Price</summary><div><a href="/orders?price=free">Free</a></div></details> |
| 144 | </div> |
| 145 | </details> |
| 146 | <span class="rst-ftok"><span class="rst-ftok__k">Paid</span><a href="/orders" aria-label="Remove filter Paid">✕</a></span></div><div class="rst-page" ><form class="rst-form-flow" method="post" action="/settings"> |
| 147 | <div class="rst-field"> |
| 148 | <label class="rst-field__label" for="name">Name</label> |
| 149 | <input class="rst-input" type="text" id="name" name="name"> |
| 150 | </div> |
| 151 | <div class="rst-field"> |
| 152 | <label class="rst-field__label" for="email">Email</label> |
| 153 | <input class="rst-input" type="email" id="email" name="email"> |
| 154 | </div> |
| 155 | <div class="rst-field-row"> |
| 156 | <div class="rst-field rst-grow" > |
| 157 | <label class="rst-field__label" for="city">City</label> |
| 158 | <input class="rst-input" type="text" id="city" name="city"> |
| 159 | </div> |
| 160 | <div class="rst-field"> |
| 161 | <label class="rst-field__label" for="zip">ZIP</label> |
| 162 | <input class="rst-input rst-input--short" type="text" id="zip" name="zip"> |
| 163 | </div> |
| 164 | </div> |
| 165 | <div class="rst-form-bar"> |
| 166 | <span class="rst-form-bar__note">Changes save immediately.</span> |
| 167 | <div class="rst-form-actions"> |
| 168 | <a class="rst-btn" href="/settings">Cancel</a> |
| 169 | <button class="rst-btn rst-btn--primary" type="submit">Save</button> |
| 170 | </div> |
| 171 | </div> |
| 172 | </form></div><div class="rst-page" ><a class="rst-help rst-tip" href="/help/orders" target="_blank" rel="noopener" aria-label="Help: orders" data-tip="About orders"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><path d="M12 17h.01"/></svg></a></div><div class="rst-page" ><div class="rst-card" style="--rst-cols: 2fr 110px var(--rst-col-menu)"> |
| 173 | <div class="rst-lrow rst-lrow--head"><span>Order</span><span class="rst-m-hide" >Status</span><span></span></div> |
| 174 | <div class="rst-lrow"> |
| 175 | <a class="rst-nm" href="/orders/AB3PX"><bdi>Grace Hopper</bdi><small>AB3PX · <bdi>grace@example.com</bdi></small></a> |
| 176 | <span class="rst-m-hide rst-cell-mut" >Paid</span> |
| 177 | <details class="rst-row-menu" name="rst-menus"> |
| 178 | <summary aria-label="Actions for Grace Hopper"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></summary> |
| 179 | <div class="rst-row-menu__panel"><a href="/orders/AB3PX">View</a><hr><a class="rst-danger" href="/orders/AB3PX/refund">Refund order…</a></div> |
| 180 | </details> |
| 181 | </div> |
| 182 | <p class="rst-no-match">No orders match. <a href="/orders">Clear filters</a></p> |
| 183 | </div> |
| 184 | <p class="rst-count-line">Displaying <strong>1–20</strong> of <strong>412</strong></p></div><div class="rst-page" ><div class="rst-backdrop" inert> |
| 185 | <div class="rst-page"><h1>Settings</h1></div> |
| 186 | </div> |
| 187 | <div class="rst-modal-overlay"> |
| 188 | <dialog class="rst-modal-panel" open aria-labelledby="modal-title"> |
| 189 | <nav> |
| 190 | <a href="/settings/profile" aria-current="page">Profile</a> |
| 191 | <a href="/settings/billing">Billing</a> |
| 192 | <a href="/settings/notifications">Notifications</a> |
| 193 | </nav> |
| 194 | <section> |
| 195 | <a class="rst-modal-close" href="/settings" aria-label="Close settings">✕</a> |
| 196 | <h2 id="modal-title">Profile</h2> |
| 197 | <p>Update the name and photo shown across the account.</p> |
| 198 | </section> |
| 199 | </dialog> |
| 200 | </div></div><div class="rst-page" ><label class="rst-selbox"><input type="checkbox" aria-label="Select order AB3PX"></label></div><div class="rst-page" ><div class="rst-shell-sidebar rst-shell-sidebar--page"> |
| 201 | <a class="rst-skip" href="#main">Skip to content</a> |
| 202 | <div class="rst-shell__back"><a href="/#nav-reports" rel="up" aria-label="Back to Sections">Sections</a></div> |
| 203 | <aside class="rst-shell__rail"><h1 class="rst-shell__title"><span><a class="rst-shell__brand" href="/">Notes</a></span><span>Reports</span></h1><a class="rst-shell__brand" href="/">Notes</a> |
| 204 | <nav class="rst-shell__nav"><span class="rst-shell__group">Work</span><a id="nav-dashboard" href="/dashboard">Dashboard</a><a id="nav-reports" href="/reports" aria-current="page">Reports</a></nav> |
| 205 | <div class="rst-shell__rail-foot"><details class="rst-dropdown rst-shell__profile" name="rst-shell-menu"><summary><span class="rst-shell__avatar"><span class="rst-person__av" aria-hidden="true">A</span><span class="rst-person__name">Ada Lovelace</span></span></summary><div class="rst-dropdown__menu"><div class="rst-shell__who"><span class="rst-person__av" aria-hidden="true">A</span><span class="rst-person__name">Ada Lovelace</span><span class="rst-person__email">ada@example.com</span></div><a href="/settings">Settings</a></div></details></div> |
| 206 | </aside> |
| 207 | <main class="rst-shell__main" id="main"><div class="rst-page">Content.</div></main> |
| 208 | </div></div><div class="rst-page" ><div class="rst-shell-topbar"> |
| 209 | <a class="rst-skip" href="#main">Skip to content</a> |
| 210 | <header class="rst-shell__bar"><a class="rst-shell__brand" href="/">Notes</a> |
| 211 | <details class="rst-shell__menu" name="rst-shell-menu"><summary><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 12h16"/><path d="M4 6h16"/><path d="M4 18h16"/></svg>Menu</summary></details> |
| 212 | <div class="rst-shell__tail"> |
| 213 | <nav class="rst-shell__nav"><a href="/" aria-current="page">Home</a><a href="/archive">Archive</a></nav> |
| 214 | <details class="rst-dropdown rst-shell__account" name="rst-menus"><summary>Account<span class="rst-caret" aria-hidden="true"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></span></summary> |
| 215 | <div class="rst-dropdown__menu"><a href="/settings">Settings</a></div></details> |
| 216 | </div> |
| 217 | </header> |
| 218 | <main class="rst-page" id="main">Content.</main> |
| 219 | <footer class="rst-shell__foot">Made with rastrillo</footer> |
| 220 | </div></div><div class="rst-page" ><div class="rst-stats"> |
| 221 | <div class="rst-stat rst-stat--lead"><span class="rst-stat__label">Revenue this month</span><span class="rst-stat__num">€48,210</span><span class="rst-stat__delta" data-tone="positive">+12%</span><span class="rst-stat__note">vs. last month</span></div> |
| 222 | <div class="rst-stat"><span class="rst-stat__label">Orders today</span><span class="rst-stat__num">318</span></div> |
| 223 | <div class="rst-stat"><span class="rst-stat__label">Average basket</span><span class="rst-stat__num">€41.20</span><span class="rst-stat__delta" data-tone="negative">−3%</span></div> |
| 224 | <div class="rst-stat"><span class="rst-stat__label">Refunds</span><span class="rst-stat__num">7</span></div> |
| 225 | </div></div><div class="rst-page" ><div class="rst-tblock"> |
| 226 | <label class="rst-tblock__head"><input type="checkbox" name="notify" checked> |
| 227 | <span class="rst-switch__track" aria-hidden="true"></span> |
| 228 | <span><span class="rst-tblock__title">Email notifications</span><span class="rst-tblock__desc">Sent for every reply to a thread you're in.</span></span> |
| 229 | </label> |
| 230 | <div class="rst-tblock__body"> |
| 231 | <div class="rst-field"> |
| 232 | <label class="rst-field__label" for="notify-freq">Frequency</label> |
| 233 | <input class="rst-input" type="text" id="notify-freq" name="notify_freq" value="Daily digest"> |
| 234 | </div> |
| 235 | </div> |
| 236 | </div></div><div class="rst-page" ><header class="rst-page-header"> |
| 237 | <div class="rst-page-header__titles"> |
| 238 | <h1>Posts</h1> |
| 239 | <p class="rst-page-header__sub">Everything you have written, newest first.</p> |
| 240 | </div> |
| 241 | <a class="rst-btn rst-btn--primary" href="/posts/new"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14"/><path d="M12 5v14"/></svg>Write a post</a> |
| 242 | </header></div><div class="rst-page" ><div class="rst-lbar"> |
| 243 | <search><form class="rst-search" method="get" action="/posts"> |
| 244 | <svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg> |
| 245 | <input type="search" name="q" value="release" placeholder="Search posts" aria-label="Search posts"> |
| 246 | <a class="rst-search__clear" href="/posts?sort=newest" aria-label="Clear search"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></a> |
| 247 | <input type="hidden" name="sort" value="newest"> |
| 248 | <button class="rst-sr-only" type="submit">Search</button> |
| 249 | </form></search> |
| 250 | </div></div><div class="rst-page" ><search><form class="rst-search" method="get" action="/posts"> |
| 251 | <svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg> |
| 252 | <input type="search" name="q" value="release" placeholder="Search posts" aria-label="Search posts"> |
| 253 | <a class="rst-search__clear" href="/posts?sort=newest" aria-label="Clear search"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></a> |
| 254 | <input type="hidden" name="sort" value="newest"> |
| 255 | <button class="rst-sr-only" type="submit">Search posts</button> |
| 256 | </form></search></div><div class="rst-page" ><button class="rst-sr-only" type="submit">Search posts</button></div><div class="rst-page" ><div class="rst-row"> |
| 257 | <span class="rst-row__lead" data-lead="accent" aria-hidden="true">RN</span> |
| 258 | <span class="rst-row__main"><a href="/posts/1">Release notes, August</a><small class="rst-row__sub">Published 2 August · 4 min read</small></span> |
| 259 | <a class="rst-row__action" href="/posts/1/edit" aria-label="Edit Release notes, August">Edit</a> |
| 260 | </div></div><div class="rst-page" ><details class="rst-row-menu" name="rst-menus"> |
| 261 | <summary aria-label="Actions for Grace Hopper"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></summary> |
| 262 | <div class="rst-row-menu__panel"> |
| 263 | <a href="/orders/AB3PX/edit">Edit</a> |
| 264 | <form method="post" action="/orders/AB3PX/archive"><input type="hidden" name="state" value="archived"><button type="submit">Archive</button></form> |
| 265 | <hr> |
| 266 | <a class="rst-danger" href="/orders/AB3PX/delete">Delete order…</a> |
| 267 | </div> |
| 268 | </details></div><div class="rst-page" ><span class="rst-status" data-tone="positive">Published</span></div><div class="rst-page" ><div class="rst-empty"> |
| 269 | <h2 class="rst-empty__title">Nothing here yet</h2> |
| 270 | <p class="rst-empty__body">No posts yet. Your first one is a good place to start.</p> |
| 271 | <form class="rst-empty__cta" method="post" action="/posts/seed"> |
| 272 | <input type="hidden" name="csrf" value="tok-123"> |
| 273 | <button class="rst-btn rst-btn--primary" type="submit">Add sample posts</button> |
| 274 | </form> |
| 275 | </div></div><div class="rst-page" ><nav class="rst-pagination" aria-label="Pagination"><span class="rst-pagination__disabled rst-pagination__step rst-pagination__step--prev"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg><span class="rst-pagination__word">Previous</span></span><span aria-current="page">1</span><a class="rst-pagination__wide" href="/posts?page=2">2</a><span class="rst-pagination__gap" aria-hidden="true">…</span><a href="/posts?page=9">9</a><a class="rst-pagination__step rst-pagination__step--next" href="/posts?page=2"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg><span class="rst-pagination__word">Next</span></a> |
| 276 | </nav></div><div class="rst-page" ><span class="rst-badge">Draft</span></div><div class="rst-page" ><span class="rst-meter"><meter class="rst-meter__bar" value="82" min="0" max="100" aria-hidden="true"></meter><span class="rst-meter__num">412/500</span></span></div><div class="rst-page" ><a class="rst-person" href="/people/1"><span class="rst-person__av" aria-hidden="true">G</span><span class="rst-person__meta"><span class="rst-person__name">Grace Hopper</span><span class="rst-person__email">grace@example.com</span></span></a></div><div class="rst-page" ><div class="rst-callout" data-tone="warning"><span class="rst-callout__ic" aria-hidden="true"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg></span><div class="rst-callout__body"><strong>Connect payments to start selling</strong><p>Your event is live but can't take payment yet.</p></div></div></div><div class="rst-page" ><dl class="rst-detail"> |
| 277 | <dt>Audience</dt> |
| 278 | <dd>Members</dd> |
| 279 | <dt>Main page</dt> |
| 280 | <dd>No</dd> |
| 281 | </dl></div><div class="rst-page" ><div class="rst-field"><label class="rst-field__label" for="email">Email</label> |
| 282 | <input class="rst-input" type="email" id="email" name="email" required aria-describedby="email-help"> |
| 283 | <p class="rst-field__help" id="email-help">We'll never share this.</p> |
| 284 | </div></div><div class="rst-page" ><div class="rst-field"><label class="rst-field__label" for="role">Role</label> |
| 285 | <select class="rst-input" id="role" name="role"><option value="admin" selected>Admin</option><option value="member">Member</option></select> |
| 286 | </div></div><div class="rst-page" ><div class="rst-field"> |
| 287 | <label class="rst-field__label" for="bio">Bio</label> |
| 288 | <textarea class="rst-textarea" id="bio" name="bio" rows="4" aria-describedby="bio-hint"></textarea> |
| 289 | <small class="rst-field__hint" id="bio-hint">Shown on your profile.</small> |
| 290 | </div></div><div class="rst-page" ><div class="rst-field"> |
| 291 | <label class="rst-field__label" for="title">Title</label> |
| 292 | <input class="rst-input" id="title" name="title" type="text" aria-describedby="title-hint"> |
| 293 | <small class="rst-field__hint" id="title-hint">Shown in the list.</small> |
| 294 | </div></div><div class="rst-page" ><details class="rst-dropdown" name="rst-menus"> |
| 295 | <summary class="rst-btn">Sort <svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></summary> |
| 296 | <div class="rst-dropdown__menu"> |
| 297 | <a href="/x">Newest</a> |
| 298 | </div> |
| 299 | </details></div><div class="rst-page" ><div class="rst-form-foot"> |
| 300 | <button class="rst-btn rst-btn--primary rst-btn--lg" type="submit">Save</button> |
| 301 | <a class="rst-btn rst-btn--lg" href="/admin/posts">Back to posts</a> |
| 302 | </div></div><div class="rst-page" ><label class="rst-switch"><input type="checkbox" name="notify" checked><span class="rst-switch__track" aria-hidden="true"></span> Email me about replies</label></div><div class="rst-page" ><fieldset class="rst-choice"><legend>Plan</legend><div class="rst-choice__cards"><label><input type="radio" name="plan" value="free"><span><span class="rst-choice__title">Free</span><span class="rst-choice__desc">Good to start.</span></span></label><label><input type="radio" name="plan" value="pro" checked><span><span class="rst-choice__title">Pro</span><span class="rst-choice__desc">For growing teams.</span></span></label></div></fieldset></div><div class="rst-page" ><nav class="rst-seg-tabs" aria-label="Sections"><a href="?tab=basics" aria-current="page">Basics</a><a href="?tab=advanced">Advanced</a></nav></div><div class="rst-page" ><form class="rst-form-actions" method="post" action="/orders/1/refund"><input type="hidden" name="csrf" value="tok"><input type="hidden" name="id" value="42"><a class="rst-btn rst-btn--ghost rst-btn--lg" href="/orders/1">Cancel</a><button class="rst-btn rst-btn--danger rst-btn--lg" type="submit">Refund €10.00</button></form></div><div class="rst-page" ><nav class="rst-back-nav"><a href="/orders/1">← Order AB3PX</a></nav></div><div class="rst-page" ><div class="rst-bulkbar"><a class="rst-bulkbar__close" href="/orders" aria-label="Done selecting"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></a><span class="rst-bulkbar__selection"><span class="rst-bulkbar__count">3 selected</span><a class="rst-bulkbar__escalate" href="/orders?select=all">Select all 412 matching</a></span><details class="rst-dropdown" name="rst-menus"><summary>Actions<span class="rst-caret" aria-hidden="true"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></span></summary><div class="rst-dropdown__menu"><button type="submit" name="action" value="export">Export</button><button class="rst-danger" type="submit" name="action" value="refund" >Refund…</button></div></details></div></div><div class="rst-page" ><div class="rst-media"> |
| 303 | <div class="rst-media__tile"> |
| 304 | <div class="rst-media__frame"> |
| 305 | <img src="/images/4471.png" alt="" loading="lazy" decoding="async" width="1280" height="3200"> |
| 306 | <label class="rst-selbox"><input type="checkbox" name="id" value="4471" checked aria-label="Select Checkout, step 2"></label> |
| 307 | </div> |
| 308 | <div class="rst-media__caption"> |
| 309 | <div class="rst-media__name"><a href="/images/4471">Checkout, step 2</a><details class="rst-row-menu" name="rst-menus"> |
| 310 | <summary aria-label="Actions for Checkout, step 2"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></summary> |
| 311 | <div class="rst-row-menu__panel"> |
| 312 | <a href="/images/4471/edit">Edit</a> |
| 313 | <hr> |
| 314 | <a class="rst-danger" href="/images/4471/delete">Delete image…</a> |
| 315 | </div> |
| 316 | </details></div> |
| 317 | <p class="rst-media__desc">The payment step, with the card form open.</p> |
| 318 | <p class="rst-media__meta">1280 × 3200 · 412 KB</p> |
| 319 | </div> |
| 320 | </div> |
| 321 | <div class="rst-media__tile"> |
| 322 | <div class="rst-media__frame rst-media__frame--contain"> |
| 323 | <img src="/images/4472.svg" alt="Harbour" loading="lazy" decoding="async"> |
| 324 | <label class="rst-selbox"><input type="checkbox" name="id" value="4472" aria-label="Select Harbour logo"></label> |
| 325 | </div> |
| 326 | <div class="rst-media__caption"> |
| 327 | <div class="rst-media__name"><a href="/images/4472">Harbour logo</a></div> |
| 328 | <p class="rst-media__desc rst-media__desc--none">No description</p> |
| 329 | </div> |
| 330 | </div> |
| 331 | </div></div><div class="rst-page" ><details class="rst-dropdown rst-scheme" name="rst-menus"> |
| 332 | <summary>Colour scheme<span class="rst-caret" aria-hidden="true"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></span></summary> |
| 333 | <div class="rst-dropdown__menu" role="group" aria-label="Colour scheme"> |
| 334 | <form method="post" action="/_theme"><input type="hidden" name="scheme" value="light"><input type="hidden" name="return" value="/orders"><button type="submit">Light</button></form> |
| 335 | <form method="post" action="/_theme"><input type="hidden" name="scheme" value="dark"><input type="hidden" name="return" value="/orders"><button type="submit" aria-current="true">Dark</button></form> |
| 336 | <form method="post" action="/_theme"><input type="hidden" name="scheme" value="system"><input type="hidden" name="return" value="/orders"><button type="submit">System</button></form> |
| 337 | </div> |
| 338 | </details></div><div class="rst-page" ><span class="rst-actor">Claude for 7</span></div><div class="rst-page" ><div class="rst-tokens"> |
| 339 | <div class="rst-callout" data-tone="positive" tabindex="-1" autofocus><span class="rst-callout__ic" aria-hidden="true"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"/><path d="m9 12 2 2 4-4"/></svg></span><div class="rst-callout__body"><strong>Copy this token now. It won't be shown again.</strong><p><code class="rst-tokens__secret">notes_k3Jx9QpL2mWa_SECRETSECRETSECRET</code></p></div></div> |
| 340 | <section class="rst-box"><form class="rst-form" method="post" action="/tokens"> |
| 341 | <div class="rst-field"><label class="rst-field__label" for="agent">Agent name</label> |
| 342 | <input class="rst-input" type="text" id="agent" name="agent" maxlength="40"> |
| 343 | </div> |
| 344 | <label class="rst-switch"><input type="checkbox" name="for_self" value="on"><span class="rst-switch__track" aria-hidden="true"></span> This token is for me, not an agent</label> |
| 345 | <fieldset class="rst-choice"><legend>Access</legend><div class="rst-choice__cards"><label><input type="radio" name="access" value="write" checked><span><span class="rst-choice__title">Read and write</span></span></label><label><input type="radio" name="access" value="read"><span><span class="rst-choice__title">Read only</span></span></label></div></fieldset> |
| 346 | <div class="rst-field"><label class="rst-field__label" for="expiry">Expires</label> |
| 347 | <select class="rst-input rst-input--short" id="expiry" name="expiry"><option value="30">30 days</option><option value="90" selected>90 days</option><option value="365">1 year</option><option value="never">Never</option></select> |
| 348 | </div> |
| 349 | <div class="rst-form-foot"> |
| 350 | <button class="rst-btn rst-btn--primary rst-btn--lg" type="submit">Create token</button> |
| 351 | </div> |
| 352 | </form></section> |
| 353 | <div class="rst-card rst-tokens__list"> |
| 354 | <div class="rst-lrow rst-lrow--head"><span>Token</span><span class="rst-m-hide" >Access</span><span class="rst-m-hide" >Created</span><span class="rst-m-hide" >Last used</span><span class="rst-m-hide" >Expires</span><span></span><span></span></div> |
| 355 | <div class="rst-lrow"> |
| 356 | <span class="rst-nm" ><span class="rst-actor">Claude for Paul</span><small><code>k3Jx9QpL2mWa</code></small></span> |
| 357 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Access</span>Read and write</span> |
| 358 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Created</span><time datetime="2026-08-02">2026-08-02</time></span> |
| 359 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Last used</span><time datetime="2026-08-11">2026-08-11</time></span> |
| 360 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Expires</span><time datetime="2026-10-31">2026-10-31</time></span> |
| 361 | <span class="rst-tokens__state"></span> |
| 362 | <details class="rst-row-menu" name="rst-menus"> |
| 363 | <summary aria-label="Actions for Claude for Paul"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></summary> |
| 364 | <div class="rst-row-menu__panel"> |
| 365 | <form method="post" action="/tokens/revoke"><input type="hidden" name="id" value="k3Jx9QpL2mWa"><button type="submit">Revoke</button></form> |
| 366 | </div> |
| 367 | </details> |
| 368 | </div> |
| 369 | <div class="rst-lrow"> |
| 370 | <span class="rst-nm" ><span class="rst-actor">Paul</span><small><code>Qm2vR8sT4xYb</code></small></span> |
| 371 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Access</span>Read only</span> |
| 372 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Created</span><time datetime="2026-08-02">2026-08-02</time></span> |
| 373 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Last used</span></span> |
| 374 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Expires</span>Never</span> |
| 375 | <span class="rst-tokens__state"></span> |
| 376 | <details class="rst-row-menu" name="rst-menus"> |
| 377 | <summary aria-label="Actions for Paul"><svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></summary> |
| 378 | <div class="rst-row-menu__panel"> |
| 379 | <form method="post" action="/tokens/revoke"><input type="hidden" name="id" value="Qm2vR8sT4xYb"><button type="submit">Revoke</button></form> |
| 380 | </div> |
| 381 | </details> |
| 382 | </div> |
| 383 | <div class="rst-lrow"> |
| 384 | <span class="rst-nm" ><span class="rst-actor">Codex for Paul</span><small><code>Zp7wN1cH6kLd</code></small></span> |
| 385 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Access</span>Read and write</span> |
| 386 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Created</span><time datetime="2026-08-02">2026-08-02</time></span> |
| 387 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Last used</span></span> |
| 388 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Expires</span>Never</span> |
| 389 | <span class="rst-tokens__state"><span class="rst-status" data-tone="neutral">Revoked</span></span> |
| 390 | </div> |
| 391 | <div class="rst-lrow"> |
| 392 | <span class="rst-nm" ><span class="rst-actor">Nightly import for Paul</span><small><code>Vb4tG9yK3nMe</code></small></span> |
| 393 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Access</span>Read only</span> |
| 394 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Created</span><time datetime="2026-08-02">2026-08-02</time></span> |
| 395 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Last used</span></span> |
| 396 | <span class="rst-tokens__fact"><span class="rst-tokens__fact-label">Expires</span><time datetime="2026-08-11">2026-08-11</time></span> |
| 397 | <span class="rst-tokens__state"><span class="rst-status" data-tone="warning">Expired</span></span> |
| 398 | </div> |
| 399 | </div> |
| 400 | <div class="rst-tokens__revoke"> |
| 401 | <form method="post" action="/tokens/revoke-agent"><input type="hidden" name="agent" value="Claude"><button class="rst-btn" type="submit">Revoke all for this agent: Claude</button></form> |
| 402 | <form method="post" action="/tokens/revoke-all"><button class="rst-btn rst-btn--danger" type="submit">Revoke all tokens</button></form> |
| 403 | </div> |
| 404 | </div></div><div class="rst-page" ><div class="rst-error"> |
| 405 | <p class="rst-error__status">500</p> |
| 406 | <h1 class="rst-error__title">Something went wrong on our side</h1> |
| 407 | <p class="rst-error__body">It's not you. The problem has been recorded. Try again in a moment; if it keeps happening, quote the reference below.</p> |
| 408 | <p class="rst-error__cta"><a class="rst-btn rst-btn--primary" href="/">Start page</a> <a class="rst-btn" href="/orders">Go back</a></p> |
| 409 | <p class="rst-error__ref rst-mono" dir="auto">Reference: k3f9tq</p> |
| 410 | </div></div><div class="rst-page" ><div class="rst-field"> |
| 411 | <label class="rst-field__label" for="published_on">Published on <span class="rst-field__required" aria-hidden="true">*</span></label> |
| 412 | <input class="rst-input" id="published_on" name="published_on" type="date" value="2026-08-28" min="2026-01-01" max="2026-12-31" required aria-invalid="true" aria-describedby="published_on-hint published_on-error" data-rst-date data-rst-date-words="{"ago":"ago","am":"am|a.m.","at":"at","day":"day|days","hour":"hour|hours|h","in":"in","last":"last","midnight":"midnight","minute":"minute|minutes|min|mins|m","month":"month|months","next":"next","noon":"noon|midday","pm":"pm|p.m.","today":"today","tomorrow":"tomorrow","week":"week|weeks","yesterday":"yesterday"}" data-rst-date-set="Set" data-rst-date-hint="Try: {example}" data-rst-date-pick="Open the calendar" data-rst-date-calendar="Calendar" data-rst-date-prev-month="Previous month" data-rst-date-next-month="Next month" data-rst-date-results="{n} suggestions" data-rst-date-result-one="1 suggestion" data-rst-date-quick-today="Today" data-rst-date-quick-tomorrow="Tomorrow" data-rst-date-quick-next-week="In a week" data-rst-date-quick-plus-1h="An hour later" data-rst-date-quick-plus-2h="Two hours later" data-rst-date-quick-end-of-day="End of that day" data-rst-date-quick-next-day="Same time next day"> |
| 413 | <small class="rst-field__hint" id="published_on-hint">The day it goes live.</small> |
| 414 | <small class="rst-field__error" id="published_on-error">Pick a date.</small> |
| 415 | </div></div><div class="rst-page" ><div class="rst-field"> |
| 416 | <label class="rst-field__label" for="doors">Doors open <span class="rst-field__required" aria-hidden="true">*</span></label> |
| 417 | <input class="rst-input" id="doors" name="doors" type="time" value="19:30" min="09:00" max="23:00" required aria-invalid="true" aria-describedby="doors-hint doors-error" data-rst-time data-rst-date-words="{"ago":"ago","am":"am|a.m.","at":"at","day":"day|days","hour":"hour|hours|h","in":"in","last":"last","midnight":"midnight","minute":"minute|minutes|min|mins|m","month":"month|months","next":"next","noon":"noon|midday","pm":"pm|p.m.","today":"today","tomorrow":"tomorrow","week":"week|weeks","yesterday":"yesterday"}" data-rst-date-set="Set" data-rst-date-hint="Try: {example}" data-rst-date-pick="Open the calendar" data-rst-date-pick-time="Open the clock" data-rst-date-results="{n} suggestions" data-rst-date-result-one="1 suggestion" data-rst-date-quick-today="Today" data-rst-date-quick-tomorrow="Tomorrow" data-rst-date-quick-next-week="In a week" data-rst-date-quick-plus-1h="An hour later" data-rst-date-quick-plus-2h="Two hours later" data-rst-date-quick-end-of-day="End of that day" data-rst-date-quick-next-day="Same time next day"> |
| 418 | <small class="rst-field__hint" id="doors-hint">Local time.</small> |
| 419 | <small class="rst-field__error" id="doors-error">Pick a time.</small> |
| 420 | </div></div><div class="rst-page" ><div class="rst-field"> |
| 421 | <label class="rst-field__label" for="published_at">Publish at <span class="rst-field__required" aria-hidden="true">*</span></label> |
| 422 | <input class="rst-input" id="published_at" name="published_at" type="datetime-local" value="2026-08-28T19:30" min="2026-01-01T00:00" max="2026-12-31T23:59" required aria-invalid="true" aria-describedby="published_at-hint published_at-error" data-rst-date data-rst-date-words="{"ago":"ago","am":"am|a.m.","at":"at","day":"day|days","hour":"hour|hours|h","in":"in","last":"last","midnight":"midnight","minute":"minute|minutes|min|mins|m","month":"month|months","next":"next","noon":"noon|midday","pm":"pm|p.m.","today":"today","tomorrow":"tomorrow","week":"week|weeks","yesterday":"yesterday"}" data-rst-date-set="Set" data-rst-date-hint="Try: {example}" data-rst-date-pick="Open the calendar" data-rst-date-calendar="Calendar" data-rst-date-prev-month="Previous month" data-rst-date-next-month="Next month" data-rst-date-results="{n} suggestions" data-rst-date-result-one="1 suggestion" data-rst-date-quick-today="Today" data-rst-date-quick-tomorrow="Tomorrow" data-rst-date-quick-next-week="In a week" data-rst-date-quick-plus-1h="An hour later" data-rst-date-quick-plus-2h="Two hours later" data-rst-date-quick-end-of-day="End of that day" data-rst-date-quick-next-day="Same time next day"> |
| 423 | <small class="rst-field__hint" id="published_at-hint">When it goes live.</small> |
| 424 | <small class="rst-field__error" id="published_at-error">Pick a time.</small> |
| 425 | </div></div><div class="rst-page" ><fieldset class="rst-field-range"> |
| 426 | <legend>When</legend> |
| 427 | <div class="rst-field-row" data-rst-range="session"> |
| 428 | <div class="rst-field"> |
| 429 | <label class="rst-field__label" for="starts_at">Starts</label> |
| 430 | <input class="rst-input" id="starts_at" name="starts_at" type="datetime-local" value="2026-08-28T19:30" data-rst-date data-rst-date-words="{"ago":"ago","am":"am|a.m.","at":"at","day":"day|days","hour":"hour|hours|h","in":"in","last":"last","midnight":"midnight","minute":"minute|minutes|min|mins|m","month":"month|months","next":"next","noon":"noon|midday","pm":"pm|p.m.","today":"today","tomorrow":"tomorrow","week":"week|weeks","yesterday":"yesterday"}" data-rst-date-set="Set" data-rst-date-hint="Try: {example}" data-rst-date-pick="Open the calendar" data-rst-date-calendar="Calendar" data-rst-date-prev-month="Previous month" data-rst-date-next-month="Next month" data-rst-date-results="{n} suggestions" data-rst-date-result-one="1 suggestion" data-rst-date-quick-today="Today" data-rst-date-quick-tomorrow="Tomorrow" data-rst-date-quick-next-week="In a week" data-rst-date-quick-plus-1h="An hour later" data-rst-date-quick-plus-2h="Two hours later" data-rst-date-quick-end-of-day="End of that day" data-rst-date-quick-next-day="Same time next day"> |
| 431 | </div> |
| 432 | <div class="rst-field"> |
| 433 | <label class="rst-field__label" for="ends_at">Ends</label> |
| 434 | <input class="rst-input" id="ends_at" name="ends_at" type="datetime-local" aria-invalid="true" aria-describedby="ends_at-error" data-rst-date data-rst-date-words="{"ago":"ago","am":"am|a.m.","at":"at","day":"day|days","hour":"hour|hours|h","in":"in","last":"last","midnight":"midnight","minute":"minute|minutes|min|mins|m","month":"month|months","next":"next","noon":"noon|midday","pm":"pm|p.m.","today":"today","tomorrow":"tomorrow","week":"week|weeks","yesterday":"yesterday"}" data-rst-date-set="Set" data-rst-date-hint="Try: {example}" data-rst-date-pick="Open the calendar" data-rst-date-calendar="Calendar" data-rst-date-prev-month="Previous month" data-rst-date-next-month="Next month" data-rst-date-results="{n} suggestions" data-rst-date-result-one="1 suggestion" data-rst-date-quick-today="Today" data-rst-date-quick-tomorrow="Tomorrow" data-rst-date-quick-next-week="In a week" data-rst-date-quick-plus-1h="An hour later" data-rst-date-quick-plus-2h="Two hours later" data-rst-date-quick-end-of-day="End of that day" data-rst-date-quick-next-day="Same time next day"> |
| 435 | <small class="rst-field__error" id="ends_at-error">The end comes before the start.</small> |
| 436 | </div> |
| 437 | </div> |
| 438 | </fieldset></div><div class="rst-page" ><div class="rst-field"> |
| 439 | <label class="rst-field__label" for="website">Website <span class="rst-field__required" aria-hidden="true">*</span></label> |
| 440 | <input class="rst-input" id="website" name="website" type="text" inputmode="url" autocomplete="url" autocapitalize="none" autocorrect="off" spellcheck="false" value="brightwater.example/pricing" required aria-invalid="true" aria-describedby="website-hint website-error"> |
| 441 | <small class="rst-field__hint" id="website-hint">Where people can read more.</small> |
| 442 | <small class="rst-field__error" id="website-error">Enter a web address, like example.com.</small> |
| 443 | </div></div><div class="rst-page" ><div class="rst-field"> |
| 444 | <label class="rst-field__label" for="ticket_price">Ticket price <span class="rst-mono" >EUR</span> <span class="rst-field__required" aria-hidden="true">*</span></label> |
| 445 | <input class="rst-input" id="ticket_price" name="ticket_price" type="text" inputmode="decimal" value="12,.50" required aria-invalid="true" aria-describedby="ticket_price-hint ticket_price-error"> |
| 446 | <input type="hidden" name="ticket_price.locale" value="en"> |
| 447 | <input type="hidden" name="ticket_price.currency" value="EUR"> |
| 448 | <input type="hidden" name="ticket_price.seed" value=""> |
| 449 | <small class="rst-field__hint" id="ticket_price-hint">For example, 12.50 or €12.50.</small> |
| 450 | <small class="rst-field__error" id="ticket_price-error">Use a point for decimals, like 12.50.</small> |
| 451 | </div></div><div class="rst-page" ><section class="rst-signin" aria-labelledby="rst-signin-heading"> |
| 452 | <div class="rst-signin__brand"><div class="rst-signin__mark"><svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><circle cx="12" cy="12" r="9"/></svg></div><p class="rst-signin__name">Harbour</p><p class="rst-signin__pitch">Moorings and berths, booked in a minute.</p></div> |
| 453 | <div class="rst-signin__door"> |
| 454 | <h1 id="rst-signin-heading">Sign in to Harbour</h1> |
| 455 | <form class="rst-signin__form" method="post" action="/signin"> |
| 456 | <div class="rst-field"><label class="rst-field__label" for="rst-signin-email">Email</label> |
| 457 | <input class="rst-input" type="email" id="rst-signin-email" name="address" value="grace@example.com" required autofocus autocomplete="email"> |
| 458 | </div> |
| 459 | <button class="rst-btn rst-btn--primary rst-btn--block" type="submit">Continue</button> |
| 460 | </form> |
| 461 | </div> |
| 462 | </section></div><div class="rst-page" >Check your email to sign in to Harbour</div> |