Merge branch 'feature/COMP-190_slimline_footer' into 'develop'

update the footer to the latest insights

See merge request !30

webapp/src/components/global/GeantFooter.tsx

@@ -6,20 +6,25 @@ import EULogo from "../../images/eu_logo.png";
 
 
 function GeantFooter(): ReactElement {
-    return <footer className="page-footer mt-5 pt-5">
+    return <footer className="page-footer mt-5 pt-3">
         <Container>
             <Row>
                 <Col>
                     <a href="https://geant.org">
-                        <img src={GeantLogo} className="m-3" style={{maxWidth: "150px"}}/>
+                        <img src={GeantLogo} className="m-3" style={{maxWidth: "100px"}}/>
                     </a>
-                    <img className="m-3" src={EULogo} />
+                    <img src={EULogo} className="m-3" style={{maxWidth: "200px"}}/>
                 </Col>
-                <Col>
-                    <p className="m-3 text-end">
-                        The contents of this site are the sole responsibility
-                        of GÉANT and can under no circumstances be regarded
-                        as reflecting the views of the European Union</p>
+                <Col className="mt-4 text-end">
+                    <span>
+                        <a className="mx-3 footer-link" href="https://geant.org/Policies/">Cookies</a>
+                        <wbr/>|
+                        <a className="mx-3 footer-link" href="https://geant.org/Disclaimer/">Disclaimer</a>
+                        <wbr/>|
+                        <a className="mx-3 footer-link" href="https://geant.org/geant-anti-slavery-policy/">GEANT&nbsp;Anti&#8209;Slavery&nbsp;Policy</a>
+                        <wbr/>|
+                        <a className="mx-3 footer-link" href="https://geant.org/Privacy-Notice/">Privacy&nbsp;Policy</a>
+                    </span>
                 </Col>
             </Row>
         </Container>

webapp/src/scss/layout/_components.scss

@@ -99,9 +99,19 @@
 }
 
 .page-footer {
-  min-height: 180px;
+  min-height: 100px;
   background-color: #3b536b;
-  color: #f5f5f5;
+  color: white;
+}
+
+.footer-link {
+  color: white;
+  text-decoration: none;
+}
+
+.footer-link:hover {
+  color: white;
+  text-decoration: underline;
 }
 
 .filter-dropdown-item {