add release credits update UI

Signed-off-by: ari melody <ari@arimelody.me>
This commit is contained in:
ari melody 2024-08-23 23:08:28 +01:00
parent 7914fba52a
commit 34cddcfdb2
27 changed files with 630 additions and 340 deletions

View file

@ -2,7 +2,7 @@
<header>
<nav>
<div id="header-home" hx-get="/" hx-on="click" hx-target="body" hx-swap="outerHTML show:window:top" preload="mouseover" hx-push-url="true">
<div id="header-home">
<img src="/img/favicon.png" id="header-icon" width="100" height="100" alt="">
<div id="header-text">
<h1>ari melody</h1>
@ -16,7 +16,7 @@
<rect y="40" width="70" height="10" rx="5" fill="#eee" />
</svg>
</a>
<ul id="header-links" hx-boost="true" hx-target="body" hx-swap="outerHTML show:window:top">
<ul id="header-links">
<li>
<a href="/" preload="mouseover">home</a>
</li>

View file

@ -20,7 +20,7 @@
{{define "content"}}
<main>
<h1>
<h1 class="typeout">
# hello, world!
</h1>
@ -58,7 +58,7 @@
<hr>
<h2>
<h2 class="typeout">
## metadata
</h2>
@ -133,7 +133,7 @@
<hr>
<h2>
<h2 class="typeout">
## cool people
</h2>

View file

@ -9,11 +9,7 @@
{{block "head" .}}{{end}}
<!-- <meta name="htmx-config" content='{"htmx.config.scrollIntoViewOnBoost":false}'> -->
<!-- <script type="application/javascript" src="/script/lib/htmx.js"></script> -->
<!-- <script type="application/javascript" src="/script/lib/htmx.min.js"></script> -->
<!-- <script type="application/javascript" src="/script/lib/htmx-preload.js"></script> -->
<!-- <script type="application/javascript" src="/script/swap.js"></script> -->
<script type="module", src="/script/main.js"></script>
</head>
<body>

View file

@ -34,7 +34,7 @@
<div id="background" style="background-image: url({{.GetArtwork}})"></div>
<a href="/music" swap-url="/music" id="go-back" title="back to arimelody.me">&lt;</a>
<a href="/music" id="go-back" title="back to arimelody.me">&lt;</a>
<br><br>
<div id="music-container">
@ -61,6 +61,7 @@
<p id="type" class="{{.ReleaseType}}">{{.ReleaseType}}</p>
{{else}}
<p id="type" class="upcoming">upcoming</p>
<p>Releases: {{.PrintReleaseDate}}</p>
{{end}}
<ul id="links">
@ -118,6 +119,13 @@
{{range $i, $track := .Tracks}}
<details>
<summary class="album-track-title">{{$track.Number}}. {{$track.Title}}</summary>
{{if $track.Description}}
<p class="album-track-subheading">DESCRIPTION</p>
{{$track.Description}}
{{end}}
<p class="album-track-subheading">LYRICS</p>
{{if $track.Lyrics}}
{{$track.Lyrics}}
{{else}}

View file

@ -20,13 +20,13 @@
<main>
<script type="module" src="/script/music.js"></script>
<h1>
<h1 class="typeout">
# my music
</h1>
<div id="music-container">
{{range $Release := .}}
<div class="music" id="{{$Release.ID}}" swap-url="/music/{{$Release.ID}}">
<div class="music" id="{{$Release.ID}}">
<div class="music-artwork">
<img src="{{$Release.GetArtwork}}" alt="{{$Release.Title}} artwork" width="128" loading="lazy">
</div>
@ -50,7 +50,7 @@
{{end}}
</div>
<h2 id="usage" class="question">
<h2 id="usage" class="question typeout">
<a href="#usage">
&gt; "can i use your music in my content?"
</a>