Add avatar asset

src/components/GlassCard.tsx

@@ -0,0 +1,38 @@
+import { useRef, useState, useCallback, ReactNode } from 'react';
+import { cn } from '@/lib/utils';
+
+interface GlassCardProps {
+  children: ReactNode;
+  className?: string;
+  interactive?: boolean;
+}
+
+export const GlassCard = ({ children, className, interactive = true }: GlassCardProps) => {
+  const cardRef = useRef<HTMLDivElement>(null);
+  const [glowPos, setGlowPos] = useState({ x: 0, y: 0 });
+  const [isHovered, setIsHovered] = useState(false);
+
+  const handleMouseMove = useCallback((e: React.MouseEvent) => {
+    if (!cardRef.current || !interactive) return;
+    const rect = cardRef.current.getBoundingClientRect();
+    setGlowPos({ x: e.clientX - rect.left, y: e.clientY - rect.top });
+  }, [interactive]);
+
+  return (
+    <div
+      ref={cardRef}
+      className={cn('glass-card glass-card-hover rounded-2xl relative', className)}
+      onMouseMove={handleMouseMove}
+      onMouseEnter={() => setIsHovered(true)}
+      onMouseLeave={() => setIsHovered(false)}
+    >
+      {interactive && isHovered && (
+        <div
+          className="mouse-glow"
+          style={{ left: glowPos.x, top: glowPos.y, opacity: 1 }}
+        />
+      )}
+      <div className="relative z-10">{children}</div>
+    </div>
+  );
+};