From 7fd381a242f68b7c6f10db4e3ae0bb3d06e36a16 Mon Sep 17 00:00:00 2001
From: Peter Stone <thepeterstone@gmail.com>
Date: Thu, 22 Jan 2026 10:09:07 -1000
Subject: Fix background image CORS issue

Switch from Unsplash Source API to Lorem Picsum which has proper
CORS headers for cross-origin image loading.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 issues/005-visual-task-timing-differentiation.md | 61 ++++++++++++++++++++++++
 1 file changed, 61 insertions(+)
 create mode 100644 issues/005-visual-task-timing-differentiation.md

(limited to 'issues/005-visual-task-timing-differentiation.md')

diff --git a/issues/005-visual-task-timing-differentiation.md b/issues/005-visual-task-timing-differentiation.md
new file mode 100644
index 0000000..4cc40b4
--- /dev/null
+++ b/issues/005-visual-task-timing-differentiation.md
@@ -0,0 +1,61 @@
+# [FEATURE] Visual differentiation for task timing
+
+## Description
+Tasks after today should be grayed out, past deadline should be emphasized.
+
+## User Story
+As a user, I want past-due tasks highlighted and future tasks dimmed so urgency is immediately visible.
+
+## Technical Context
+- Pure presentation logic in template
+- Affects: `partials/todoist-tasks.html`, `partials/tasks-tab.html`
+- Requires comparing task `due_date` against current date
+
+## Test Strategy
+
+### Unit Test (Red)
+**File:** `internal/handlers/handlers_test.go`
+
+Test helper function returns correct urgency class.
+
+```go
+func TestTaskUrgencyClass(t *testing.T) {
+    tests := []struct {
+        name     string
+        dueDate  time.Time
+        expected string
+    }{
+        {"overdue yesterday", yesterday, "overdue"},
+        {"due today", today, "today"},
+        {"due tomorrow", tomorrow, "future"},
+        {"no due date", zeroTime, "none"},
+    }
+    // ...
+}
+```
+
+### E2E Test (Red)
+Assert CSS classes applied correctly to tasks based on due date.
+
+## Proposed Approach
+
+1. Add template helper or compute urgency class in handler
+2. Return struct with `UrgencyClass` field for each task
+3. Apply Tailwind classes based on urgency:
+   - `text-red-600 font-bold` (overdue)
+   - `text-inherit` or default (today)
+   - `text-gray-400` (future)
+4. Consider adding visual indicator icon (e.g., warning for overdue)
+
+## Affected Components
+- `internal/handlers/handlers.go`
+- `internal/models/types.go` (if adding field to view model)
+- `web/templates/partials/todoist-tasks.html`
+- `web/templates/partials/tasks-tab.html`
+
+## Definition of Done
+- [ ] Overdue tasks visually emphasized (red/bold)
+- [ ] Future tasks grayed out
+- [ ] Today's tasks normal styling
+- [ ] Unit tests for urgency calculation
+- [ ] E2E test verifies correct classes applied
-- 
cgit v1.2.3