| 1 | {{/* The demo application's record: demo-request.html, one request |
| 2 | open. Rastrillo's demo, written in the markup of the Fiesta examples |
| 3 | that document each piece: back-nav, page-header, status-pill, badge, |
| 4 | detail-list, field-textarea, form-foot and callout. The callout's body |
| 5 | is Fiesta's own words. */}} |
| 6 | <section class="app-view" id="view-request"> |
| 7 | <nav rst-back-nav><a data-gallery-nav href="{{.Requests}}">← Requests</a></nav> |
| 8 | <header rst-page-header> |
| 9 | <div rst-page-header-titles> |
| 10 | <h1>Invoice #4471 never arrived</h1> |
| 11 | <p rst-page-header-sub>Reported by Fiona Reid, and still waiting on us.</p> |
| 12 | </div> |
| 13 | </header> |
| 14 | <p><span rst-status rst-tone="warning">Waiting</span> <span rst-badge>Billing</span></p> |
| 15 | <div rst-box-head><h2>Details</h2></div> |
| 16 | <section rst-box><dl rst-detail> |
| 17 | <dt>Reference</dt> |
| 18 | <dd class="rst-mono">REQ-4471</dd> |
| 19 | <dt>Reported by</dt> |
| 20 | <dd>fiona@example.com</dd> |
| 21 | <dt>Queue</dt> |
| 22 | <dd>Billing</dd> |
| 23 | <dt>Opened</dt> |
| 24 | <dd><time datetime="2026-08-14T09:12">14 August, 09:12</time></dd> |
| 25 | </dl></section> |
| 26 | <div rst-box-head><h2>Reply</h2></div> |
| 27 | <section rst-box><form rst-form method="post" action="#"><div rst-field> |
| 28 | <label rst-field-label for="reply">Your reply</label> |
| 29 | <textarea rst-textarea id="reply" name="reply" rows="4" aria-describedby="reply-hint"></textarea> |
| 30 | <small rst-field-hint id="reply-hint">The person who reported this gets it by email.</small> |
| 31 | </div> |
| 32 | <div rst-form-foot> |
| 33 | <button rst-btn="primary lg" type="submit">Send reply</button> |
| 34 | <a rst-btn="lg" data-gallery-nav href="{{.Requests}}">Cancel</a> |
| 35 | </div></form></section> |
| 36 | <div rst-callout rst-tone="info"><span 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="M12 16v-4"/><path d="M12 8h.01"/></svg></span><div rst-callout-body><strong>Every screen has its own address</strong><p>{{.Callout}}</p></div></div> |
| 37 | <p><a rst-btn data-gallery-nav href="{{.Overview}}">{{.Back}}</a></p> |
| 38 | </section> |
| 39 | |
amadan