change: spinner and footer

Author: daniele-mng

src/web/components/loading/loading.jsx

@@ -5,40 +5,19 @@
 
 import React from 'react';
 
-import styled, {keyframes} from 'styled-components';
+import styled from 'styled-components';
 
 import Layout from 'web/components/layout/layout';
 
-import GbLogo from 'web/components/icon/svg/greenbone.svg?url';
-
-const Loader = styled.div`
-  width: 80px;
-  height: 80px;
-  margin: 40px auto;
-  background-image: url(${GbLogo});
-  background-size: 90%;
-  background-position: center;
-  background-repeat: no-repeat;
-  animation: ${keyframes({
-      '0%, 100%': {
-        transform: 'scale(0.9)',
-        opacity: 0.2,
-      },
-      '50%': {
-        transform: 'scale(1.0)',
-        opacity: 1,
-      },
-    })}
-    2s infinite ease-in-out;
-`;
+import {Spinner} from '@greenbone/opensight-ui-components-mantinev7';
 
 const StyledLayout = styled(Layout)`
   width: 100%;
 `;
 
 const Loading = () => (
   <StyledLayout data-testid="loading" align={['center', 'center']}>
-    <Loader />
+    <Spinner />
   </StyledLayout>
 );
 

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';
@@ -12,6 +11,7 @@ import Theme from 'web/utils/theme';
 
 const Link = styled.a`
   color: ${Theme.mediumGray};
+  font-size: 10px;
   &:link {
     color: ${Theme.mediumGray};
   }