feat(frontend): add flags to user page

This commit is contained in:
sam 2024-09-29 20:24:47 +02:00
parent f539902711
commit dc18ab60d2
Signed by: sam
GPG key ID: B4EF20DDE721CAA1
10 changed files with 68 additions and 5 deletions

View file

@ -0,0 +1,28 @@
import type { PrideFlag } from "~/lib/api/user";
import { OverlayTrigger, Tooltip } from "react-bootstrap";
export default function ProfileFlag({ flag }: { flag: PrideFlag }) {
return (
<span className="mx-2 my-1">
<OverlayTrigger
key={flag.id}
placement="top"
overlay={
<Tooltip id={flag.id} aria-hidden={true}>
{flag.description ?? flag.name}
</Tooltip>
}
>
<span>
<img
className="pride-flag"
src={flag.image_url}
alt={flag.description ?? flag.name}
style={{ pointerEvents: "none" }}
/>
</span>
</OverlayTrigger>{" "}
{flag.name}
</span>
);
}