curiousroamers/src/client/Footer.tsx

47 lines
813 B
TypeScript

import React from 'react';
interface Link {
to: string;
text: string;
}
interface Card {
title: string;
description: any;
links: Array<Link>;
}
interface FooterProps {
elements: Array<Card>;
}
/**
* @return {jsx} The root component
*/
export default function Footer(
{elements}: FooterProps) {
return (
<React.Fragment>
<div className='container
py-5 d-flex flex-wrap justify-content-between'>
{elements.map((elem, index) =>
<div
key={index}
className='align-top'>
<h3 className='font-weight-bold'>
{elem.title}
</h3>
<p>{elem.description}</p>
{elem.links.map((link, i) =>
<div key={i}>
<a href={link.to}>
{link.text}
</a>
<br/>
</div>)}
</div>)}
</div>
</React.Fragment>
);
}