mirror of
https://github.com/Sendouc/sendou.ink.git
synced 2026-05-09 04:02:40 -05:00
27 lines
662 B
TypeScript
27 lines
662 B
TypeScript
import clsx from "clsx";
|
|
import { MyCSSProperties } from "~/utils";
|
|
|
|
export function Avatar({
|
|
user,
|
|
tiny = false,
|
|
}: {
|
|
user: { discordId: string; discordAvatar: string | null };
|
|
tiny?: boolean;
|
|
}) {
|
|
const style: MyCSSProperties = {
|
|
"--_avatar-size": tiny ? "2rem" : undefined,
|
|
};
|
|
return (
|
|
<div style={style} className={clsx("avatar__placeholder", { tiny })}>
|
|
{user.discordAvatar && (
|
|
<img
|
|
alt=""
|
|
className={clsx("avatar__img", { tiny })}
|
|
loading="lazy"
|
|
src={`https://cdn.discordapp.com/avatars/${user.discordId}/${user.discordAvatar}.png?size=80`}
|
|
/>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|