| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> |
| <title>Validate — Sheetly</title> |
| <link rel="preconnect" href="https://fonts.googleapis.com" /> |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> |
| <link href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,500;12..96,700;12..96,800&family=Figtree:wght@400;500;600;700&display=swap" rel="stylesheet" /> |
| <link rel="stylesheet" href="/static/css/styles.css" /> |
| </head> |
| <body> |
| <div class="shell shell-wide"> |
| <nav class="nav"> |
| <a class="brand" href="/">Sheetly</a> |
| <div class="nav-links"> |
| <a href="/">Upload</a> |
| <a class="active" href="/validate">Validate</a> |
| <a href="/dashboard">Dashboard</a> |
| </div> |
| </nav> |
|
|
| <section class="hero"> |
| <h1>Validation desk</h1> |
| <p> |
| Review extractions against the source. Doubtful fields |
| stay highlighted until you confirm or correct them. |
| </p> |
| </section> |
|
|
| <div class="validate-toolbar"> |
| <div class="toolbar-meta"> |
| <div class="counter" id="counter"> |
| <strong>0</strong> / 0 documents |
| </div> |
| </div> |
| <div class="actions toolbar-actions"> |
| <button id="prevBtn" class="secondary" type="button"> |
| Previous |
| </button> |
| <button id="nextBtn" class="secondary" type="button"> |
| Next |
| </button> |
| <button id="saveBtn" type="button"> |
| Save corrections |
| </button> |
| </div> |
| </div> |
|
|
| <div class="workspace"> |
| <aside class="queue-pane"> |
| <div class="pane-head"> |
| <h2>Queue</h2> |
| <span class="badge" id="queueCount">0</span> |
| </div> |
| <div class="queue-search"> |
| <input |
| id="queueSearch" |
| type="search" |
| placeholder="Filter by name or type…" |
| autocomplete="off" |
| /> |
| </div> |
| <ul class="queue-list" id="queueList"></ul> |
| </aside> |
|
|
| <section class="preview-pane"> |
| <div class="pane-head"> |
| <h2>Source</h2> |
| <span class="badge" id="fileBadge"></span> |
| </div> |
| <div class="preview-body" id="preview"> |
| <p class="preview-empty"> |
| Select a document to preview the source. |
| </p> |
| </div> |
| </section> |
|
|
| <section class="fields-pane"> |
| <div class="pane-head"> |
| <h2>Extracted data</h2> |
| <span class="badge" id="typeBadge"></span> |
| </div> |
| <div class="fields-body"> |
| <ul class="issues" id="issues"></ul> |
| <form id="fieldsForm"> |
| <p class="fields-empty"> |
| Structured fields appear here once a |
| document is selected. |
| </p> |
| </form> |
| </div> |
| </section> |
| </div> |
| </div> |
| <div class="toast" id="toast" role="status"></div> |
| <script src="/static/js/validate.js"></script> |
| </body> |
| </html> |
|
|
