diff --git a/lib/music_library_web/components/data_components.ex b/lib/music_library_web/components/data_components.ex
index b332d746..6950826a 100644
--- a/lib/music_library_web/components/data_components.ex
+++ b/lib/music_library_web/components/data_components.ex
@@ -24,18 +24,18 @@ defmodule MusicLibraryWeb.DataComponents do
           {@title}
         </p>
       </dt>
-      <dd class="ml-24 flex items-baseline pb-6 sm:pb-7">
+      <dd class="ml-24 flex items-baseline pb-4 sm:pb-6">
         <p class="font-semibold">
+          <span class="text-sm md:text-base lg:text-2xl block text-zinc-900 dark:text-zinc-300">
+            {@record.title}
+          </span>
           <.link
             :for={artist <- @record.artists}
-            class="text-sm md:text-base lg:text-2xl text-zinc-900 hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200"
+            class="text-sm md:text-base text-zinc-600 dark:text-zinc-200 hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200"
             navigate={~p"/artists/#{artist.musicbrainz_id}"}
           >
             {artist.name}
           </.link>
-          <span class="text-sm md:text-base block text-zinc-600 dark:text-zinc-200">
-            {@record.title}
-          </span>
         </p>
       </dd>
     </div>