Make header logo into link to landing page

pages/components/Logo.tsx

@@ -1,5 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import styles from '../../styles/Logo.module.scss';
+import Link from 'next/link';
 
 const Logo = () => {
   const [isDesktop, setIsDesktop] = useState(true);
@@ -9,25 +10,29 @@ const Logo = () => {
   }, []);
 
   return (
-    <section className={styles.logoContainer}>
-      <div className={styles.logo} id='logo-start'>
-        <picture>
-          <source
-            srcSet='/runosaari-logo_small.jpg'
-            media='(max-width: 600px)'
-          />
-          <source srcSet='/runosaari-logo.jpg' />
-          <img
-            src='/runosaari-logo.jpg'
-            alt='Runosaari logo'
-            className={styles.logoImage}
-          />
-        </picture>
-        <div className={styles.logoCredits}>
-          <div>@Sanna Hukkanen</div>
-        </div>
-      </div>
-    </section>
+    <Link href="/">
+      <a>
+        <section className={styles.logoContainer}>
+          <div className={styles.logo} id='logo-start'>
+            <picture>
+              <source
+                srcSet='/runosaari-logo_small.jpg'
+                media='(max-width: 600px)'
+              />
+              <source srcSet='/runosaari-logo.jpg' />
+              <img
+                src='/runosaari-logo.jpg'
+                alt='Runosaari logo'
+                className={styles.logoImage}
+              />
+            </picture>
+            <div className={styles.logoCredits}>
+              <div>@Sanna Hukkanen</div>
+            </div>
+          </div>
+        </section>
+      </a>
+    </Link>
   );
 };