VPS 4 Deploy Agent
27 lines
987 B
TypeScript
27 lines
987 B
TypeScript
import React from 'react';
|
|
|
|
type CardVariant = 'glass' | 'elevated' | 'interactive' | 'gradient';
|
|
|
|
interface CardProps {
|
|
variant?: CardVariant;
|
|
shimmer?: boolean;
|
|
padding?: string;
|
|
className?: string;
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
const variantClasses: Record<CardVariant, string> = {
|
|
glass: 'bg-white/[0.02] border border-white/5 backdrop-blur-xl rounded-2xl',
|
|
elevated: 'bg-white/[0.04] border border-white/[0.08] shadow-premium backdrop-blur-xl rounded-2xl',
|
|
interactive: 'bg-white/[0.02] border border-white/5 backdrop-blur-xl rounded-2xl hover:border-white/10 hover:bg-white/[0.03] hover:shadow-glow-sm transition-all duration-300 group',
|
|
gradient: 'rounded-3xl overflow-hidden relative',
|
|
};
|
|
|
|
export default function Card({ variant = 'glass', shimmer, padding = 'p-6', className = '', children }: CardProps) {
|
|
return (
|
|
<div className={`${variantClasses[variant]} ${padding} ${shimmer ? 'shimmer-line' : ''} ${className}`}>
|
|
{children}
|
|
</div>
|
|
);
|
|
}
|