Improve display of single album page

lib/music_library_web/components/core_components.ex

@@ -427,12 +427,12 @@ defmodule MusicLibraryWeb.CoreComponents do
 
   def header(assigns) do
     ~H"""
-    <header class={[@actions != [] && "flex items-center justify-between gap-6", @class]}>
+    <header class={[@actions != [] && "flex items-center justify-between gap-6 mb-2", @class]}>
       <div>
         <h1 class="text-lg font-semibold leading-8 text-zinc-800">
           <%= render_slot(@inner_block) %>
         </h1>
-        <p :if={@subtitle != []} class="mt-2 text-sm leading-6 text-zinc-600">
+        <p :if={@subtitle != []} class="mt-2 text-base leading-6 text-zinc-600">
           <%= render_slot(@subtitle) %>
         </p>
       </div>

lib/music_library_web/live/record_live/show.html.heex

@@ -8,6 +8,9 @@
   </:actions>
 </.header>
 
+<div class="columns-2">
+  <img class="w-full" src={~p"/images/#{@record.id}"} alt={@record.title} />
+
   <.list>
     <:item title="Type"><%= @record.type %></:item>
     <:item title="Musicbrainz ID">
@@ -17,10 +20,8 @@
     </:item>
     <:item title="Year"><%= @record.year %></:item>
     <:item title="Genres"><%= Enum.join(@record.genres, ", ") %></:item>
-  <:item title="Image">
-    <img class="max-w-32" src={~p"/images/#{@record.id}"} alt={@record.title} />
-  </:item>
   </.list>
+</div>
 
 <.back navigate={~p"/records"}>Back to records</.back>