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,
images,
}: {
display_name: string;
display_name?: string;
spookify: boolean;
images: { url: string }[];
images?: { url: string }[];
}) {
const imageSource = images && images[0];
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
className="h-16 w-16 rounded-full"
className="h-32 w-32 rounded-full"
src={imageSource?.url || "https://via.placeholder.com/150"}
alt={display_name}
/>
<div className="ml-2 flex flex-col justify-center">
<TypographyH2 className="font-bold">
{display_name} {spookify && "Spooky"} Showcase
</TypographyH2>
<div className="font-climateCrisis flex flex-col justify-center">
<TypographyH1 className="text-3xl font-bold tracking-wide text-lime-600 lg:text-4xl">
{display_name}
</TypographyH1>
<TypographyH1 className="text-3xl font-bold tracking-wide lg:text-4xl">
{spookify && <span className="text-fuchsia-700">Spooky</span>}{" "}
Showcase
</TypographyH1>
</div>
</div>
);