feat(footer): add feedback button in footer

src/layout/footer.tsx

@@ -1,9 +1,8 @@
-import { Container, Grid, Link, Theme } from "@material-ui/core";
-import BookIcon from "@material-ui/icons/Book";
+import { Button, Container, Grid, Link, Theme } from "@material-ui/core";
 import GitHubIcon from "@material-ui/icons/GitHub";
-import MailIcon from "@material-ui/icons/Mail";
 import TwitterIcon from "@material-ui/icons/Twitter";
 import YouTubeIcon from "@material-ui/icons/YouTube";
+import RecordVoiceOverIcon from "@material-ui/icons/RecordVoiceOver";
 import { makeStyles } from "@material-ui/styles";
 import { Link as GatsbyLink } from "gatsby";
 import React, { FC } from "react";
@@ -14,6 +13,9 @@ const useStyles = makeStyles((theme: Theme) => ({
     marginTop: "auto",
     padding: theme.spacing(3, 2),
   },
+  feedback: {
+    padding: theme.spacing(2),
+  },
 }));
 
 const Footer: FC = () => {
@@ -24,16 +26,16 @@ const Footer: FC = () => {
         <Grid container spacing={2} justify="center">
           <Grid item>
             <Link
-              href="https://www.fabrique.social.gouv.fr/"
+              href="https://github.com/SocialGouv/archifiltre/wiki/Wiki-Archifiltre"
               target="_blank"
               rel="noopener"
-              color="inherit"
+              color="primary"
             >
-              Fabrique des ministères sociaux
+              Documentation
             </Link>
           </Grid>
           <Grid item>
-            <Link component={GatsbyLink} to="/mentions-legales" color="inherit">
+            <Link component={GatsbyLink} to="/mentions-legales" color="primary">
               Mentions légales
             </Link>
           </Grid>
@@ -42,33 +44,42 @@ const Footer: FC = () => {
               href="mailto:archifiltre@sg.social.gouv.fr"
               target="_blank"
               rel="noopener"
-              color="inherit"
+              color="primary"
             >
               Nous contacter
             </Link>
           </Grid>
         </Grid>
-        <Grid container spacing={2} justify="center">
+        <Grid
+          container
+          justify="center"
+          alignItems="center"
+          spacing={1}
+          className={classes.feedback}
+        >
           <Grid item>
-            <Link
-              href="https://twitter.com/archifiltre"
+            <Button
+              color="primary"
+              startIcon={<RecordVoiceOverIcon />}
+              href="https://bit.ly/315pAd8"
               target="_blank"
               rel="noopener"
-              color="inherit"
-              aria-label="Twitter"
+              variant="contained"
             >
-              <TwitterIcon />
-            </Link>
+              Donnez votre avis
+            </Button>
           </Grid>
+        </Grid>
+        <Grid container spacing={2} justify="center">
           <Grid item>
             <Link
-              href="https://github.com/SocialGouv/archifiltre/wiki/Wiki-Archifiltre"
+              href="https://twitter.com/archifiltre"
               target="_blank"
               rel="noopener"
               color="inherit"
-              aria-label="Wiki archifiltre"
+              aria-label="Twitter"
             >
-              <BookIcon />
+              <TwitterIcon />
             </Link>
           </Grid>
           <Grid item>
@@ -93,21 +104,20 @@ const Footer: FC = () => {
               <GitHubIcon />
             </Link>
           </Grid>
+        </Grid>
+        <Grid container spacing={2} justify="center">
           <Grid item>
+            © {new Date().getFullYear()} Archifiltre -{" "}
             <Link
-              href="mailto:archifiltre@sg.social.gouv.fr"
-              rel="noopener"
+              href="https://www.fabrique.social.gouv.fr/"
               target="_blank"
-              color="inherit"
-              aria-label="Nous contacter"
+              rel="noopener"
+              color="primary"
             >
-              <MailIcon />
+              Fabrique des ministères sociaux
             </Link>
           </Grid>
         </Grid>
-        <Grid container spacing={2} justify="center">
-          <Grid item>© {new Date().getFullYear()} Archifiltre</Grid>
-        </Grid>
       </Container>
     </footer>
   );