src/pages/community/eventCard.tsx (32 lines of code) (raw):
import React from 'react';
import BrowserOnly from '@docusaurus/BrowserOnly';
type CardEvent = {
link: string;
img: string;
title: string;
content: string;
dateStr: string;
};
type Props = {
event: CardEvent;
};
const EventCard = (props: Props) => {
const { event } = props;
return (
<BrowserOnly>
{() => (
<div className='event-card'>
<a href={event.link}>
<img src={event.img} />
</a>
<div className='event-introduction'>
<h4>{event.title}</h4>
<p>{event.content}</p>
<a href={event.link}>
{event.dateStr}
<img className='arrow' src={`/img/system/arrow_right.png`} />
</a>
</div>
</div>
)}
</BrowserOnly>
);
};
export default EventCard;