Add footer component

_components/footer.tsx

@@ -0,0 +1,8 @@
+export default function({ comp }) {
+  return (
+    <footer className="page-footer">
+      <p>Copyright &copy; 2023 Foster Hangdaan</p>
+      <p>Made with <a href="https://deno.land/" target="_blank">Deno</a>, <a href="https://lume.land/" target="_blank">Lume</a>, <a href="https://www.typescriptlang.org/" target="_blank">TypeScript</a> and lots of <span className="heart"></span>.</p>
+    </footer>
+  );
+}

_includes/layouts/main.tsx

@@ -11,6 +11,8 @@ export default function({ title, header, children, comp }) {
         { comp.navbar() }
         { comp.header(header) }
         { children }
+        { comp.separator() }
+        { comp.footer() }
       </body>
     </html>
   );

_includes/styles/components/footer.scss

@@ -0,0 +1,10 @@
+.page-footer {
+  text-align: center;
+  max-width: var(--page--max-width);
+  margin: 0 auto;
+  padding: 1rem;
+
+  .heart {
+    color: var(--color-red);
+  }
+}

styles/main.scss

@@ -11,3 +11,4 @@
 @import "styles/components/navbar";
 @import "styles/components/header";
 @import "styles/components/separator";
+@import "styles/components/footer";