diff --git a/apps/web/src/components/SongCover/SongCover.tsx b/apps/web/src/components/SongCover/SongCover.tsx
index 5c435e01..2c00ced1 100644
--- a/apps/web/src/components/SongCover/SongCover.tsx
+++ b/apps/web/src/components/SongCover/SongCover.tsx
@@ -7,24 +7,19 @@ const Cover = styled.img<{ size?: number }>`
width: 240px;
margin-bottom: 10px;
${(props) =>
- props.size &&
- css`
+ props.size &&
+ css`
height: ${props.size}px;
width: ${props.size}px;
`}
`;
const SongTitle = styled.div`
- color: #fff;
- font-size: 18px;
- text-decoration-color: rgb(255, 255, 255);
+ font-size: 16px;
text-decoration-line: none;
- text-decoration-style: solid;
- text-decoration-thickness: auto;
text-size-adjust: 100%;
- font-weight: 600;
+ font-weight: 400;
font-family: RockfordSansRegular;
- text-shadow: rgba(0, 0, 0, 1) 0px 0px 12px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@@ -49,34 +44,30 @@ const Artist = styled.div`
max-width: 210px;
`;
-const Metadata = styled.div`
- position: absolute;
- bottom: 15px;
- padding: 15px;
-`;
-
const CoverWrapper = styled.div`
position: relative;
`;
export type SongCoverProps = {
- cover: string;
- title?: string;
- artist?: string;
- size?: number;
+ cover: string;
+ title?: string;
+ artist?: string;
+ size?: number;
};
function SongCover(props: SongCoverProps) {
- const { title, artist, cover, size } = props;
- return (
-
-
-
- {title}
- {artist}
-
-
- );
+ const { title, artist, cover, size } = props;
+ return (
+
+
+
+
+ {title}
+
+
{artist}
+
+
+ );
}
export default SongCover;
diff --git a/apps/web/src/pages/home/feed/Feed.tsx b/apps/web/src/pages/home/feed/Feed.tsx
index e1dc10a1..49d81bde 100644
--- a/apps/web/src/pages/home/feed/Feed.tsx
+++ b/apps/web/src/pages/home/feed/Feed.tsx
@@ -83,6 +83,7 @@ function Feed() {
did: song.uri?.split("at://")[1]?.split("/")[0] || "",
rkey: song.uri?.split("/").pop() || "",
}}
+ className="no-underline text-[var(--color-text-primary)]"
>