{{define "album"}}{{template "header" .}}
<div class="d-flex gap-3 mb-4">
  <img class="vs-card-art" style="width:180px;" src="{{if .Data.Album.CoverArtID}}/cover-art/{{.Data.Album.CoverArtID}}?size=400{{else}}/static/img/default-art.svg{{end}}" alt="">
  <div>
    <h2 class="h4 mb-1">{{.Data.Album.Title}}</h2>
    <div class="text-secondary mb-2">{{.Data.Album.ArtistName}}{{if .Data.Album.Year}} · {{.Data.Album.Year}}{{end}}</div>
    <button type="button" class="btn vs-star-btn {{if .Data.Starred}}active{{end}}" data-star-toggle data-item-type="album" data-item-id="{{.Data.Album.ID}}">
      {{if .Data.Starred}}<i class="bi bi-star-fill"></i>{{else}}<i class="bi bi-star"></i>{{end}} Favorite
    </button>
    <form method="post" action="/albums/{{.Data.Album.ID}}/share" class="d-inline">
      {{template "csrf_field" .CSRFToken}}
      <button type="submit" class="btn btn-sm btn-outline-secondary"><i class="bi bi-share"></i> Share</button>
    </form>
    {{if and .User .User.IsAdmin}}
    <a class="btn btn-sm btn-outline-secondary" href="/admin/albums/{{.Data.Album.ID}}/edit"><i class="bi bi-pencil"></i> Edit album</a>
    {{end}}
  </div>
</div>
{{template "song_rows" .Data.Songs}}
{{template "footer" .}}{{end}}