increase metadata size of library header

src/renderer/features/albums/components/album-detail-header.tsx

@@ -120,7 +120,6 @@ export const AlbumDetailHeader = forwardRef(
                                     $link
                                     component={Link}
                                     fw={600}
-                                    size="md"
                                     to={generatePath(AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, {
                                         albumArtistId: artist.id,
                                     })}

src/renderer/features/shared/components/library-header.module.scss

@@ -79,10 +79,6 @@
     @container (min-width: 1200px) {
         grid-template-columns: 250px minmax(0, 1fr);
 
-        h1 {
-            height: 150px;
-        }
-
         .image {
             width: 250px !important;
             height: 250px;
@@ -93,12 +89,6 @@
             height: 250px;
         }
     }
-
-    @container (min-width: 1500px) {
-        h1 {
-            height: 150px;
-        }
-    }
 }
 
 .image-section {
@@ -113,6 +103,7 @@
 
 .metadata-section {
     z-index: 15;
+    font-size: 1.15rem;
     display: flex;
     flex-direction: column;
     grid-area: info;
@@ -150,6 +141,7 @@
     color: var(--main-fg);
     font-size: 2rem;
     line-height: 1.2;
+    line-clamp: 2;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
 }

src/renderer/features/shared/components/library-header.tsx

@@ -72,15 +72,17 @@ export const LibraryHeader = forwardRef(
                 </div>
                 <div className={styles.metadataSection}>
                     <Group>
-                        <Text
+                        <h2>
-                            $link
+                            <Text
-                            component={Link}
+                                $link
-                            to={item.route}
+                                component={Link}
-                            tt="uppercase"
+                                to={item.route}
-                            weight={600}
+                                tt="uppercase"
-                        >
+                                weight={600}
-                            {itemTypeString()}
+                            >
-                        </Text>
+                                {itemTypeString()}
+                            </Text>
+                        </h2>
                     </Group>
                     <h1 className={styles.title}>
                         <AutoTextSize mode="box">{title}</AutoTextSize>