diff --git a/data/lyrics.go b/data/lyrics.go index 5ba8636..a2f3c8d 100644 --- a/data/lyrics.go +++ b/data/lyrics.go @@ -10,14 +10,17 @@ import ( ) type Song struct { - Artist string - Title string - Image string - Lyrics string - Credits map[string]string - About [2]string - Album string - LinkToAlbum string + Artist string + Title string + Image string + Lyrics string + Credits map[string]string + About [2]string + Album struct { + URL string + Name string + Image string + } } type songResponse struct { @@ -30,8 +33,9 @@ type songResponse struct { Plain string } Album struct { - Url string `json:"url"` - Name string `json:"name"` + URL string `json:"url"` + Name string `json:"name"` + Image string `json:"cover_art_url"` } CustomPerformances []customPerformance `json:"custom_performances"` } @@ -83,8 +87,9 @@ func (s *Song) parseSongData(doc *goquery.Document) { s.About[0] = songData.Description.Plain s.About[1] = truncateText(songData.Description.Plain) s.Credits = make(map[string]string) - s.Album = songData.Album.Name - s.LinkToAlbum = strings.Replace(songData.Album.Url, "https://genius.com", "", -1) + s.Album.Name = songData.Album.Name + s.Album.URL = strings.Replace(songData.Album.URL, "https://genius.com", "", -1) + s.Album.Image = ExtractImageURL(songData.Album.Image) for _, perf := range songData.CustomPerformances { var artists []string diff --git a/static/style.css b/static/style.css index 530484d..8a9961d 100644 --- a/static/style.css +++ b/static/style.css @@ -53,7 +53,6 @@ body { #lyrics a { color: inherit; - cursor: initial; } #lyrics a, .annotation { @@ -84,7 +83,7 @@ a { #metadata { display: flex; flex-direction: column; - gap: 0.5rem; + gap: 2rem; flex-basis: 0; } @@ -99,17 +98,25 @@ a { font-weight: 500; } +#metadata-info { + display: flex; + flex-direction: column; + gap: 0.5rem; +} + #album-artwork { - width: 20rem; + width: 24rem; border-radius: 3px; box-shadow: 0 1px 1px #ddd; - max-width: 200px; } #container { - display: flex; - padding: 5rem 10rem; - gap: 5rem; + display: grid; + padding: 5rem 0; + grid-template-columns: 24rem 1fr 24rem; + max-width: 1024px; + margin: auto; + gap: 4rem; } #credits { @@ -129,6 +136,12 @@ a { color: #1e1e1e; } +#lyrics-album-container { + display: flex; + flex-direction: column; + gap: 0.5rem; +} + #album-tracklist{ display: flex; flex-direction: column; @@ -214,6 +227,7 @@ a { @media screen and (max-width: 900px) { #container { padding: 3rem 2rem; + display: flex; flex-direction: column; gap: 3rem; } diff --git a/views/lyrics.templ b/views/lyrics.templ index 73806e0..3a96454 100644 --- a/views/lyrics.templ +++ b/views/lyrics.templ @@ -9,10 +9,11 @@ templ LyricsPage(s data.Song) { @layout(fmt.Sprintf("%s - %s lyrics", s.Artist, s.Title)) {