Files
catherine-league/nextjs/src/components/ContactList.tsx

40 lines
922 B
TypeScript

'use client';
import { useTranslation } from 'react-i18next';
import type { IContactQuestion } from '@/models/IContactQuestion';
import style from '@/styles/web.module.scss';
type Props = {
items: IContactQuestion[];
};
export function ContactList({ items }: Props) {
const { t } = useTranslation();
return (
<div className={style.guideBody}>
<h2>{t('qanda')}</h2>
<hr />
<div className={style.contactBox}>
<a href="https://forms.gle/Dn4p7cFEPLK1zcTz5" rel="noopener noreferrer" target="_blank">
&nbsp;
</a>
</div>
{items.map((el) => (
<div
key={`contactItemsLoop-${el.id}`}
className={style.characterBlock}
style={{
animationDelay: `${el.id * 0.2}s`,
}}
>
<h4>{el.question}</h4>
<hr />
<div>{el.answer}</div>
</div>
))}
</div>
);
}