Enable public website sharing.

components/layout/Footer.js

@@ -1,11 +1,23 @@
 import React from 'react';
+import Link from 'next/link';
 import classNames from 'classnames';
+import Button from 'components/common/Button';
+import Logo from 'assets/logo.svg';
 import styles from './Footer.module.css';
 
 export default function Footer() {
   return (
-    <footer className={classNames(styles.footer, 'container mt-5 mb-5')}>
-      umami - deliciously simple web stats
+    <footer className="container">
+      <div className={classNames(styles.footer, 'row justify-content-center')}>
+        <div>powered by</div>
+        <Link href="https://umami.is">
+          <a>
+            <Button icon={<Logo />} size="small">
+              <b>umami</b>
+            </Button>
+          </a>
+        </Link>
+      </div>
     </footer>
   );
 }

components/layout/Footer.module.css

@@ -1,3 +1,14 @@
 .footer {
+  display: flex;
+  align-items: center;
   font-size: var(--font-size-small);
+  padding: 40px 0;
+}
+
+.footer button {
+  margin-left: 10px;
+}
+
+.footer a {
+  text-decoration: none;
 }

components/layout/Header.js

@@ -11,8 +11,8 @@ export default function Header() {
   const user = useSelector(state => state.user);
 
   return (
-    <header className={classNames(styles.header, 'container')}>
-      <div className="row align-items-center">
+    <header className="container">
+      <div className={classNames(styles.header, 'row align-items-center')}>
         <div className="col">
           <div className={styles.title}>
             <Icon icon={<Logo />} size="large" className={styles.logo} />