luxick/chronological
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial implementation

Browse Source
This commit is contained in:
luxick
2025-12-10 11:10:52 +01:00
parent cff9defc4a
commit 4cb97a25ba
26 changed files with 2714 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
web/templates/partials/timeline.html Normal file
View File

@@ -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}}