frontend/src/components/Footer/Footer.js

import React from "react";
import { Box, Typography, Link } from "@mui/material";

const Footer = () => {
  return (
    <Box
      component="footer"
      sx={{
        width: "70%",
        margin: "0 auto",
        py: 4,
        textAlign: "center",
        opacity: 0.7,
      }}
    >
      {/* <Typography
        variant="body2"
        color="text.secondary"
        sx={{ maxWidth: "800px", mx: "auto", mt: 2 }}
      >
        Currently, this is an <b>extremely minimal demo</b>. <br />
        To <b>unlock the full capabilities</b>, please visit our{" "}
        <Link
          href="https://github.com/huggingface/yourbench"
          target="_blank"
          rel="noopener noreferrer"
          color="inherit"
        >
          <b>GitHub</b>
        </Link>
        !
      </Typography> */}
      <Typography variant="body2" color="text.secondary" sx={{ mx: 4 }}>
        We keep <b>processed documents</b> for <b>research purposes</b>, to
        which you agree by using the space. For a <b>fully private usage</b>,
        please duplicate the{" "}
        <Link
          href="https://huggingface.co/spaces/yourbench/advanced"
          target="_blank"
          rel="noopener noreferrer"
          color="inherit"
        >
          <b>advanced demo space</b>
        </Link>
        .
      </Typography>
    </Box>
  );
};

export default Footer;