import React, { Component } from 'react'
import PropTypes from 'prop-types' //ES6
import styles from './styles.module.css'
import List from '@mui/material/List'
import ListItem from '@mui/material/ListItem';
import ListItemText from '@mui/material/ListItemText';
import TypoGraphy from '@mui/material/Typography'
import Link from 'next/link'
import { makeStyles } from '@mui/material/styles';

const useStyles = makeStyles((theme) => ({
    root: {
      width: '75%',
      maxWidth: 260,
     /* backgroundColor: theme.palette.background.paper, */
     float : 'right',
     marginRight:'2%',
     fontSize : '.80em'


    },
  }));

export default function FooterLinks()  {
    
        const classes = useStyles();
        return (
          (<div className={classes.root}>
            <TypoGraphy variant="subtitle1" color="inherit"            >
  <List component="nav" >
   
      <ListItemText inset >
        <TypoGraphy color="inherit" variant="subtitle2">
          <Link href="/info/faq" className={styles.navLinks}>FAQ</Link>
        </TypoGraphy>
      </ListItemText>

        <ListItemText inset >
          <TypoGraphy color="inherit" variant="subtitle2">
            <Link href="/info/tos" className={styles.navLinks}>Terms Of Service</Link>
          </TypoGraphy>
        </ListItemText>

        <ListItemText inset>
          <TypoGraphy color="inherit" variant="subtitle2">
            <Link href="/info/contactus" className={styles.navLinks}>Contact Us</Link>
          </TypoGraphy>
        </ListItemText>

        <ListItemText inset>
          <TypoGraphy color="inherit" variant="subtitle2">
            <Link href="/info/privacypolicy" className={styles.navLinks}>Privacy Policy</Link>
          </TypoGraphy>
        </ListItemText>

        <ListItemText inset>
          <TypoGraphy color="inherit" variant="subtitle2">
            <Link href="/info/pip" className={styles.navLinks}>Personal Information Policy</Link>
          </TypoGraphy>
        </ListItemText>

      <ListItemText inset>
          <TypoGraphy color="inherit" variant="subtitle2">
            <Link href="/info/disclosure" className={styles.navLinks}>Disclosure</Link>
          </TypoGraphy>
      </ListItemText>

      
    </List>
  </TypoGraphy>
          </div>)
        );
    }