From 262bb1a9c6153a53e259e5bd9123b8035bd6b6d1 Mon Sep 17 00:00:00 2001
From: MAZE <remvze@proton.me>
Date: Wed, 1 Nov 2023 17:32:01 +0330
Subject: [PATCH] feat: add footer component

---
 src/components/footer/footer.module.css | 20 ++++++++++++++++++++
 src/components/footer/footer.tsx        | 18 ++++++++++++++++++
 src/components/footer/index.ts          |  1 +
 src/pages/index.astro                   | 20 +++++++-------------
 4 files changed, 46 insertions(+), 13 deletions(-)
 create mode 100644 src/components/footer/footer.module.css
 create mode 100644 src/components/footer/footer.tsx
 create mode 100644 src/components/footer/index.ts

diff --git a/src/components/footer/footer.module.css b/src/components/footer/footer.module.css
new file mode 100644
index 0000000..e814bb3
--- /dev/null
+++ b/src/components/footer/footer.module.css
@@ -0,0 +1,20 @@
+.footer {
+  display: flex;
+  height: 100px;
+  align-items: center;
+
+  & p {
+    color: var(--color-foreground-subtle);
+    font-size: var(--font-sm);
+    text-align: center;
+
+    & a {
+      color: var(--color-foreground);
+      text-decoration: none;
+
+      & span {
+        color: #c0eb75;
+      }
+    }
+  }
+}
diff --git a/src/components/footer/footer.tsx b/src/components/footer/footer.tsx
new file mode 100644
index 0000000..f03d94b
--- /dev/null
+++ b/src/components/footer/footer.tsx
@@ -0,0 +1,18 @@
+import { Container } from '@/components/container';
+
+import styles from './footer.module.css';
+
+export function Footer() {
+  return (
+    <footer className={styles.footer}>
+      <Container>
+        <p>
+          Created by{' '}
+          <a href="https://twitter.com/remvze">
+            Maze <span>✦</span>
+          </a>
+        </p>
+      </Container>
+    </footer>
+  );
+}
diff --git a/src/components/footer/index.ts b/src/components/footer/index.ts
new file mode 100644
index 0000000..4248c0b
--- /dev/null
+++ b/src/components/footer/index.ts
@@ -0,0 +1 @@
+export { Footer } from './footer';
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 4130e39..f38bc12 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -3,21 +3,15 @@ import Layout from '@/layouts/layout.astro';
 
 import { Hero } from '@/components/hero';
 import { App } from '@/components/app';
+import { Footer } from '@/components/footer';
 import { AboutSection, WhySection, ReadySection } from '@/components/sections';
 ---
 
 <Layout title="Welcome to Astro.">
-  <main>
-    <Hero />
-    <App client:load />
-    <AboutSection />
-    <WhySection />
-    <ReadySection />
-  </main>
+  <Hero />
+  <App client:load />
+  <AboutSection />
+  <WhySection />
+  <ReadySection />
+  <Footer />
 </Layout>
-
-<style>
-  main {
-    padding-bottom: 100px;
-  }
-</style>