- Updated UserAvatar component to accept additional className for better customization. - Refined ProfilePage layout with responsive avatar styling. - Enhanced Header component with improved background and text styles. - Improved PopularTags and TopFriends components with better spacing and text shadows. - Updated ThoughtCard and ThoughtThread components for better visual hierarchy and responsiveness. - Enhanced UI components (Button, Badge, Card, DropdownMenu, Input, Popover, Separator, Skeleton, Textarea) with new styles and effects. - Added a new background image for visual enhancement.
27 lines
678 B
TypeScript
27 lines
678 B
TypeScript
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
|
|
import { cn } from "@/lib/utils";
|
|
import { User } from "lucide-react";
|
|
|
|
interface UserAvatarProps {
|
|
src?: string | null;
|
|
alt?: string | null;
|
|
className?: string;
|
|
}
|
|
|
|
export function UserAvatar({ src, alt, className }: UserAvatarProps) {
|
|
return (
|
|
<Avatar className={cn("border-2 border-primary/50 shadow-md", className)}>
|
|
{src && (
|
|
<AvatarImage
|
|
className="object-cover object-center"
|
|
src={src}
|
|
alt={alt ?? "User avatar"}
|
|
/>
|
|
)}
|
|
<AvatarFallback>
|
|
<User className="h-5 w-5" />
|
|
</AvatarFallback>
|
|
</Avatar>
|
|
);
|
|
}
|