31 lines
794 B
TypeScript
31 lines
794 B
TypeScript
|
import clsx from 'clsx'
|
||
|
import { InformationCircleIcon } from '@heroicons/react/solid'
|
||
|
|
||
|
import { Linkify } from './linkify'
|
||
|
|
||
|
export function InfoBox(props: {
|
||
|
title: string
|
||
|
text: string
|
||
|
className?: string
|
||
|
}) {
|
||
|
const { title, text, className } = props
|
||
|
return (
|
||
|
<div className={clsx('rounded-md bg-gray-50 p-4', className)}>
|
||
|
<div className="flex">
|
||
|
<div className="flex-shrink-0">
|
||
|
<InformationCircleIcon
|
||
|
className="h-5 w-5 text-gray-400"
|
||
|
aria-hidden="true"
|
||
|
/>
|
||
|
</div>
|
||
|
<div className="ml-3">
|
||
|
<h3 className="text-sm font-medium text-black">{title}</h3>
|
||
|
<div className="mt-2 text-sm text-black">
|
||
|
<Linkify text={text} />
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
)
|
||
|
}
|