add clarity logo & github link in footer

src/components/layout/footer.tsx

@@ -0,0 +1,47 @@
+import Image from 'next/image';
+import Link from 'next/link';
+import { GitHub } from '@mui/icons-material';
+import { Box, Button } from '@mui/material';
+
+import clarity from '../../img/Clarity.png';
+
+/**
+ * Footer with Clarity logo & link to repo
+ * @returns Footer
+ */
+export function Footer(): JSX.Element {
+  return (
+    <Box
+      sx={{
+        position: 'static',
+        bottom: 0,
+        left: 0,
+        width: '100%',
+        display: 'flex',
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        p: 2,
+
+        height: '75px',
+      }}
+    >
+      <Link
+        href="https://www.clarity.community/"
+        style={{ textDecoration: 'none' }}
+        data-testid="clarity-link"
+        target="_blank"
+      >
+        <Image src={clarity} width="200" height="50" alt="Powered by Clarity" />
+      </Link>
+      <Button
+        href="https://github.com/ClearContracts/cardano-constitution-voting-app"
+        target="_blank"
+        data-testid="github-link"
+        color="primary"
+      >
+        <GitHub />
+      </Button>
+    </Box>
+  );
+}

src/components/layout/layout.tsx

@@ -4,6 +4,8 @@ import { Toaster } from 'react-hot-toast';
 
 import { Navbar } from '@/components/layout/navbar';
 
+import { Footer } from './footer';
+
 interface Props {
   children: React.ReactNode;
 }
@@ -61,6 +63,7 @@ export function Layout(props: Props): JSX.Element {
       >
         {children}
       </Box>
+      <Footer />
     </>
   );
 }

src/components/layout/navbar.tsx

@@ -12,7 +12,7 @@ export function Navbar(): JSX.Element {
   return (
     <Box
       sx={{
-        position: 'absolute',
+        position: 'sticky',
         top: 0,
         left: 0,
         width: '100%',