59 lines
1.6 KiB
TypeScript
59 lines
1.6 KiB
TypeScript
import DownloadModelTitle from '../DownloadModelTitle'
|
|
|
|
type Props = {
|
|
author: string
|
|
description: string
|
|
isRecommend: boolean
|
|
name: string
|
|
type: string
|
|
required?: string
|
|
}
|
|
|
|
const DownloadModelContent: React.FC<Props> = ({
|
|
author,
|
|
description,
|
|
isRecommend,
|
|
name,
|
|
required,
|
|
type,
|
|
}) => {
|
|
return (
|
|
<div className="flex w-4/5 flex-col gap-2.5">
|
|
<div className="flex items-center gap-1">
|
|
<h2 className="text-xl font-medium leading-[25px] tracking-[-0.4px] text-gray-900">
|
|
{name}
|
|
</h2>
|
|
<DownloadModelTitle title={type} />
|
|
<div className="rounded-md bg-purple-100 px-2.5 py-0.5 text-center">
|
|
<span className="text-xs font-semibold leading-[18px] text-purple-800">
|
|
{author}
|
|
</span>
|
|
</div>
|
|
{required && (
|
|
<div className="rounded-md bg-purple-100 px-2.5 py-0.5 text-center">
|
|
<span className="text-xs leading-[18px] text-[#11192899]">
|
|
Required{' '}
|
|
</span>
|
|
<span className="text-xs font-semibold leading-[18px] text-gray-900">
|
|
{required}
|
|
</span>
|
|
</div>
|
|
)}
|
|
</div>
|
|
<p className="text-xs leading-[18px] text-gray-500">{description}</p>
|
|
<div
|
|
className={`${
|
|
isRecommend ? 'flex' : 'hidden'
|
|
} w-fit items-center justify-center gap-2 rounded-full bg-green-50 px-2.5 py-0.5`}
|
|
>
|
|
<div className="h-3 w-3 rounded-full bg-green-400"></div>
|
|
<span className="leading-18px text-xs font-medium text-green-600">
|
|
Recommend
|
|
</span>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default DownloadModelContent
|