setto/setto-nostr-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

make playlist more better

Browse source
This commit is contained in:
sakrecoer 2026-09-16 15:54:32 +02:00
parent 67f08a3670
commit fdb107f099
9 changed files with 672 additions and 851 deletions
Download patch file Download diff file Expand all files Collapse all files

95
themes/one-pager/layouts/playlists/list.html
View file

@ -1,107 +1,42 @@
{{ define "header" }}
{{ $displayName := "" }}
{{ $name := "" }}
{{ $picture := "" }}
{{ $banner := "" }}
{{ $about := "" }}
{{ $website := "" }}
{{ $nip05 := "" }}
{{ $lud16 := "" }}
{{ range hugo.Data.profile }}
{{ range . }}
{{ range .tags }}
{{ if eq (index . 0) "display_name" }}
{{ $displayName = index . 1 }}
{{ else if eq (index . 0) "name" }}
{{ $name = index . 1 }}
{{ else if eq (index . 0) "picture" }}
{{ $picture = index . 1 }}
{{ else if eq (index . 0) "banner" }}
{{ $banner = index . 1 }}
{{ else if eq (index . 0) "about" }}
{{ $about = index . 1 }}
{{ else if eq (index . 0) "website" }}
{{ $website = index . 1 }}
{{ else if eq (index . 0) "nip05" }}
{{ $nip05 = index . 1 }}
{{ else if eq (index . 0) "lud16" }}
{{ $lud16 = index . 1 }}
{{ end }}
{{ end }}
{{ end }}
{{ end }}
<!-- If display_name is empty, use name -->
{{ if not $displayName }}
{{ $displayName = $name }}
{{ end }}
<!-- Main Header -->
<header class="playlist-header" style="min-height: unset;max-height:25vh;">
<!-- Background image -->
{{ if $banner }}
<div id="bannerino" style="background-image:url('{{ $banner }}');"></div>
<!-- Dark overlay for readability -->
<div id="texture"></div>
{{ end }}
<!-- Decorative '>' -->
<div></div>
<div class="header-content">
<div class="header-profile">
{{ if $picture }}
<a href="/" alt="home page"><img src="{{ $picture }}" alt="{{ $displayName }}'s profile picture'" class="profile-picture" loading="lazy"></a>
{{ end }}
</div>
</div>
</header>
{{ partial "nav-strip.html" . }}
{{ end }}
{{ define "main" }}
<section class="section playlists-list">
<h1>{{ .Title }}</h1>
{{ if .Content }}
<div class="section-description">{{ .Content }}</div>
{{ else }}
<p class="section-description">Explore all my curated playlists from the Nostr network</p>
{{ end }}
<h2>Playlists</h2>
<p class="section-description">Explore all my curated playlists from the Nostr network</p>
{{ if .Pages }}
<div class="playlists-grid">
{{ range .Pages }}
{{ $name := .Title }}
{{ $description := .Params.playlist_description | default "" }}
{{ $image := .Params.playlist_image | default "" }}
{{ $tracks := .Params.playlist_tracks | default slice }}
<div class="playlist-card">
<a href="{{ .RelPermalink }}" class="playlist-link">
{{ if $image }}
<img src="{{ $image }}" alt="{{ $name }}" class="playlist-image" loading="lazy">
{{ end }}
<div class="playlist-info">
<h2>{{ $name }}</h2>
{{ if $description }}
<p class="playlist-description">{{ $description }}</p>
{{ end }}
{{ if $tracks }}
<span class="playlist-track-count">{{ len $tracks }} tracks</span>
{{ end }}
{{ if $description }}<p class="playlist-description">{{ $description }}</p>{{ end }}
{{ if $tracks }}<span class="playlist-track-count">{{ len $tracks }} tracks</span>{{ end }}
</div>
<div class="playlist-hover-overlay">
<span class="playlist-view-btn">▶ Listen</span>
<span class="playlist-view-btn">▶ View Playlist</span>
</div>
</a>
</div>
{{ end }}
</div>
{{ else }}
<p class="no-tracks">No playlists found. Run <code>./fetch-playlist.sh</code> and <code>./generate-playlist-pages.sh</code>.</p>
{{ end }}
</section>
{{ end }}
{{ end }}