import { GetServerSideProps, GetServerSidePropsContext } from "next"; import { useTranslate } from "react-polyglot"; import Head from "next/head"; import Image from "next/legacy/image"; import Link from "next/link"; import { Grid, Container, Box, Button } from "@mui/material"; import { Layout } from "components/Layout"; import { useAppContext } from "components/AppProvider"; import { PageHeader } from "components/PageHeader"; import { AboutFeature } from "components/AboutFeature"; import { AboutBox } from "components/AboutBox"; import AbstractDiagram from "images/abstract-diagram.png"; import AboutHeader from "images/about-header.png"; import Globe from "images/globe.png"; import Controls from "images/controls.png"; import CommunityBackground from "images/community-background.png"; import Bicycle from "images/bicycle.png"; const About = () => { const t = useTranslate(); const { colors: { white, leafcutterElectricBlue, cdrLinkOrange }, typography: { h1, h4, p }, } = useAppContext(); return ( Digital Threat Dashboard – Leafcutter {t("aboutLeafcutterTitle")} {t("aboutLeafcutterDescription")} {t("whereDataComesFromTitle")} {t("whereDataComesFromDescription") .split("\n") .map((line: string, i: number) => ( {line} ))} {t("projectSupportTitle")} {t("projectSupportDescription") .split("\n") .map((line: string, i: number) => ( {line} ))} {t("interestedInLeafcutterTitle")} {t("interestedInLeafcutterDescription") .split("\n") .map((line: string, i: number) => ( {line} ))} ); }; export default About;