Initial implementation

web/templates/partials/calendar.html

@@ -0,0 +1,80 @@
+{{define "calendar.html"}}
+<div class="calendar">
+    <div class="calendar-header">
+        <button 
+            hx-get="/calendar/{{.PrevYear}}/{{.PrevMonth}}"
+            hx-target="#calendar-panel"
+            hx-swap="innerHTML"
+            class="nav-btn"
+            aria-label="Previous month">
+            &#8249;
+        </button>
+        <h2>{{.MonthName}} {{.Year}}</h2>
+        <button 
+            hx-get="/calendar/{{.NextYear}}/{{.NextMonth}}"
+            hx-target="#calendar-panel"
+            hx-swap="innerHTML"
+            class="nav-btn"
+            aria-label="Next month">
+            &#8250;
+        </button>
+    </div>
+    
+    <div class="calendar-weekdays">
+        <span>Sun</span>
+        <span>Mon</span>
+        <span>Tue</span>
+        <span>Wed</span>
+        <span>Thu</span>
+        <span>Fri</span>
+        <span>Sat</span>
+    </div>
+    
+    <div class="calendar-grid">
+        {{/* Empty cells before first day */}}
+        {{range seq 0 (sub .FirstDayWeekday 1)}}
+        <div class="calendar-day empty"></div>
+        {{end}}
+        
+        {{/* Day cells */}}
+        {{range $day := seq 1 .DaysInMonth}}
+        {{$content := index $.Days $day}}
+        <div 
+            class="calendar-day{{if isToday $.Year $.Month $day}} today{{end}}{{if $content.HasContent}} has-content{{end}}"
+            hx-get="/day/{{$.Year}}/{{$.Month | printf "%d"}}/{{$day}}"
+            hx-target="#day-modal-content"
+            hx-swap="innerHTML"
+            hx-trigger="click"
+            data-opens-modal="day-modal">
+            <span class="day-number">{{$day}}</span>
+            {{if $content.HasContent}}
+            <div class="day-indicators">
+                {{if $content.HasEvents}}<span class="indicator event-indicator" title="Events">📅</span>{{end}}
+                {{if $content.HasDiary}}<span class="indicator diary-indicator" title="Diary">📝</span>{{end}}
+                {{if $content.HasPhotos}}<span class="indicator photo-indicator" title="Photos">📷</span>{{end}}
+            </div>
+            {{end}}
+        </div>
+        {{end}}
+    </div>
+    
+    <div class="calendar-actions">
+        <button 
+            hx-get="/timeline/{{.Year}}/{{.Month | printf "%d"}}"
+            hx-target="#timeline-panel"
+            hx-swap="innerHTML"
+            class="btn btn-primary">
+            View Timeline
+        </button>
+    </div>
+</div>
+
+<dialog id="day-modal" class="day-modal">
+    <div id="day-modal-content">
+        <!-- Day content loaded via HTMX -->
+    </div>
+    <form method="dialog">
+        <button class="btn btn-secondary">Close</button>
+    </form>
+</dialog>
+{{end}}

web/templates/partials/day.html

@@ -0,0 +1,112 @@
+{{define "day.html"}}
+<div class="day-detail">
+    <header class="day-header">
+        <h2>{{.Date.Format "Monday, January 2, 2006"}}</h2>
+    </header>
+    
+    <div id="day-detail-content">
+        {{template "day_content.html" .}}
+    </div>
+</div>
+{{end}}
+
+{{define "day_content.html"}}
+<div class="day-content">
+    {{/* Events Section */}}
+    <section class="day-section events-section">
+        <h3>📅 Events</h3>
+        {{if .Content.Events}}
+        <ul class="event-list">
+            {{range .Content.Events}}
+            <li class="event-item">
+                <strong>{{.Title}}</strong>
+                {{if not .AllDay}}
+                <span class="event-time">{{formatTime .Start}} - {{formatTime .End}}</span>
+                {{else}}
+                <span class="event-time">All day</span>
+                {{end}}
+                {{if .Location}}
+                <span class="event-location">📍 {{.Location}}</span>
+                {{end}}
+                {{if .Description}}
+                <p class="event-description">{{.Description}}</p>
+                {{end}}
+            </li>
+            {{end}}
+        </ul>
+        {{else}}
+        <p class="empty-message">No events scheduled.</p>
+        {{end}}
+    </section>
+    
+    {{/* Diary Section */}}
+    <section class="day-section diary-section">
+        <h3>📝 Journal</h3>
+        {{if .Content.Diary}}
+        <div class="diary-display">
+            <p class="diary-text">{{.Content.Diary.Text}}</p>
+            <button 
+                class="btn btn-small"
+                data-action="toggle-diary-edit">
+                Edit
+            </button>
+        </div>
+        <div class="diary-edit" style="display: none;">
+            <form 
+                hx-post="/diary/{{formatDate .Date}}"
+                hx-target="#day-detail-content"
+                hx-swap="innerHTML">
+                <textarea name="text" rows="5" placeholder="Write your thoughts...">{{.Content.Diary.Text}}</textarea>
+                <div class="form-actions">
+                    <button type="submit" class="btn btn-primary">Save</button>
+                    <button 
+                        type="button" 
+                        class="btn btn-secondary"
+                        data-action="cancel-diary-edit">
+                        Cancel
+                    </button>
+                    <button 
+                        type="button"
+                        class="btn btn-danger"
+                        hx-delete="/diary/{{formatDate .Date}}"
+                        hx-target="#day-detail-content"
+                        hx-swap="innerHTML"
+                        hx-confirm="Delete this diary entry?">
+                        Delete
+                    </button>
+                </div>
+            </form>
+        </div>
+        {{else}}
+        <form 
+            hx-post="/diary/{{formatDate .Date}}"
+            hx-target="#day-detail-content"
+            hx-swap="innerHTML">
+            <textarea name="text" rows="5" placeholder="Write your thoughts..."></textarea>
+            <div class="form-actions">
+                <button type="submit" class="btn btn-primary">Save</button>
+            </div>
+        </form>
+        {{end}}
+    </section>
+    
+    {{/* Photos Section */}}
+    <section class="day-section photos-section">
+        <h3>📷 Photos</h3>
+        {{if .Content.Photos}}
+        <div class="photo-gallery">
+            {{range .Content.Photos}}
+            <figure class="photo-item">
+                <a href="{{.URLPath}}" target="_blank">
+                    <img src="{{.URLPath}}" alt="{{.Description}}" loading="lazy">
+                </a>
+                <figcaption>{{.Description}}</figcaption>
+            </figure>
+            {{end}}
+        </div>
+        {{else}}
+        <p class="empty-message">No photos for this day.</p>
+        {{end}}
+    </section>
+</div>
+{{end}}

