Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x | import { Box, Divider, styled } from "@mui/material";
import { useTranslation } from "i18n";
import { PRESS } from "i18n/namespaces";
import useIsScreenSizeOrSmaller from "utils/useIsScreenSizeOrSmaller";
import SocialMediaLinks from "../../components/SocialMediaLinks";
import { useListVolunteers } from "../communities/hooks";
import TeamSection from "../team/TeamSection";
import About from "./About";
import Facts from "./Facts";
import Hero from "./Hero";
import MediaAssets from "./MediaAssets";
import PressCoverage from "./PressCoverage";
import SectionHeading from "./SectionHeading";
import SectionWrapper from "./SectionWrapper";
const StyledContainer = styled(Box)(({ theme }) => ({
display: "flex",
flexDirection: "column",
gap: "2.5rem",
[theme.breakpoints.up("md")]: {
gap: "3rem",
},
}));
const StyledSocialMediaContainer = styled("div")(({ theme }) => ({
display: "grid",
gridTemplateColumns: "repeat(6, 2.5rem)",
gap: "1rem",
paddingBottom: "1rem",
[theme.breakpoints.up("md")]: {
gap: "2.5rem",
},
}));
export default function Press() {
const { t } = useTranslation([PRESS]);
const volunteers = useListVolunteers();
const isMobile = useIsScreenSizeOrSmaller("mobile");
return (
<StyledContainer>
<Hero />
<Facts />
<Divider />
<About />
<MediaAssets />
<SectionWrapper>
<SectionHeading>{t("team.subheading")}</SectionHeading>
<TeamSection
variant="current"
volunteers={volunteers.data?.currentVolunteersList}
boardMembersOnly
hasExtraCard
extraCardContent={{
text: t("team.extra_card_text"),
link: t("team.extra_card_link"),
}}
/>
</SectionWrapper>
<SectionWrapper sx={{ alignItems: "center" }}>
<SectionHeading>{t("social_media_subheading")}</SectionHeading>
<StyledSocialMediaContainer>
<SocialMediaLinks iconSize={isMobile ? "2rem" : "2.5rem"} />
</StyledSocialMediaContainer>
</SectionWrapper>
<Divider />
<PressCoverage />
</StyledContainer>
);
}
|