franpcode/spooky-spotify-showcase
1
0
Fork 0
mirror of https://github.com/FranP-code/spooky-spotify-showcase.git synced 2025-10-13 00:02:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Changed user title

Browse Source
This commit is contained in:
Francisco Pessano
2024-10-17 22:29:50 -03:00
parent bedd1419d5
commit 4ff27e46b7
1 changed files with 12 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/app/_components/user-showcase.tsx
View File

@@ -7,22 +7,26 @@ export default function UserShowcase({
spookify, spookify,
images, images,
}: { }: {
display_name: string; display_name?: string;
spookify: boolean; spookify: boolean;
images: { url: string }[]; images?: { url: string }[];
}) { }) {
const imageSource = images && images[0]; const imageSource = images && images[0];
return ( return (
<div className="flex"> <div className="flex w-full gap-2 rounded-xl bg-white bg-opacity-5 px-8 py-16 backdrop-blur-lg backdrop-filter">
<img <img
className="h-16 w-16 rounded-full" className="h-32 w-32 rounded-full"
src={imageSource?.url || "https://via.placeholder.com/150"} src={imageSource?.url || "https://via.placeholder.com/150"}
alt={display_name} alt={display_name}
/> />
<div className="ml-2 flex flex-col justify-center"> <div className="font-climateCrisis flex flex-col justify-center">
<TypographyH2 className="font-bold"> <TypographyH1 className="text-3xl font-bold tracking-wide text-lime-600 lg:text-4xl">
{display_name} {spookify && "Spooky"} Showcase {display_name}
</TypographyH2> </TypographyH1>
<TypographyH1 className="text-3xl font-bold tracking-wide lg:text-4xl">
{spookify && <span className="text-fuchsia-700">Spooky</span>}{" "}
Showcase
</TypographyH1>
</div> </div>
</div> </div>
); );