feat: full UI overhaul — dark theme with custom design system
All checks were successful
Deploy / deploy (push) Successful in 39s

Replace Pico CSS with a custom dark design system:
- Deep navy background (#090b12) with violet-indigo accent (#7b6cf5)
- Outfit font for UI, JetBrains Mono for code/URLs
- Custom nav with SVG icons and active-state highlighting
- Pill badges with colored status dots
- Uppercase letter-spaced table headers
- Stat cards on replica detail page
- h3 section headings with extending rule line
- Refined dialog/modal styling with blur backdrop
- Terminal-style SSE log stream
- Progress bar with accent gradient animation
- Page entrance fade-in animation
- All Pico CSS variable references replaced with custom tokens

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-26 22:52:35 +01:00
parent 849c047f2c
commit 7b1a85bc84
7 changed files with 893 additions and 359 deletions

View File

@@ -13,11 +13,11 @@
<tbody>
{% for log in logs %}
<tr class="log-entry-{{ log.level or 'info' }}">
<td><small>{{ log.created_at.strftime('%Y-%m-%d %H:%M:%S') if log.created_at else '' }}</small></td>
<td><small style="font-family:var(--mono);">{{ log.created_at.strftime('%Y-%m-%d %H:%M:%S') if log.created_at else '' }}</small></td>
<td><span class="badge badge-{{ log.level or 'info' }}">{{ log.level or 'info' }}</span></td>
<td>{{ log.replica_id or '' }}</td>
<td>{{ log.doc_id or '' }}</td>
<td>{{ log.message or '' }}</td>
<td style="font-size:.82rem;">{{ log.replica_id or '' }}</td>
<td style="font-family:var(--mono); font-size:.8rem;">{{ log.doc_id or '' }}</td>
<td style="font-size:.83rem;">{{ log.message or '' }}</td>
</tr>
{% endfor %}
</tbody>