diff options
| author | Danilo M. <danix@danix.xyz> | 2026-04-22 12:42:56 +0200 |
|---|---|---|
| committer | Danilo M. <danix@danix.xyz> | 2026-04-22 12:42:56 +0200 |
| commit | 631547a75142326a7c71bdf123e1475217a5ad73 (patch) | |
| tree | f3cfef6b3c5b42bf626fc823ddcf63b8dcf4cdbb /layouts/partials/article-list-item.html | |
| parent | 77ccbe72fad5a4870185fff374f75471c16a9043 (diff) | |
| download | danixxyz-theme-631547a75142326a7c71bdf123e1475217a5ad73.tar.gz danixxyz-theme-631547a75142326a7c71bdf123e1475217a5ad73.zip | |
chore: replace with extracted danix.xyz-hacker theme (danix2-hugo-theme)
Diffstat (limited to 'layouts/partials/article-list-item.html')
| -rw-r--r-- | layouts/partials/article-list-item.html | 95 |
1 files changed, 95 insertions, 0 deletions
diff --git a/layouts/partials/article-list-item.html b/layouts/partials/article-list-item.html new file mode 100644 index 0000000..44cbf32 --- /dev/null +++ b/layouts/partials/article-list-item.html @@ -0,0 +1,95 @@ +{{/* Handle both calling conventions: dict with .Page/.side or direct page */}} +{{ $page := . }} +{{ $side := "left" }} + +{{ if reflect.IsMap . }} + {{ $page = .Page }} + {{ $side = .side | default "left" }} +{{ end }} + +{{ $articleType := $page.Params.type | default "life" }} +{{ $typeConfig := $page.Site.Params.articleTypes }} +{{ $typeData := index $typeConfig $articleType }} +{{ $excerpt := $page.Description | default $page.Summary }} + +{{ $imageURL := "" }} +{{ $useDefaultThumbnail := false }} +{{ if $page.Params.image }} + {{ $resource := $page.Resources.GetMatch $page.Params.image }} + {{ if $resource }} + {{ $imageURL = $resource.RelPermalink }} + {{ else }} + {{ $imageURL = $page.Params.image }} + {{ end }} +{{ else }} + {{ $useDefaultThumbnail = true }} +{{ end }} + +<li class="timeline-item timeline-item--{{ $side }}" style="--type-color: var(--type-{{ $articleType }});"> + {{/* Decorative connector line */}} + <div class="timeline-connector" aria-hidden="true" + style="background-color: var(--type-{{ $articleType }});"></div> + + {{/* Node on spine */}} + <div class="timeline-node" aria-hidden="true" + style="background-color: var(--type-{{ $articleType }}); box-shadow: 0 0 10px color-mix(in srgb, var(--type-{{ $articleType }}) 50%, transparent);"></div> + + <article class="timeline-card group" + style="border-color: color-mix(in srgb, var(--type-{{ $articleType }}) 25%, transparent); + box-shadow: 0 0 18px color-mix(in srgb, var(--type-{{ $articleType }}) 10%, transparent);"> + + {{/* Thumbnail */}} + <a href="{{ $page.RelPermalink }}" class="timeline-thumb" tabindex="-1" aria-hidden="true"> + {{ if $useDefaultThumbnail }} + <picture> + <source srcset="/images/default_thumbnail_light.png" media="(prefers-color-scheme: light)" /> + <img src="/images/default_thumbnail_dark.png" + alt="" + loading="lazy" /> + </picture> + {{ else }} + <img src="{{ $imageURL }}" + alt="" + loading="lazy" /> + {{ end }} + </a> + + {{/* Text body */}} + <div class="timeline-body"> + + {{/* Pinned badge */}} + {{ if $page.Params.pinned }} + <div class="timeline-pinned" style="color: {{ $page.Site.Params.secondaryAccent }};"> + 📌 {{ i18n "pinned" | default "PINNED" }} + </div> + {{ end }} + + {{/* Type + date meta row */}} + <div class="timeline-meta" style="color: var(--type-{{ $articleType }});"> + {{ i18n $articleType | upper }} + <span class="timeline-meta-sep" aria-hidden="true">·</span> + <time class="timeline-date" + datetime="{{ $page.PublishDate.Format "2006-01-02T15:04:05Z07:00" }}"> + {{ $page.PublishDate.Format "Jan 2, 2006" }} + </time> + </div> + + {{/* Title */}} + <h3 class="timeline-title"> + <a href="{{ $page.RelPermalink }}">{{ $page.Title }}</a> + </h3> + + {{/* Excerpt */}} + {{ if $excerpt }} + <p class="timeline-excerpt">{{ $excerpt | plainify }}</p> + {{ end }} + + {{/* CTA */}} + <a href="{{ $page.RelPermalink }}" class="btn btn-sm mt-auto"> + {{ i18n "readMore" }} + <i data-feather="arrow-right" class="w-4 h-4 ml-2"></i> + </a> + + </div> + </article> +</li> |
