diff --git a/docs/components/Footer/index.jsx b/docs/components/Footer/index.jsx
index 2547ecf8..071d507c 100644
--- a/docs/components/Footer/index.jsx
+++ b/docs/components/Footer/index.jsx
@@ -1,16 +1,16 @@
 import styles from '../../styles/Home.module.css'
 
 export default function Footer() {
-    return (
-        <footer className={styles.footer}>
-            <a
-                href="https://www.datopian.com/"
-                target="_blank"
-                rel="noopener noreferrer"
-            >
-                Built by{' '}
-                <img src="/datopian-logo.png" alt="Datopian Logo" className={styles.logo} />
-            </a>
-        </footer>
-    )
+  return (
+    <footer className={styles.footer}>
+      <a
+        href="https://www.datopian.com/"
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        Built by{' '}
+        <img src="/datopian-logo.png" alt="Datopian Logo" className={styles.logo} />
+      </a>
+    </footer>
+  )
 }
diff --git a/docs/components/Nav/index.jsx b/docs/components/Nav/index.jsx
index 9f05b4a9..784d1be7 100644
--- a/docs/components/Nav/index.jsx
+++ b/docs/components/Nav/index.jsx
@@ -2,47 +2,47 @@ import { useState } from 'react'
 import Link from 'next/link'
 
 export default function Nav() {
-    const [open, setOpen] = useState(false);
-    const handleClick = (event) => {
-        event.preventDefault();
-        setOpen(!open);
-    };
+  const [open, setOpen] = useState(false);
+  const handleClick = (event) => {
+    event.preventDefault();
+    setOpen(!open);
+  };
 
-    const navMenu = [{ title: 'Home', path: '/' },
-    { title: 'Gallery', path: '/gallery' },
-    { title: 'Docs', path: '/docs' },
-    { title: 'Learn', path: '/learn' },
-    { title: 'Github', path: 'https://github.com/datopian/portal.js' }]
+  const navMenu = [{ title: 'Home', path: '/' },
+  { title: 'Gallery', path: '/gallery' },
+  { title: 'Docs', path: '/docs' },
+  { title: 'Learn', path: '/learn' },
+  { title: 'Github', path: 'https://github.com/datopian/portal.js' }]
 
-    return (
-        <nav className="flex items-center justify-between flex-wrap bg-white p-4 border-b border-gray-200">
-            <div className="flex items-center flex-shrink-0 text-gray-700 mr-6">
-                <img src="/logo.svg" alt="portal logo" width="110" />
-            </div>
-            <div className="block lg:hidden mx-4">
-                <button
-                    onClick={handleClick}
-                    className="flex items-center px-3 py-2 border rounded text-gray-700 border-orange-400 hover:text-black hover:border-black"
-                >
-                    <svg
-                        className="fill-current h-3 w-3"
-                        viewBox="0 0 20 20"
-                        xmlns="http://www.w3.org/2000/svg"
-                    >
-                        <title>Menu</title>
-                        <path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
-                    </svg>
-                </button>
-            </div>
-            <div className={`${open ? `block` : `hidden`} lg:block`}>
-                {navMenu.map((menu, index) => {
-                    return (<Link href={menu.path} key={index}>
-                        <a className="block mt-4 lg:inline-block lg:mt-0 active:bg-primary-background text-gray-700 hover:text-black mr-6">
-                            {menu.title}
-                        </a>
-                    </Link>)
-                })}
-            </div>
-        </nav>
-    )
+  return (
+    <nav className="flex items-center justify-between flex-wrap bg-white p-4 border-b border-gray-200">
+      <div className="flex items-center flex-shrink-0 text-gray-700 mr-6">
+        <img src="/logo.svg" alt="portal logo" width="110" />
+      </div>
+      <div className="block lg:hidden mx-4">
+        <button
+            onClick={handleClick}
+            className="flex items-center px-3 py-2 border rounded text-gray-700 border-orange-400 hover:text-black hover:border-black"
+          >
+        <svg
+            className="fill-current h-3 w-3"
+            viewBox="0 0 20 20"
+            xmlns="http://www.w3.org/2000/svg"
+        >
+            <title>Menu</title>
+            <path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
+        </svg>
+        </button>
+      </div>
+      <div className={`${open ? `block` : `hidden`} lg:block`}>
+        {navMenu.map((menu, index) => {
+          return (<Link href={menu.path} key={index}>
+            <a className="block mt-4 lg:inline-block lg:mt-0 active:bg-primary-background text-gray-700 hover:text-black mr-6">
+              {menu.title}
+            </a>
+          </Link>)
+        })}
+      </div>
+    </nav>
+  )
 }