diff options
| author | Peter Stone <thepeterstone@gmail.com> | 2026-01-12 14:28:50 -1000 |
|---|---|---|
| committer | Peter Stone <thepeterstone@gmail.com> | 2026-01-12 14:28:50 -1000 |
| commit | 06c7485a7d05de86f9898e388161e8d932d5f3e6 (patch) | |
| tree | 376083a75278c9758f53c0062742062dedb75633 /web/templates/partials/error-banner.html | |
| parent | 9ef5b7f37883f846f105da9dc5d2ba1415e594e3 (diff) | |
Modernize frontend with tabs, HTMX, and Tailwind build pipeline
Complete UI overhaul implementing modern design patterns with HTMX for
dynamic updates, proper Tailwind build pipeline, and improved UX.
Build Pipeline:
- Add npm + PostCSS + Tailwind CSS configuration
- Custom design system with brand colors
- Compiled CSS: 27KB (vs 3MB CDN), 99% reduction
- Makefile for unified build commands
- Inter font for improved typography
Tab Interface:
- Separate Tasks tab from Notes tab using HTMX
- Partial page updates without full refreshes
- Tab state management with proper refresh handling
- New endpoints: /tabs/tasks, /tabs/notes, /tabs/refresh
Template Architecture:
- Modular partials system (7 reusable components)
- Cleaner separation of concerns
Empty Board Management:
- Active boards in main 3-column grid
- Empty boards in collapsible section
- Reduces visual clutter
Visual Design Enhancements:
- Inter font, brand color accents
- Improved typography hierarchy and spacing
- Enhanced card styling with hover effects
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Diffstat (limited to 'web/templates/partials/error-banner.html')
| -rw-r--r-- | web/templates/partials/error-banner.html | 12 |
1 files changed, 12 insertions, 0 deletions
diff --git a/web/templates/partials/error-banner.html b/web/templates/partials/error-banner.html new file mode 100644 index 0000000..eb4c08d --- /dev/null +++ b/web/templates/partials/error-banner.html @@ -0,0 +1,12 @@ +{{define "error-banner"}} +{{if .Errors}} +<div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded-lg mb-6"> + <p class="font-bold">Errors:</p> + <ul class="list-disc list-inside"> + {{range .Errors}} + <li>{{.}}</li> + {{end}} + </ul> +</div> +{{end}} +{{end}} |
