mirror of
https://github.com/yangshun/tech-interview-handbook.git
synced 2025-07-29 21:23:14 +08:00
[resumes][feat] improve badge UI
This commit is contained in:
@ -14,18 +14,20 @@ export default function ResumeUserBadge({
|
|||||||
return (
|
return (
|
||||||
<div className="group relative flex items-center justify-center">
|
<div className="group relative flex items-center justify-center">
|
||||||
<div
|
<div
|
||||||
className="absolute left-6 z-10 hidden w-48 flex-col
|
className="h-34 absolute left-6 z-10 hidden w-48 flex-col justify-center
|
||||||
justify-center gap-1 rounded-xl bg-white px-2 py-2 text-center drop-shadow-lg
|
gap-1 rounded-xl bg-white pb-2 text-center drop-shadow-lg
|
||||||
|
|
||||||
before:absolute before:top-12 before:-translate-x-6
|
before:absolute before:top-14 before:-translate-x-4
|
||||||
before:border-8 before:border-y-transparent before:border-l-transparent
|
before:border-8 before:border-y-transparent before:border-l-transparent
|
||||||
before:border-r-white before:drop-shadow-lg before:content-['']
|
before:border-r-white before:drop-shadow-lg before:content-['']
|
||||||
group-hover:flex">
|
group-hover:flex">
|
||||||
<Icon className="h-12 w-12 self-center" />
|
<Icon className="h-16 w-full self-center rounded-t-xl bg-slate-200 py-2" />
|
||||||
|
<div className="px-2">
|
||||||
<p className="font-medium">{title}</p>
|
<p className="font-medium">{title}</p>
|
||||||
<p className="text-sm">{description}.</p>
|
<p className="text-sm">{description}.</p>
|
||||||
</div>
|
</div>
|
||||||
<Icon className="h-4 w-4" />
|
</div>
|
||||||
|
<Icon className="h-5 w-5 rounded-xl border bg-slate-200 shadow-sm" />
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user