My personal website
1import { Heading } from '@/components/Heading/Heading';
2import { Paragraph } from '@/components/Paragraph/Paragraph';
3import { cn } from '@/lib/utils';
4import React from 'react';
5import { eventStyles } from './Event.styles';
6import { EventProps } from './Event.types';
7
8export const Event: React.FC<EventProps> = ({
9 eventType,
10 eventTitle,
11 eventDescription,
12 eventStartYear,
13 eventEndYear,
14 eventAffiliation,
15 className = '',
16}) => (
17 <div className={cn(eventStyles.wrapper, className)}>
18 <div className="flex items-center justify-between">
19 <Paragraph size="sm">{eventAffiliation}</Paragraph>
20 <Paragraph size="sm">
21 {eventStartYear} – {eventEndYear}
22 </Paragraph>
23 </div>
24 <div className="flex flex-col gap-2">
25 <Heading level={3} size="md">
26 {eventTitle}
27 </Heading>
28 <Paragraph size="md">{eventDescription}</Paragraph>
29 </div>
30 <Paragraph size="sm">{eventType}</Paragraph>
31 </div>
32);