web/templates/partials/diary_form.html

@@ -0,0 +1,26 @@
+{{define "diary_form.html"}}
+<div class="diary-form">
+    <h3>Journal Entry - {{.Date.Format "January 2, 2006"}}</h3>
+    <form 
+        hx-post="/diary/{{formatDate .Date}}"
+        hx-target="this"
+        hx-swap="outerHTML">
+        <textarea 
+            name="text" 
+            rows="8" 
+            placeholder="Write your thoughts...">{{if .Entry}}{{.Entry.Text}}{{end}}</textarea>
+        <div class="form-actions">
+            <button type="submit" class="btn btn-primary">Save</button>
+            {{if .Entry}}
+            <button 
+                type="button"
+                class="btn btn-danger"
+                hx-delete="/diary/{{formatDate .Date}}"
+                hx-confirm="Delete this diary entry?">
+                Delete
+            </button>
+            {{end}}
+        </div>
+    </form>
+</div>
+{{end}}

web/templates/partials/timeline.html

@@ -0,0 +1,93 @@
+{{define "timeline.html"}}
+<div class="timeline">
+    <div class="timeline-header">
+        <button 
+            hx-get="/timeline/{{.PrevYear}}/{{.PrevMonth}}"
+            hx-target="#timeline-panel"
+            hx-swap="innerHTML"
+            class="nav-btn"
+            aria-label="Previous month">
+            &#8249;
+        </button>
+        <h2>{{.MonthName}} {{.Year}}</h2>
+        <button 
+            hx-get="/timeline/{{.NextYear}}/{{.NextMonth}}"
+            hx-target="#timeline-panel"
+            hx-swap="innerHTML"
+            class="nav-btn"
+            aria-label="Next month">
+            &#8250;
+        </button>
+    </div>
+    
+    <div class="timeline-content">
+        {{if .Days}}
+        {{range .Days}}
+        <article class="timeline-day">
+            <header class="timeline-day-header">
+                <time datetime="{{formatDate .Date}}">
+                    {{.Date.Format "Monday, January 2"}}
+                </time>
+            </header>
+            
+            <div class="timeline-entries">
+                {{/* Events */}}
+                {{range .Events}}
+                <div class="timeline-entry event-entry">
+                    <div class="entry-icon">📅</div>
+                    <div class="entry-content">
+                        <h4>{{.Title}}</h4>
+                        {{if not .AllDay}}
+                        <span class="entry-time">{{formatTime .Start}} - {{formatTime .End}}</span>
+                        {{else}}
+                        <span class="entry-time">All day</span>
+                        {{end}}
+                        {{if .Location}}
+                        <span class="entry-location">📍 {{.Location}}</span>
+                        {{end}}
+                        {{if .Description}}
+                        <p class="entry-description">{{.Description}}</p>
+                        {{end}}
+                    </div>
+                </div>
+                {{end}}
+                
+                {{/* Diary entry */}}
+                {{if .Diary}}
+                <div class="timeline-entry diary-entry">
+                    <div class="entry-icon">📝</div>
+                    <div class="entry-content">
+                        <h4>Journal Entry</h4>
+                        <p class="entry-description diary-text">{{.Diary.Text}}</p>
+                    </div>
+                </div>
+                {{end}}
+                
+                {{/* Photos */}}
+                {{if .Photos}}
+                <div class="timeline-entry photo-entry">
+                    <div class="entry-icon">📷</div>
+                    <div class="entry-content">
+                        <h4>Photos</h4>
+                        <div class="photo-grid">
+                            {{range .Photos}}
+                            <figure class="photo-item">
+                                <img src="{{.URLPath}}" alt="{{.Description}}" loading="lazy">
+                                <figcaption>{{.Description}}</figcaption>
+                            </figure>
+                            {{end}}
+                        </div>
+                    </div>
+                </div>
+                {{end}}
+            </div>
+        </article>
+        {{end}}
+        {{else}}
+        <div class="timeline-empty">
+            <p>No entries for this month.</p>
+        </div>
+        {{end}}
+    </div>
+</div>
+{{end}}