import React from 'react'
import { GatsbyImage, getImage } from 'gatsby-plugin-image';

const Review = ({title, text, date, img}) => {
    return (
        <div className='bg-[#F7F7FF] rounded-[20px] py-6 px-10 h-full flex flex-col'>
            <div className="flex items-center mb-8">
                <GatsbyImage loading='lazy' className='h-16 w-16 rounded-full object-cover mr-4' image={getImage(img)} alt="logo" placeholder="blurred"/>
                <p className='text-black text-xl font-medium'>{title}</p>
            </div>
            <p className='text-slate-600 text-base font-normal leading-normal mb-2 flex-grow'>{text}</p>
            <time className='text-right text-slate-400 text-sm font-normal' dateTime={new Date(date).toISOString()}>{date}</time>
        </div>
    )
}

export default Review;