broken but cool htmx! also improved templating

Signed-off-by: ari melody <ari@arimelody.me>
This commit is contained in:
ari melody 2024-03-22 07:30:22 +00:00
parent 5c59348362
commit c1ff03c4e5
18 changed files with 297 additions and 97 deletions

View file

@ -12,9 +12,7 @@
<meta property="og:description" content="music from your local SPACEGIRL 💫">
<link rel="stylesheet" href="/style/music.css">
<script type="module" src="/script/main.js" defer></script>
<script type="application/javascript" src="/script/music.js" defer></script>
<script type="module" src="/script/music.js" defer></script>
{{end}}
{{define "content"}}
@ -25,11 +23,11 @@
<div id="music-container">
{{range $Album := .}}
<div class="music" id="{{$Album.Id}}">
<div class="music" id="{{$Album.Id}}" hx-get="/music/{{$Album.Id}}" hx-trigger="click" hx-target="main" hx-swap="outerHTML" hx-push-url="true">
<div class="music-artwork">
<img src="{{$Album.ResolveArtwork}}" alt="{{$Album.Title}} artwork" width="128">
</div>
<div class="music-details">
<div class="music-details" hx-boost="true" hx-target="main" hx-swap="outerHTML">
<a href="/music/{{$Album.Id}}"><h1 class="music-title">{{$Album.Title}}</h1></a>
<h2 class="music-artist">{{$Album.PrintPrimaryArtists}}</h2>
<h3 class="music-type-{{.ResolveType}}">{{$Album.ResolveType}}</h3>
@ -45,12 +43,12 @@
{{end}}
</div>
<h2 id="usage" class="question">
<h2 id="usage" class="question" hx-get="/music#usage" hx-on="click" hx-swap="none" hx-push-url="true">
<a href="#usage">
&gt; "can i use your music in my content?"
</a>
</h2>
<div class="collapse">
<div class="answer">
<p>
<strong class="big">yes!</strong> well, in most cases...
</p>
@ -85,5 +83,7 @@
&gt; <a href="mailto:ari@arimelody.me">ari@arimelody.me</a>
</p>
</div>
<a href="#" id="backtotop">back to top</a>
</main>
{{end}}