40 lines
915 B
TypeScript
40 lines
915 B
TypeScript
import classNames from 'classnames';
|
|
import type { HTMLAttributes } from 'react';
|
|
import { BORDER_COLOR, GRADIENT } from './constants';
|
|
|
|
type TileProps = {
|
|
variant?: 'rainbow' | 'default';
|
|
};
|
|
|
|
export const Tile = ({
|
|
variant = 'default',
|
|
className,
|
|
children,
|
|
}: TileProps & HTMLAttributes<HTMLDivElement>) => {
|
|
return (
|
|
<div
|
|
className={classNames(
|
|
{
|
|
'bg-rainbow p-[0.125rem]': variant === 'rainbow',
|
|
[`border-2 ${BORDER_COLOR} p-0`]: variant === 'default',
|
|
},
|
|
'rounded-lg overflow-hidden relative'
|
|
)}
|
|
>
|
|
<div
|
|
className={classNames(
|
|
{
|
|
'bg-white dark:bg-vega-cdark-900 text-black dark:text-white rounded-[0.35rem] overflow-hidden':
|
|
variant === 'rainbow',
|
|
},
|
|
'p-6',
|
|
GRADIENT,
|
|
className
|
|
)}
|
|
>
|
|
{children}
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|