added easter egg

components/footer.js

@@ -2,20 +2,22 @@ import styles from '../styles/components/Footer.module.css'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faHeart } from '@fortawesome/free-solid-svg-icons'
 
-const Footer = () => (
+export default function Footer() {
-    <div>
+    return (
-        <div className={styles.footer}>
+        <div>
-            <div className="container">
+            <div className={styles.footer}>
-                <p>
+                <div className="container">
-                    <b>
+                    <audio src="/sound/meow.mp3" id="meow" preload="auto"></audio>
-                        Made with <FontAwesomeIcon icon={faHeart} style={{color: "#63C5DA"}} size="1x" /> by <a href="https://twitter.com/midblep" className="link" target="_blank">Midblep</a>
+                    <p>
-                    </b>
+                        <b>
-                    <br/>
+                            Made with <FontAwesomeIcon icon={faHeart} style={{color: "#63C5DA"}} size="1x" id="clickMeow" /> by <a href="https://twitter.com/midblep" className="link" target="_blank">Midblep</a>
-                    NextJS // Vercel // Airtable
+                        </b>
-                </p>
+                        <br/>
+                        NextJS // Vercel // Airtable
+                    </p>
+                </div>
             </div>
+            <script src="js/meow.js"></script>
         </div>
-    </div>
+    )
-)
+}
-
-export default Footer

public/js/meow.js

@@ -0,0 +1,6 @@
+const soundBtn = document.querySelector('#clickMeow');
+let myAudio = document.querySelector('#meow');
+soundBtn.addEventListener('click',() => {
+    myAudio.volume = 0.1;
+    myAudio.play();
+});