You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
41 lines
981 B
41 lines
981 B
// Copyright (c) Tailscale Inc & contributors
|
|
// SPDX-License-Identifier: BSD-3-Clause
|
|
|
|
import cx from "classnames"
|
|
import React from "react"
|
|
|
|
export default function ProfilePic({
|
|
url,
|
|
size = "large",
|
|
className,
|
|
}: {
|
|
url?: string
|
|
size?: "small" | "medium" | "large"
|
|
className?: string
|
|
}) {
|
|
return (
|
|
<div
|
|
className={cx(
|
|
"relative flex-shrink-0 rounded-full overflow-hidden",
|
|
{
|
|
"w-5 h-5": size === "small",
|
|
"w-[26px] h-[26px]": size === "medium",
|
|
"w-8 h-8": size === "large",
|
|
},
|
|
className
|
|
)}
|
|
>
|
|
{url ? (
|
|
<div
|
|
className="w-full h-full flex pointer-events-none rounded-full bg-gray-200"
|
|
style={{
|
|
backgroundImage: `url(${url})`,
|
|
backgroundSize: "cover",
|
|
}}
|
|
/>
|
|
) : (
|
|
<div className="w-full h-full flex pointer-events-none rounded-full border border-gray-400 border-dashed" />
|
|
)}
|
|
</div>
|
|
)
|
|
}
|
|
|