From 043b8d12c1c7123eaeccd5942928133fbf379aca Mon Sep 17 00:00:00 2001 From: jonas Date: Wed, 19 Feb 2025 23:59:58 +0100 Subject: [PATCH] style: :lipstick: make playlist match new design + other minor visual tweaks --- static/assets/global.css | 7 +++- templates/base.templ | 19 ++++++----- templates/playlist.templ | 73 ++++++++++++++++++++-------------------- templates/track.templ | 10 +++--- 4 files changed, 59 insertions(+), 50 deletions(-) diff --git a/static/assets/global.css b/static/assets/global.css index 413b93a..a85f573 100644 --- a/static/assets/global.css +++ b/static/assets/global.css @@ -26,9 +26,14 @@ body { color: var(--accent); } +.duopanel-container { + display: grid; + grid-template-columns: 1fr; + gap: 1rem; +} + @media (width > 800px) { .duopanel-container { - display: grid; grid-template-columns: min-content 1fr; gap: 3rem; } diff --git a/templates/base.templ b/templates/base.templ index 4dd8528..60f6014 100644 --- a/templates/base.templ +++ b/templates/base.templ @@ -53,16 +53,19 @@ templ MainPage(p cfg.Preferences) { } diff --git a/templates/playlist.templ b/templates/playlist.templ index 846b4dd..049bd11 100644 --- a/templates/playlist.templ +++ b/templates/playlist.templ @@ -38,43 +38,44 @@ templ PlaylistItem(playlist *sc.Playlist, showUsername bool) { } templ Playlist(prefs cfg.Preferences, p sc.Playlist) { - if p.Artwork != "" { - - } -

{ p.Title }

- @UserItem(&p.Author) -
- view on soundcloud -
-
- @Description(prefs, p.Description, nil) -

{ strconv.FormatInt(p.TracksCount(), 10) } tracks

-
-
-
- for _, track := range p.Tracks { - if *prefs.AutoplayNextTrack { - @TrackItem(&track, true, playlist(track, p)) - } else { - @TrackItem(&track, true, "") +
+
+ if p.Artwork != "" { + } - } -
- if len(p.MissingTracks) != 0 { - more tracks - } -
- if p.TagList != "" { -

Tags: { strings.Join(sc.TagListParser(p.TagList), ", ") }

- } -

{ strconv.FormatInt(p.Likes, 10) } likes

-
- if p.CreatedAt != "" { -

Created: { p.CreatedAt }

- } - if p.LastModified != "" { -

Last modified: { p.LastModified }

- } +

{ p.Title }

+ @UserItem(&p.Author) +
+ view on soundcloud +
+
+ @Description(prefs, p.Description, nil) + if p.TagList != "" { +

Tags: { strings.Join(sc.TagListParser(p.TagList), ", ") }

+ } +

♥ { strconv.FormatInt(p.Likes, 10) }

+ if p.CreatedAt != "" { +

Created: { p.CreatedAt }

+ } + if p.LastModified != "" { +

Last modified: { p.LastModified }

+ } +
+
+

{ strconv.FormatInt(p.TracksCount(), 10) } tracks

+
+ for _, track := range p.Tracks { + if *prefs.AutoplayNextTrack { + @TrackItem(&track, true, playlist(track, p)) + } else { + @TrackItem(&track, true, "") + } + } +
+ if len(p.MissingTracks) != 0 { + more tracks + } +
} diff --git a/templates/track.templ b/templates/track.templ index 7659355..0103672 100644 --- a/templates/track.templ +++ b/templates/track.templ @@ -70,6 +70,11 @@ templ TrackPlayer(prefs cfg.Preferences, track sc.Track, stream string, displayE if *prefs.Player == cfg.NonePlayer { {{ return }} } + if track.Policy == sc.PolicySnip { +
+

⚠ Only a 30-second snippet is available.

+
+ } if displayErr == "" { {{ var audioPref string }} if cfg.Restream && *prefs.Player == cfg.RestreamPlayer { @@ -101,11 +106,6 @@ templ TrackPlayer(prefs cfg.Preferences, track sc.Track, stream string, displayE } } - if track.Policy == sc.PolicySnip { -
-

Only a 30-second snippet is available.

-
- } if *prefs.ShowAudio {
if audioPref == cfg.AudioBest {