added footer

src/Footer.tsx

@@ -0,0 +1,35 @@
+import * as React from 'react';
+import Container from '@mui/material/Container';
+import Link from '@mui/material/Link';
+import Typography from '@mui/material/Typography';
+
+function Copyright() {
+  return (
+    <Typography variant="body2" sx={{ color: 'text.secondary' }}>
+      <Link color="text.secondary" href="https://www.aetoskia.com/">
+        {'Copyright © Aetoskia Internal Infrastructure — All rights reserved.'}
+      </Link>
+      &nbsp;
+      {new Date().getFullYear()}
+    </Typography>
+  );
+}
+
+export default function Footer() {
+  return (
+    <React.Fragment>
+      <Container
+        sx={{
+          display: 'flex',
+          flexDirection: 'column',
+          alignItems: 'center',
+          gap: { xs: 2, sm: 4 },
+          py: { xs: 2, sm: 4 },
+          textAlign: { sm: 'center', md: 'left' },
+        }}
+      >
+        <Copyright />
+      </Container>
+    </React.Fragment>
+  );
+}

src/Home.tsx

@@ -1,26 +1,17 @@
 import * as React from "react";
+import AppTheme from './shared-theme/AppTheme';
+import CssBaseline from '@mui/material/CssBaseline';
+import Footer from './Footer';
+
+export default function Home(props: { disableCustomTheme?: boolean }) {
 
-const Home: React.FC = () => {
   return (
-    <div style={styles.container}>
+    <AppTheme {...props}>
-      <h1 style={styles.title}>Welcome to Khata</h1>
+      <CssBaseline enableColorScheme />
+      <div>
+        <h1>Welcome to Khata</h1>
       </div>
+      <Footer />
+    </AppTheme>
   );
-};
+}
-
-const styles: { [key: string]: React.CSSProperties } = {
-  container: {
-    height: "100vh",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    backgroundColor: "#0f172a",
-  },
-  title: {
-    color: "#ffffff",
-    fontSize: "2rem",
-    fontWeight: 600,
-  },
-};
-
-export default Home;