38 lines
747 B
TypeScript
38 lines
747 B
TypeScript
import React, { FC } from 'react';
|
|
import { Card, Avatar, Text } from '@chakra-ui/react';
|
|
|
|
type ReviewCardProps = {
|
|
firstname: string;
|
|
lastname: string;
|
|
picture: string;
|
|
text: string;
|
|
};
|
|
|
|
export const ReviewCard: FC<ReviewCardProps> = ({
|
|
firstname,
|
|
lastname,
|
|
picture,
|
|
text,
|
|
}) => {
|
|
const name = [firstname, lastname].join(' ');
|
|
|
|
return (
|
|
<Card p={4} gap={2} alignItems='center' variant='elevated'>
|
|
<Avatar
|
|
name={name}
|
|
src={picture}
|
|
size='xl'
|
|
boxShadow='2px 2px 0 1px var(--chakra-colors-secondary-500)'
|
|
/>
|
|
<Text
|
|
as='q'
|
|
fontSize='sm'
|
|
textAlign='center'
|
|
__css={{ textWrap: 'balance' }}
|
|
>
|
|
{text}
|
|
</Text>
|
|
</Card>
|
|
);
|
|
};
|