devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Made some of the code a bit more responsive

Browse Source
This commit is contained in:
Tiago Ribeiro
2023-04-18 12:12:26 +01:00
parent 13c8fae588
commit d61592b73e
10 changed files with 52 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/ProfileCard.tsx
View File

@@ -11,17 +11,17 @@ interface Props {
export default function ProfileCard({user, className}: Props) {
return (
<div className={clsx("bg-white drop-shadow-xl p-8 rounded-xl w-full flex flex-col gap-6", className)}>
<div className={clsx("bg-white drop-shadow-xl p-4 md:p-8 rounded-xl w-full flex flex-col gap-6", className)}>
<div className="flex w-full items-center gap-8">
<div className="w-24 rounded-full border-4 border-white drop-shadow-xl">
<div className="w-16 md:w-24 rounded-full border-2 md:border-4 border-white drop-shadow-md md:drop-shadow-xl">
<img src={user.profilePicture} alt="Profile picture" className="rounded-full" />
</div>
<div className="flex flex-col justify-center">
<span className="text-neutral-600 font-bold text-2xl">{user.name}</span>
<span className="text-neutral-600 font-bold text-xl lg:text-2xl">{user.name}</span>
<LevelLabel experience={user.experience} />
</div>
</div>
<LevelProgressBar experience={user.experience} progressBarWidth="w-96" />
<LevelProgressBar experience={user.experience} progressBarWidth="w-32 md:w-96" />
</div>
);
}