add artists/tracks pages; more components; css cleanup

admin/templates/html/artists.html

@@ -1,24 +1,21 @@
 {{define "head"}}
 <title>Artists - ari melody 💫</title>
 <link rel="shortcut icon" href="/img/favicon.png" type="image/x-icon">
-<link rel="stylesheet" href="/admin/static/index.css">
+<link rel="stylesheet" href="/admin/static/admin.css">
+<link rel="stylesheet" href="/admin/static/artists.css">
 {{end}}
 
 {{define "content"}}
 <main>
-    <h1>Artists</h1>
-
-    <div class="card-header">
-        <h2><a href="/admin/artists/">Artists</a></h2>
+    <header>
+        <h1><a href="/admin/artists/">Artists</a></h2>
         <a class="button new" id="create-artist">Create New</a>
-    </div>
+    </header>
+
     {{if .Artists}}
     <div class="artists-group">
-        {{range $Artist := .Artists}}
-        <div class="artist">
-            <img src="{{$Artist.GetAvatar}}" alt="" width="64" loading="lazy" class="artist-avatar">
-            <a href="/admin/artists/{{$Artist.ID}}" class="artist-name">{{$Artist.Name}}</a>
-        </div>       
+        {{range .Artists}}
+        {{block "artist" .}}{{end}}
         {{end}}
     </div>
     {{else}}
@@ -27,4 +24,5 @@
 </main>
 
 <script type="module" src="/admin/static/admin.js"></script>
+<script type="module" src="/admin/static/artists.js"></script>
 {{end}}