25 lines
731 B
TypeScript
25 lines
731 B
TypeScript
import type { CSSProperties, ComponentPropsWithRef } from 'react';
|
|
import { cn } from 'helpers/cn';
|
|
|
|
export const cardStyle = (overrides?: CSSProperties): CSSProperties => ({
|
|
backgroundColor: 'var(--card-bg)',
|
|
backgroundImage: `
|
|
linear-gradient(to right, var(--card-grid-color) 1px, transparent 1px),
|
|
linear-gradient(to bottom, var(--card-grid-color) 1px, transparent 1px)
|
|
`,
|
|
backgroundSize: '20px 20px',
|
|
...overrides,
|
|
});
|
|
|
|
type CardProps = ComponentPropsWithRef<'div'>;
|
|
|
|
export const Card = ({ className, style, ...props }: CardProps) => {
|
|
return (
|
|
<div
|
|
className={cn('rounded-xl border-2 border-duck-dark/30 shadow-lg p-5', className)}
|
|
style={cardStyle(style)}
|
|
{...props}
|
|
/>
|
|
);
|
|
};
|