format: auto-fix new website formatting errors

- with `yarn lint --fix`

- formatting errors are from b09e195

website/components/video.js

@@ -1,52 +1,52 @@
-import { useRef, useCallback, useEffect } from 'react'
-import { useInView } from 'react-intersection-observer'
-import 'intersection-observer'
+import { useRef, useCallback, useEffect } from 'react';
+import { useInView } from 'react-intersection-observer';
+import 'intersection-observer';
 
 export default ({ src, caption, ratio }) => {
   const [inViewRef, inView] = useInView({
     threshold: 1,
-  })
-  const videoRef = useRef()
+  });
+  const videoRef = useRef();
 
   const setRefs = useCallback(
-    (node) => {
+    node => {
       // Ref's from useRef needs to have the node assigned to `current`
-      videoRef.current = node
+      videoRef.current = node;
       // Callback refs, like the one from `useInView`, is a function that takes the node as an argument
-      inViewRef(node)
+      inViewRef(node);
 
       if (node) {
-        node.addEventListener('click', function () {
+        node.addEventListener('click', function() {
           if (this.paused) {
-            this.play()
+            this.play();
           } else {
-            this.pause()
+            this.pause();
           }
-        })
+        });
       }
     },
     [inViewRef]
-  )
+  );
 
   useEffect(() => {
     if (!videoRef || !videoRef.current) {
-      return
+      return;
     }
 
     if (inView) {
-      videoRef.current.play()
+      videoRef.current.play();
     } else {
-      videoRef.current.pause()
+      videoRef.current.pause();
     }
-  }, [inView])
+  }, [inView]);
 
   return (
     <figure>
-      <div style={{ paddingBottom: ratio * 100 + '%' }}/>
+      <div style={{ paddingBottom: ratio * 100 + '%' }} />
       <video loop muted autoPlay playsInline ref={setRefs}>
         <source src={src} type="video/mp4" />
       </video>
       {caption && <figcaption>{caption}</figcaption>}
     </figure>
-  )
-}
+  );
+};

website/pages/_app.js

@@ -1,5 +1,5 @@
-import '.nextra/styles.css'
-import GoogleFonts from 'next-google-fonts'
+import '.nextra/styles.css';
+import GoogleFonts from 'next-google-fonts';
 
 export default function Nextra({ Component, pageProps }) {
   return (
@@ -10,5 +10,5 @@ export default function Nextra({ Component, pageProps }) {
       />
       <Component {...pageProps} />
     </>
-  )
+  );
 }

website/pages/_document.js

@@ -1,6 +1,6 @@
-import React from 'react'
-import Document, { Html, Head, Main, NextScript } from 'next/document'
-import { SkipNavLink } from '@reach/skip-nav'
+import React from 'react';
+import Document, { Html, Head, Main, NextScript } from 'next/document';
+import { SkipNavLink } from '@reach/skip-nav';
 
 class MyDocument extends Document {
   render() {
@@ -18,8 +18,8 @@ class MyDocument extends Document {
           />
         </body>
       </Html>
-    )
+    );
   }
 }
 
-export default MyDocument
+export default MyDocument;

website/postcss.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-  plugins: ['tailwindcss', 'postcss-preset-env']
-}
+  plugins: ['tailwindcss', 'postcss-preset-env'],
+};

website/tailwind.config.js

@@ -1,5 +1,11 @@
 module.exports = {
-  purge: ['./components/**/*.js', './pages/**/*.md', './pages/**/*.mdx', './.nextra/**/*.js', './nextra.config.js'],
+  purge: [
+    './components/**/*.js',
+    './pages/**/*.md',
+    './pages/**/*.mdx',
+    './.nextra/**/*.js',
+    './nextra.config.js',
+  ],
   theme: {
     screens: {
       sm: '640px',
@@ -11,7 +17,7 @@ module.exports = {
       display: ['inter', 'sans-serif'],
     },
     letterSpacing: {
-      tight: '-0.015em'
-    }
-  }
-}
+      tight: '-0.015em',
+    },
+  },
+};