33 lines
986 B
TypeScript
33 lines
986 B
TypeScript
import React from 'react';
|
|
|
|
import { Card } from '@/components/ui/card';
|
|
import { cn } from '@/lib/utils';
|
|
|
|
export const frostedCardClass = cn(
|
|
'border border-slate-200 bg-white text-slate-900 shadow-lg shadow-rose-100/30 backdrop-blur',
|
|
'dark:border-slate-800/70 dark:bg-slate-950/85 dark:text-slate-100'
|
|
);
|
|
|
|
type FrostedCardProps = React.ComponentProps<typeof Card>;
|
|
|
|
export function FrostedCard({ className, ...props }: FrostedCardProps) {
|
|
return <Card className={cn(frostedCardClass, className)} {...props} />;
|
|
}
|
|
|
|
type FrostedSurfaceProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
asChild?: boolean;
|
|
};
|
|
|
|
export function FrostedSurface({ className, ...props }: FrostedSurfaceProps) {
|
|
return (
|
|
<div
|
|
className={cn(
|
|
'rounded-2xl border border-slate-200 bg-white text-slate-900 shadow-lg shadow-rose-100/30 backdrop-blur',
|
|
'dark:border-slate-800/70 dark:bg-slate-950/80 dark:text-slate-100',
|
|
className
|
|
)}
|
|
{...props}
|
|
/>
|
|
);
|
|
}
|