From 638cf348dc4a73668a1f708fbbd3fdae7911cdb7 Mon Sep 17 00:00:00 2001
From: daniele-mng <daniele.mangiagli@greenbone.net>
Date: Mon, 9 Sep 2024 09:55:48 +0200
Subject: [PATCH] fix: footer at bottom of the page (#4153)

---
 .../__tests__/__snapshots__/footer.jsx.snap   | 39 -------------------
 .../components/structure/__tests__/footer.jsx |  1 -
 src/web/components/structure/footer.jsx       |  9 +----
 src/web/pages/page.jsx                        | 22 +++++++----
 4 files changed, 15 insertions(+), 56 deletions(-)
 delete mode 100644 src/web/components/structure/__tests__/__snapshots__/footer.jsx.snap

diff --git a/src/web/components/structure/__tests__/__snapshots__/footer.jsx.snap b/src/web/components/structure/__tests__/__snapshots__/footer.jsx.snap
deleted file mode 100644
index 635b9b28f7..0000000000
--- a/src/web/components/structure/__tests__/__snapshots__/footer.jsx.snap
+++ /dev/null
@@ -1,39 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`Footer tests > should render footer with copyright 1`] = `
-.c1 {
-  color: #7F7F7F;
-}
-
-.c1:link {
-  color: #7F7F7F;
-}
-
-.c0 {
-  position: fixed;
-  bottom: 0;
-  right: 0;
-  left: 0;
-  padding: 2px;
-  font-size: 10px;
-  text-align: right;
-  color: #7F7F7F;
-  margin-top: 10px;
-  padding-right: 5px;
-  z-index: 500;
-}
-
-<footer
-  class="c0"
->
-  Copyright © 2009-2024 by Greenbone AG, 
-  <a
-    class="c1"
-    href="http://www.greenbone.net"
-    rel="noopener noreferrer"
-    target="_blank"
-  >
-    www.greenbone.net
-  </a>
-</footer>
-`;
diff --git a/src/web/components/structure/__tests__/footer.jsx b/src/web/components/structure/__tests__/footer.jsx
index 069fbb8eb5..fde4058b24 100644
--- a/src/web/components/structure/__tests__/footer.jsx
+++ b/src/web/components/structure/__tests__/footer.jsx
@@ -16,7 +16,6 @@ describe('Footer tests', () => {
     const currentYear = date().year();
     const {element} = render(<Footer />);
 
-    expect(element).toMatchSnapshot();
     expect(element).toHaveTextContent(
       'Copyright © 2009-' +
         currentYear +
diff --git a/src/web/components/structure/footer.jsx b/src/web/components/structure/footer.jsx
index 6794f34704..64bd1aa158 100644
--- a/src/web/components/structure/footer.jsx
+++ b/src/web/components/structure/footer.jsx
@@ -3,7 +3,6 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
-
 import React from 'react';
 
 import styled from 'styled-components';
@@ -18,17 +17,11 @@ const Link = styled.a`
 `;
 
 const Footer = styled.footer`
-  position: fixed;
-  bottom: 0;
-  right: 0;
-  left: 0;
   padding: 2px;
   font-size: 10px;
-  text-align: right;
+  text-align: center;
   color: ${Theme.mediumGray};
   margin-top: 10px;
-  padding-right: 5px;
-  z-index: ${Theme.Layers.aboveAll};
 `;
 
 const GreenboneFooter = () => {
diff --git a/src/web/pages/page.jsx b/src/web/pages/page.jsx
index 6871c7bf9a..529c224a76 100644
--- a/src/web/pages/page.jsx
+++ b/src/web/pages/page.jsx
@@ -32,6 +32,10 @@ const StyledLayout = styled(Layout)`
   height: calc(-48px + 100vh);
 `;
 
+const Container = styled.div`
+  flex: 1;
+`;
+
 const Page = ({children}) => {
   const capabilities = useLoadCapabilities();
   const location = useLocation();
@@ -49,16 +53,18 @@ const Page = ({children}) => {
       <StyledLayout flex="row" align={['start', 'stretch']}>
         <Menu />
         <Main>
-          <FeedSyncNotification />
-          <ErrorBoundary
-            key={location.pathname}
-            message={_('An error occurred on this page.')}
-          >
-            {children}
-          </ErrorBoundary>
+          <Container>
+            <FeedSyncNotification />
+            <ErrorBoundary
+              key={location.pathname}
+              message={_('An error occurred on this page.')}
+            >
+              {children}
+            </ErrorBoundary>
+          </Container>
+          <Footer />
         </Main>
       </StyledLayout>
-      <Footer />
     </CapabilitiesContext.Provider>
   );
 };