- Added image quality settings and device sizes in next.config.ts for better image optimization. - Updated package dependencies, including cheerio and baseline-browser-mapping. - Improved global styles for blog content images to ensure responsiveness. - Refactored button components for consistent sizing and styling across the application. - Enhanced blog post card layout with new variants and improved author name formatting. - Adjusted hero section and content layout for better visual appeal and user experience.
50 lines
1.0 KiB
TypeScript
50 lines
1.0 KiB
TypeScript
import { Icon } from "@iconify/react";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface LogoItemProps {
|
|
icon: string;
|
|
alt: string;
|
|
size?: "sm" | "md" | "lg";
|
|
className?: string;
|
|
iconClassName?: string;
|
|
}
|
|
|
|
const iconSizeMap = {
|
|
sm: "size-6",
|
|
md: "size-7",
|
|
lg: "size-8",
|
|
};
|
|
|
|
const tileSizeMap = {
|
|
sm: "size-12",
|
|
md: "size-14",
|
|
lg: "size-16",
|
|
};
|
|
|
|
export function LogoItem({
|
|
icon,
|
|
alt,
|
|
size = "md",
|
|
className,
|
|
iconClassName,
|
|
}: LogoItemProps) {
|
|
return (
|
|
<div className={cn("flex items-center justify-center", className)}>
|
|
<div
|
|
className={cn(
|
|
"flex items-center justify-center rounded-2xl border border-border/50 bg-white shadow-sm transition-all duration-300",
|
|
"hover:-translate-y-1 hover:shadow-md",
|
|
"dark:border-white/10 dark:bg-white/95 dark:shadow-lg dark:shadow-black/25",
|
|
tileSizeMap[size]
|
|
)}
|
|
>
|
|
<Icon
|
|
icon={icon}
|
|
className={cn("shrink-0", iconSizeMap[size], iconClassName)}
|
|
aria-label={alt}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|