refactor: move footer to React

src/components/footer/footer.module.css

@@ -0,0 +1,17 @@
+.footer {
+  display: flex;
+  align-items: center;
+  height: 100px;
+
+  & p {
+    font-size: var(--font-sm);
+    color: var(--color-foreground-subtle);
+    text-align: center;
+
+    & a {
+      font-weight: 500;
+      color: var(--color-foreground);
+      text-decoration: none;
+    }
+  }
+}

src/components/footer/footer.tsx

@@ -0,0 +1,15 @@
+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 ✦</a>
+        </p>
+      </Container>
+    </footer>
+  );
+}

src/components/footer/index.ts

@@ -0,0 +1 @@
+export { Footer } from './footer';

src/pages/index.astro

@@ -1,11 +1,11 @@
 ---
 import Layout from '@/layouts/layout.astro';
-import Footer from '@/components/footer.astro';
 
 import { Hero } from '@/components/hero';
 import { App } from '@/components/app';
 import { Source } from '@/components/source';
 import { Donate } from '@/components/donate';
+import { Footer } from '@/components/footer';
 ---
 
 <Layout title="Moodist: Ambient Sounds for Focus and Calm">