redesign album detail page

src/shared/components/pill/pill.module.css

@@ -3,6 +3,7 @@
     user-select: auto;
     background: alpha(var(--theme-colors-background), 0.5);
     border: 1px solid var(--theme-colors-border);
+    transition: background-color 0.2s ease-in-out;
 
     &[data-variant='outline'] {
         background: transparent;
@@ -10,6 +11,10 @@
     }
 }
 
+.root.link:hover {
+    background: alpha(var(--theme-colors-surface), 0.5);
+}
+
 .label {
     font-family: var(--theme-content-font-family);
 }

src/shared/components/pill/pill.tsx

@@ -80,7 +80,7 @@ export const PillLink = forwardRef<HTMLDivElement, PillLinkProps>(({ children, .
                     [styles.xs]: size === 'xs',
                 }),
                 remove: styles.remove,
-                root: styles.root,
+                root: clsx(styles.root, styles.link),
                 ...classNames,
             }}
             component={Link}