From 907f480bc1c8481b91b2cd120676f6ea7d8a2be6 Mon Sep 17 00:00:00 2001
From: Claudio Ortolina <cloud8421@gmail.com>
Date: Tue, 3 Dec 2024 19:37:37 +0000
Subject: [PATCH] Improve formatting of bio read more link and license block

Prefer inline Tailwind classes for consistency with rest of the codebase
---
 assets/css/app.css                                   | 12 ------------
 lib/music_library_web/live/artist_live/show.ex       |  4 ++--
 .../live/artist_live/show.html.heex                  |  2 +-
 3 files changed, 3 insertions(+), 15 deletions(-)

diff --git a/assets/css/app.css b/assets/css/app.css
index 5a92a188..378c8f90 100644
--- a/assets/css/app.css
+++ b/assets/css/app.css
@@ -3,15 +3,3 @@
 @import "tailwindcss/utilities";
 
 /* This file is for your main application CSS */
-
-/* The bio html comes directly from the Last.fm api,
-* so there's no way to inject Tailwind classes in the <a> elements.
-* To work around that, we set a class to the bio container snd style its children.
-*/
-.bio a {
-  @apply font-semibold text-zinc-700 hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200;
-}
-
-.bio .license {
-  @apply italic block;
-}
diff --git a/lib/music_library_web/live/artist_live/show.ex b/lib/music_library_web/live/artist_live/show.ex
index 315b5194..62390f97 100644
--- a/lib/music_library_web/live/artist_live/show.ex
+++ b/lib/music_library_web/live/artist_live/show.ex
@@ -62,8 +62,8 @@ defmodule MusicLibraryWeb.ArtistLive.Show do
           Enum.join(
             [
               text,
-              link,
-              ~s(<span class="license">#{license}</span>)
+              ~s(<p class="mt-4 font-semibold text-zinc-700 hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200">#{link}</p>),
+              ~s(<p class="mt-4 italic block">#{license}</p>)
             ],
             ""
           )
diff --git a/lib/music_library_web/live/artist_live/show.html.heex b/lib/music_library_web/live/artist_live/show.html.heex
index 792e1830..a2029dc7 100644
--- a/lib/music_library_web/live/artist_live/show.html.heex
+++ b/lib/music_library_web/live/artist_live/show.html.heex
@@ -19,7 +19,7 @@
   </h1>
   <details
     :if={artist_info = @artist_info.ok? && @artist_info.result}
-    class="bio mt-4 text-sm leading-5 text-zinc-500 dark:text-zinc-400"
+    class="mt-4 text-sm leading-5 text-zinc-500 dark:text-zinc-400"
   >
     <summary class="text-sm mb-4">{gettext("Biography")}</summary>
     {render_bio(artist_info.bio)}