Batyka/soundcloak
1
0
Fork 0
mirror of https://git.maid.zone/stuff/soundcloak.git synced 2025-12-10 05:39:38 +05:00
Code Issues Packages Projects Releases Wiki Activity

style: 💄 make playlist match new design + other minor visual tweaks

Browse Source
This commit is contained in:
jonas
2025-02-19 23:59:58 +01:00
parent caa7ab56d6
commit 043b8d12c1
4 changed files with 59 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
static/assets/global.css
View File

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

19
templates/base.templ
View File

@@ -53,16 +53,19 @@ templ MainPage(p cfg.Preferences) {
<input type="submit" value="Search" class="btn important" style="width: 100%; margin-top: .5rem;"/>
</form>
<footer>
<div class="btns" style="margin-top: 2rem; justify-content: center;">
<a class="btn" href="/_/featured">Featured Tracks</a>
<a class="btn" href="/discover">Discover Playlists</a>
<a class="btn" href="/_/preferences">Preferences</a>
<a class="btn" href="https://git.maid.zone/stuff/soundcloak">Source code</a>
<a class="btn" href="/_/static/notice.txt">Legal notice</a>
<div class="btns" style="justify-content: space-between; margin-top: 2rem;">
<div class="btns">
<a class="btn" href="/_/featured">Featured Tracks</a>
<a class="btn" href="/discover">Discover Playlists</a>
</div>
<div class="btns">
<a class="btn" href="https://git.maid.zone/stuff/soundcloak">Source code</a>
<a class="btn" href="/_/static/notice.txt">Legal notice</a>
<a class="btn" href="/_/preferences">Preferences</a>
</div>
</div>
if cfg.Commit != "unknown" {
<p style="text-align: center;">Build <a class="link" href={cfg.CommitURL}>{cfg.Commit}</a></p>
<p style="text-align: center;">Build <a class="link" href={ cfg.CommitURL }>{ cfg.Commit }</a></p>
}
</footer>
}

73
templates/playlist.templ
View File

@@ -38,43 +38,44 @@ templ PlaylistItem(playlist *sc.Playlist, showUsername bool) {
}
templ Playlist(prefs cfg.Preferences, p sc.Playlist) {
if p.Artwork != "" {
<img src={ p.Artwork } width="300px"/>
}
<h1>{ p.Title }</h1>
@UserItem(&p.Author)
<div style="display: flex;">
<a class="btn" href={ templ.SafeURL("https://soundcloud.com" + p.Href()) }>view on soundcloud</a>
</div>
<br/>
@Description(prefs, p.Description, nil)
<p>{ strconv.FormatInt(p.TracksCount(), 10) } tracks</p>
<br/>
<br/>
<div>
for _, track := range p.Tracks {
if *prefs.AutoplayNextTrack {
@TrackItem(&track, true, playlist(track, p))
} else {
@TrackItem(&track, true, "")
<div class="duopanel-container">
<div class="duopanel-l">
if p.Artwork != "" {
<img src={ p.Artwork } width="300px"/>
}
}
</div>
if len(p.MissingTracks) != 0 {
<a class="btn" href={ templ.SafeURL("?pagination=" + url.QueryEscape(p.MissingTracks)) } rel="noreferrer">more tracks</a>
}
<div>
if p.TagList != "" {
<p>Tags: { strings.Join(sc.TagListParser(p.TagList), ", ") }</p>
}
<p>{ strconv.FormatInt(p.Likes, 10) } likes</p>
<br/>
if p.CreatedAt != "" {
<p>Created: { p.CreatedAt }</p>
}
if p.LastModified != "" {
<p>Last modified: { p.LastModified }</p>
}
<h1>{ p.Title }</h1>
@UserItem(&p.Author)
<div style="display: flex;">
<a class="btn" href={ templ.SafeURL("https://soundcloud.com" + p.Href()) }>view on soundcloud</a>
</div>
<br/>
@Description(prefs, p.Description, nil)
if p.TagList != "" {
<p>Tags: { strings.Join(sc.TagListParser(p.TagList), ", ") }</p>
}
<p title="Likes">♥ { strconv.FormatInt(p.Likes, 10) }</p>
if p.CreatedAt != "" {
<p>Created: { p.CreatedAt }</p>
}
if p.LastModified != "" {
<p>Last modified: { p.LastModified }</p>
}
</div>
<div class="duopanel-r">
<p>{ strconv.FormatInt(p.TracksCount(), 10) } tracks</p>
<div>
for _, track := range p.Tracks {
if *prefs.AutoplayNextTrack {
@TrackItem(&track, true, playlist(track, p))
} else {
@TrackItem(&track, true, "")
}
}
</div>
if len(p.MissingTracks) != 0 {
<a class="btn" href={ templ.SafeURL("?pagination=" + url.QueryEscape(p.MissingTracks)) } rel="noreferrer">more tracks</a>
}
</div>
</div>
}

10
templates/track.templ
View File

@@ -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 {
<div style="margin-top: 2rem">
<p>⚠ Only a 30-second snippet is available.</p>
</div>
}
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
}
</noscript>
}
if track.Policy == sc.PolicySnip {
<div>
<p>Only a 30-second snippet is available.</p>
</div>
}
if *prefs.ShowAudio {
<div>
if audioPref == cfg.AudioBest {