26 lines
787 B
TypeScript
26 lines
787 B
TypeScript
|
import React from 'react'
|
||
|
|
|
||
|
|
|
||
|
|
export interface HoverCardsProps {
|
||
|
|
image: string,
|
||
|
|
description: string,
|
||
|
|
link?: string,
|
||
|
|
}
|
||
|
|
|
||
|
|
export default function HoverCards({image, description, link}: HoverCardsProps) {
|
||
|
|
return (
|
||
|
|
<div className='flex flex-col overflow-hidden rounded-sm bg-white shadow-sm hover:transform hover:scale-105 transition-transform duration-300 ease-in-out'>
|
||
|
|
<img src={image} alt={description} className='w-[191px] h-[150px] rounded-sm object-cover min-h-[140px]'/>
|
||
|
|
<div className='flex flex-col gap-1 p-2'>
|
||
|
|
<p className='text-sm font-medium truncate'>{description}</p>
|
||
|
|
</div>
|
||
|
|
{
|
||
|
|
link && (
|
||
|
|
<a href={link} className='text-xs text-gray-500'>{link}</a>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|