%PDF- %PDF-
Direktori : /home/emergentqj/actioncivile/pre-auth/.8352c036a19b0051d0217d27d25e3f4a/static/js/components/ |
Current File : /home/emergentqj/actioncivile/pre-auth/.8352c036a19b0051d0217d27d25e3f4a/static/js/components/Footer.js |
import React from "react"; import PropTypes from "prop-types"; import { withTranslation, useTranslation } from "react-i18next"; import { withStyles } from "@material-ui/styles"; import { useSelector } from "react-redux"; import { Typography } from "@material-ui/core"; import appConfig from "config/countryData"; const styles = (theme) => ({ footer: { // height: "100%", width: "100%", backgroundColor: "#353535", }, content: { width: "100%", maxWidth: "1000px", padding: "21px 1rem", margin: "0 auto", display: "flex", alignItems: "center", justifyContent: "space-between", [theme.breakpoints.down("sm")]: { display: "block", }, }, copy: { color: "#fff", fontWeight: 700, [theme.breakpoints.down("sm")]: { marginBottom: 12, }, }, list: { maxWidth: "calc(100% - 140px)", display: "flex", alignItems: "center", padding: 0, margin: 0, listStyle: "none", [theme.breakpoints.down("sm")]: { maxWidth: "100%", width: "100%", flexWrap: "wrap", justifyContent: "center", }, }, listItem: { marginRight: 36, [theme.breakpoints.down("sm")]: { marginRight: 0, width: "50%", padding: 0, margin: "6px 0", }, "& a": { padding: 2, color: "#fff", textDecoration: "none", }, "&:last-of-type": { marginRight: 0, }, }, }); function Footer({ classes, t }) { const [, { language }] = useTranslation(); const countryCode = useSelector((state) => state.config.toJS().config.countryConstant); const termLink = appConfig.countryData?.[countryCode]?.terms?.[language] || ""; const termsBusinessLink = appConfig.countryData?.[countryCode]?.termsBusiness?.[language] || ""; const privacyLink = appConfig.countryData?.[countryCode]?.privacy?.[language] || ""; return ( <footer className={classes.footer}> <div className={classes.content}> <Typography className={classes.copy} variant="body2" component="div"> © 2024 EasyPark </Typography> <ul className={classes.list}> <li className={classes.listItem}> <Typography variant="body2" component="a" href={termLink} rel="noopener noreferrer" target="_blank" > {t("tcs")} </Typography> </li> <li className={classes.listItem}> <Typography variant="body2" component="a" href={termsBusinessLink} rel="noopener noreferrer" target="_blank" > {t("business-tcs")} </Typography> </li> <li className={classes.listItem}> <Typography variant="body2" component="a" href={privacyLink} rel="noopener noreferrer" target="_blank" > {t("privacy-policy")} </Typography> </li> {/* <li className={classes.listItem}> <Typography variant="body2" component="a"> {t("cookies.")} </Typography> </li> */} <li className={classes.listItem}> <Typography variant="body2" component="a" href="https://customer.easypark.net/help/en/4067" rel="noopener noreferrer" target="_blank" > {t("contactUs")} </Typography> </li> </ul> </div> </footer> ); } Footer.propTypes = { classes: PropTypes.object.isRequired, t: PropTypes.func.isRequired, }; export default withTranslation()(withStyles(styles)(Footer));