52 lines
1.8 KiB
TypeScript
52 lines
1.8 KiB
TypeScript
import Image from "next/image";
|
|
import Card from "../ui/Card/Card"
|
|
import Typography from "../ui/Typography/Typography"
|
|
import styles from "./MeditationCard.module.scss"
|
|
import Icon, { IconName } from "../ui/Icon/Icon";
|
|
import MetaLabel from "../ui/MetaLabel/MetaLabel";
|
|
import Button from "../ui/Button/Button";
|
|
|
|
export default function MeditationCard() {
|
|
return (
|
|
<Card className={styles.card}>
|
|
<Image
|
|
className={styles.logo}
|
|
src="/meditation-card.png"
|
|
alt="Meditation image"
|
|
width={342}
|
|
height={216}
|
|
/>
|
|
<div className={styles.content}>
|
|
<div className={styles.info}>
|
|
<Typography size="lg" weight="regular">
|
|
Reset
|
|
</Typography>
|
|
<MetaLabel iconLabelProps={{
|
|
iconProps: {
|
|
name: IconName.Video,
|
|
color: "#6B7280",
|
|
size: {
|
|
width: 24,
|
|
height: 25
|
|
}
|
|
},
|
|
children: <Typography color="secondary">Therapy</Typography>
|
|
}}>
|
|
15 min
|
|
</MetaLabel>
|
|
</div>
|
|
<Button className={styles.button}>
|
|
<Icon
|
|
className={styles.icon}
|
|
name={IconName.Chevron}
|
|
size={{
|
|
width: 18,
|
|
height: 18
|
|
}}
|
|
color="#A0A7B5"
|
|
/>
|
|
</Button>
|
|
</div>
|
|
</Card>
|
|
)
|
|
} |