From 06c7485a7d05de86f9898e388161e8d932d5f3e6 Mon Sep 17 00:00:00 2001
From: Peter Stone <thepeterstone@gmail.com>
Date: Mon, 12 Jan 2026 14:28:50 -1000
Subject: 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>
---
 Makefile | 36 ++++++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)
 create mode 100644 Makefile

(limited to 'Makefile')

diff --git a/Makefile b/Makefile
new file mode 100644
index 0000000..bee9968
--- /dev/null
+++ b/Makefile
@@ -0,0 +1,36 @@
+.PHONY: help build run dev test css css-watch install clean
+
+help: ## Show this help message
+	@echo 'Usage: make [target]'
+	@echo ''
+	@echo 'Targets:'
+	@awk 'BEGIN {FS = ":.*?## "} /^[a-zA-Z_-]+:.*?## / {printf "  %-15s %s\n", $$1, $$2}' $(MAKEFILE_LIST)
+
+install: ## Install all dependencies (Go + npm)
+	go mod download
+	npm install
+
+css: ## Build CSS once
+	npm run build
+
+css-watch: ## Watch CSS for changes
+	npm run dev
+
+build: css ## Build Go binary with CSS
+	go build -o dashboard cmd/dashboard/main.go
+
+run: css ## Build CSS and run server
+	go run cmd/dashboard/main.go
+
+dev: ## Run in development mode (CSS watch + Go server in separate terminals)
+	@echo "Run these in separate terminals:"
+	@echo "  Terminal 1: make css-watch"
+	@echo "  Terminal 2: go run cmd/dashboard/main.go"
+
+test: ## Run tests
+	go test ./...
+
+clean: ## Clean build artifacts
+	rm -f dashboard
+	rm -f web/static/css/output.css
+	rm -rf node_modules
-- 
cgit v1.2.3