diff --git a/packages/web/components/LoginButton.tsx b/packages/web/components/LoginButton.tsx
index f66d6215..676814c6 100644
--- a/packages/web/components/LoginButton.tsx
+++ b/packages/web/components/LoginButton.tsx
@@ -14,32 +14,31 @@ export const LoginButton: React.FC = () => {
     await connectWeb3();
   }, [connectWeb3]);
 
+  if (isConnected) {
+    return (
+      <Box>
+        <Text fontFamily="body" color="whiteAlpha.700">
+          {formatAddress(address)}
+        </Text>
+        <HStack spacing={2}>
+          <MetaLink href="/profile/setup">Setup profile</MetaLink>
+          <Text color="cyan.400">|</Text>
+          <Button
+            onClick={disconnect}
+            fontFamily="body"
+            color="cyan.400"
+            variant="link"
+            fontWeight="normal"
+          >
+            Disconnect
+          </Button>
+        </HStack>
+      </Box>
+    );
+  }
   return (
-    <Box>
-      {isConnected ? (
-        <Box>
-          <Text fontFamily="body" color="whiteAlpha.700">
-            {formatAddress(address)}
-          </Text>
-          <HStack spacing={2}>
-            <MetaLink href="/profile/setup">Setup profile</MetaLink>
-            <Text color="cyan.400">|</Text>
-            <Button
-              onClick={disconnect}
-              fontFamily="body"
-              color="cyan.400"
-              variant="link"
-              fontWeight="normal"
-            >
-              Disconnect
-            </Button>
-          </HStack>
-        </Box>
-      ) : (
-        <MetaButton size="md" px={8} onClick={handleLoginClick}>
-          Connect wallet
-        </MetaButton>
-      )}
-    </Box>
+    <MetaButton size="md" px={8} onClick={handleLoginClick}>
+      Connect wallet
+    </MetaButton>
   );
 };
diff --git a/packages/web/components/MobileFooter.tsx b/packages/web/components/MobileFooter.tsx
new file mode 100644
index 00000000..23a927aa
--- /dev/null
+++ b/packages/web/components/MobileFooter.tsx
@@ -0,0 +1,182 @@
+import { Button, Flex, Image, Stack, useDisclosure } from '@metafam/ds';
+import MetaGameLogo from 'assets/logo.png';
+import { MetaLink } from 'components/Link';
+import { motion } from 'framer-motion';
+import NextImage from 'next/dist/client/image';
+import MetaBoxButton from 'public/assets/drawer/box.button.bg.png';
+import React from 'react';
+
+import {
+  DrawerItemsLeft,
+  DrawerItemsRight,
+  DrawerSubItems,
+} from '../utils/drawerItems';
+
+const MenuItem: React.FC<React.ComponentProps<typeof MetaLink>> = ({
+  children,
+  href,
+  isExternal,
+}) => {
+  return (
+    <MetaLink zIndex="2" href={href} isExternal={isExternal}>
+      <Button
+        display="flex"
+        flexDirection="column"
+        justifyContent="center"
+        alignItems="center"
+        width="20vw"
+        height="5rem"
+        textDecoration="none"
+        variant="link"
+        p="1"
+        fontFamily="mono"
+        color="whiteAlpha.700"
+      >
+        {children}
+      </Button>
+    </MetaLink>
+  );
+};
+
+const SubMenuItem: React.FC<React.ComponentProps<typeof MetaLink>> = ({
+  children,
+  href,
+  isExternal,
+}) => {
+  return (
+    <MetaLink
+      zIndex="2"
+      href={href}
+      isExternal={isExternal}
+      margin="0 !important"
+      width="7rem"
+      height="7rem"
+    >
+      <Button
+        display="flex"
+        alignItems="center"
+        justifyContent="center"
+        width="6rem"
+        height="6rem"
+        textDecoration="none"
+        variant="link"
+        margin="0.5rem"
+        padding="0.5rem"
+        backgroundImage={`url(${MetaBoxButton})`}
+      >
+        {children}
+      </Button>
+    </MetaLink>
+  );
+};
+
+export interface SubImageProps {
+  src: string;
+  alt: string;
+}
+
+export const SubImage: React.FC<SubImageProps> = ({ src, alt }) => {
+  return <Image src={src} alt={alt} height="85%" />;
+};
+
+export const MobileFooter: React.FC = () => {
+  const { isOpen, onToggle, onClose } = useDisclosure();
+
+  return (
+    <Flex
+      as="nav"
+      align="center"
+      justify="center"
+      wrap="wrap"
+      color="offwhite"
+      position="fixed"
+      display={{ base: 'flex', md: 'none' }}
+      left="0"
+      bottom="0"
+      width="100%"
+      height="5rem"
+      zIndex="11"
+      background="linear-gradient(180deg, #40347C 58.55%, #A751BD 100%)"
+    >
+      {DrawerItemsLeft.map((item) => (
+        <MenuItem href={item.href} isExternal={item.isExternal} key={item.href}>
+          <NextImage src={item.src} alt={item.alt} width={35} height={35} />
+          {item.text}
+        </MenuItem>
+      ))}
+
+      <motion.div
+        animate={isOpen ? 'show' : 'hide'}
+        transition={{ duration: 0.25 }}
+        variants={{
+          show: {
+            position: 'relative',
+            top: '-3rem',
+            filter: 'drop-shadow(0 0 15px #a5b9f680)',
+          },
+          hide: { position: 'relative', top: 0, filter: 'none' },
+        }}
+      >
+        <Button
+          display="flex"
+          zIndex="11"
+          textDecoration="none"
+          variant="link"
+          flexDirection="column"
+          justifyContent="center"
+          alignItems="center"
+          width="20vw"
+          height="5rem"
+          onClick={onToggle}
+        >
+          <Image // TODO use NextImage component once images are without text
+            src={MetaGameLogo}
+            alt="MetaGameLogo"
+            height="6rem"
+            position="relative"
+            top="0.5rem"
+          />
+        </Button>
+      </motion.div>
+
+      {DrawerItemsRight.map((item) => (
+        <MenuItem href={item.href} isExternal={item.isExternal} key={item.href}>
+          <NextImage src={item.src} alt={item.alt} width={35} height={35} />
+          {item.text}
+        </MenuItem>
+      ))}
+
+      <motion.div
+        animate={isOpen ? 'show' : 'hide'}
+        transition={{ duration: 0.25 }}
+        variants={{
+          show: { opacity: 1, pointerEvents: 'inherit' },
+          hide: { opacity: 0, pointerEvents: 'none' },
+        }}
+        onClick={onClose}
+      >
+        <Stack
+          position="fixed"
+          left="0"
+          top="0"
+          width="100vw"
+          height="calc(100vh - 5rem)"
+          background="linear-gradient(180deg, rgba(76, 63, 143, 0.95) 62.76%, rgba(184, 169, 255, 0.95) 100%);"
+          display="grid"
+          gridTemplateColumns="auto auto auto"
+          justify="center"
+          align="center"
+          padding="1rem 1rem 6rem 1rem"
+        >
+          {DrawerSubItems.map((item) => {
+            return (
+              <SubMenuItem href={item.href} key={item.alt}>
+                <SubImage src={item.src} alt={item.alt} />
+              </SubMenuItem>
+            );
+          })}
+        </Stack>
+      </motion.div>
+    </Flex>
+  );
+};
diff --git a/packages/web/components/PageHeader.tsx b/packages/web/components/PageHeader.tsx
index 45006bd0..518224ff 100644
--- a/packages/web/components/PageHeader.tsx
+++ b/packages/web/components/PageHeader.tsx
@@ -1,10 +1,23 @@
-import { Box, Button, Flex, Image, Stack } from '@metafam/ds';
-import MetaGameImage from 'assets/metagame.png';
+import { Box, Button, Flex, Image, Stack, useDisclosure } from '@metafam/ds';
 import { MetaLink } from 'components/Link';
 import { LoginButton } from 'components/LoginButton';
 import { Ticker } from 'components/Ticker';
+import { motion } from 'framer-motion';
+import NextImage from 'next/image';
 import React from 'react';
 
+import {
+  DrawerItemsLeft,
+  DrawerItemsRight,
+  DrawerSubItems,
+} from '../utils/drawerItems';
+
+const MetaBoxButton = '/assets/drawer/box.button.bg.png';
+const MetaBox = '/assets/drawer/desktop-box.png';
+const MetaDrawer = '/assets/drawer/desktop.gradient.png';
+const MetaGameLogo = '/assets/logo.png';
+const MetaGameImage = '/assets/metagame.png';
+
 const MenuItem: React.FC<React.ComponentProps<typeof MetaLink>> = ({
   children,
   href,
@@ -12,18 +25,66 @@ const MenuItem: React.FC<React.ComponentProps<typeof MetaLink>> = ({
 }) => {
   return (
     <MetaLink
+      zIndex="2"
       href={href}
       isExternal={isExternal}
       textDecoration="none"
       _hover={{ textDecoration: 'none' }}
     >
       <Button
+        display="flex"
+        flexDirection="column"
+        justifyContent="center"
+        alignItems="center"
+        width="calc(32rem / 5)"
+        textDecoration="none"
+        _hover={{ textDecoration: 'none' }}
+        variant="link"
+        p="1"
+        fontFamily="mono"
+        color="whiteAlpha.700"
+        className="filter-effect"
+      >
+        {children}
+      </Button>
+    </MetaLink>
+  );
+};
+
+const SubMenuItem: React.FC<React.ComponentProps<typeof MetaLink>> = ({
+  children,
+  href,
+  isExternal,
+}) => {
+  return (
+    <MetaLink
+      zIndex="2"
+      href={href}
+      isExternal={isExternal}
+      textDecoration="none"
+      _hover={{ textDecoration: 'none' }}
+    >
+      <style jsx>{`
+        button.hover-effect:hover {
+          filter: drop-shadow(0 0 15px #a5b9f680);
+        }
+      `}</style>
+      <Button
+        display="flex"
+        flexDirection="column"
+        justifyContent="center"
+        alignItems="center"
+        width="8.25rem"
+        height="8.25rem"
         textDecoration="none"
         variant="link"
         p="1"
         fontFamily="mono"
         color="whiteAlpha.700"
-        _hover={{ color: 'pink.500', textDecoration: 'none' }}
+        className="hover"
+        margin="1rem"
+        padding="1rem"
+        backgroundImage={`url(${MetaBoxButton})`}
       >
         {children}
       </Button>
@@ -32,8 +93,7 @@ const MenuItem: React.FC<React.ComponentProps<typeof MetaLink>> = ({
 };
 
 export const PageHeader: React.FC = () => {
-  const [show, setShow] = React.useState(false);
-  const handleToggle = () => setShow(!show);
+  const { isOpen, onToggle, onClose } = useDisclosure();
 
   return (
     <Flex
@@ -42,65 +102,142 @@ export const PageHeader: React.FC = () => {
       justify="space-between"
       wrap="wrap"
       color="offwhite"
-      py="6"
       px="8"
+      position="relative"
+      display={{ base: 'none', md: 'flex' }}
     >
       <MetaLink href="/" display="block" mr="10">
-        <Image src={MetaGameImage} alt="MetaGame" mt={-2} w="9rem" />
+        <Box mt={2}>
+          <NextImage
+            src={MetaGameImage}
+            alt="MetaGame"
+            width={144}
+            height={62}
+          />
+        </Box>
       </MetaLink>
 
-      <Button
-        variant="link"
-        display={{ base: 'block', md: 'none' }}
-        onClick={handleToggle}
+      <Stack
+        width="48rem"
+        height="100%"
+        direction="row"
+        justify="center"
+        align="center"
+        position="absolute"
+        top="0"
+        left="calc(50% - 24rem)"
+        padding="0 0 0.5rem 0"
       >
-        <svg
-          fill="white"
-          width="1.5rem"
-          viewBox="0 0 20 20"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <title>Menu</title>
-          <path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
-        </svg>
-      </Button>
+        <Box position="absolute" left="calc(50% - 24rem)" top="0" zIndex="1">
+          <NextImage
+            src={MetaDrawer}
+            alt="MetaDrawer"
+            width={768}
+            height={94}
+          />
+        </Box>
 
-      <Box
-        display={{ base: show ? 'block' : 'none', md: 'flex' }}
-        width={{ base: 'full', md: 'auto' }}
-        alignItems="center"
-        flexGrow={1}
-        my={{ base: 8, md: 0 }}
-      >
-        <Stack
-          direction={{ base: 'column', md: 'row' }}
-          spacing={{ base: 4, md: 6, lg: 10 }}
-        >
-          <MenuItem href="/guilds">Guilds</MenuItem>
-          <MenuItem href="https://discord.gg/VYZPBnx" isExternal>
-            Discord
+        {DrawerItemsLeft.map((item) => (
+          <MenuItem
+            key={item.alt}
+            href={item.href}
+            isExternal={item.isExternal}
+          >
+            <NextImage src={item.src} alt={item.alt} width={35} height={35} />
+            {item.text}
           </MenuItem>
-          <MenuItem href="https://wiki.metagame.wtf/" isExternal>
-            Wiki
-          </MenuItem>
-          <MenuItem href="https://forum.metagame.wtf" isExternal>
-            Forums
-          </MenuItem>
-          <MenuItem href="https://metagame.substack.com" isExternal>
-            Blog
-          </MenuItem>
-        </Stack>
-      </Box>
+        ))}
 
-      <Box
-        display={{ base: show ? 'block' : 'none', md: 'flex' }}
-        justifyContent="center"
-        alignItems="center"
-        width={{ base: 'full', md: 'auto' }}
-      >
+        <motion.div
+          animate={isOpen ? 'show' : 'hide'}
+          transition={{ duration: 0.25 }}
+          variants={{
+            show: { position: 'relative', top: '46rem' },
+            hide: { position: 'relative', top: '1rem' },
+          }}
+        >
+          <Button
+            display="flex"
+            zIndex="11"
+            textDecoration="none"
+            variant="link"
+            flexDirection="column"
+            justifyContent="center"
+            alignItems="center"
+            width="calc(32rem / 5)"
+            className="filter-effect"
+            position="relative"
+            left="-0.25rem"
+            onClick={onToggle}
+          >
+            <NextImage
+              src={MetaGameLogo}
+              alt="MetaGameLogo"
+              width={80}
+              height={96}
+            />
+          </Button>
+        </motion.div>
+
+        {DrawerItemsRight.map((item) => (
+          <MenuItem
+            key={item.alt}
+            href={item.href}
+            isExternal={item.isExternal}
+          >
+            <NextImage src={item.src} alt={item.alt} width={35} height={35} />
+            {item.text}
+          </MenuItem>
+        ))}
+      </Stack>
+
+      <Flex justifyContent="center" alignItems="center">
         <Ticker />
         <LoginButton />
-      </Box>
+      </Flex>
+
+      <motion.div
+        animate={isOpen ? 'show' : 'hide'}
+        transition={{ duration: 0.25 }}
+        variants={{
+          show: { display: 'block', opacity: 1 },
+          hide: { display: 'none', opacity: 0 },
+        }}
+        onClick={onClose}
+        style={{
+          position: 'absolute',
+          zIndex: 10,
+          top: '5rem',
+          left: 'calc(50% - 16.5rem)',
+          display: 'none',
+        }}
+      >
+        <Stack width="33rem" direction="row" flexWrap="wrap" padding="1rem 0">
+          <Box
+            position="fixed"
+            top="0"
+            bottom="0"
+            left="0"
+            right="0"
+            onClick={onClose}
+          />
+          <Box position="absolute" left="calc(50% - 16.5rem)" top="0">
+            <NextImage src={MetaBox} alt="MetaBox" width={528} height={695} />
+          </Box>
+          {DrawerSubItems.map((item) => {
+            return (
+              <SubMenuItem
+                href={item.href}
+                key={item.alt}
+                isExternal={item.isExternal}
+              >
+                <Image src={item.src} alt={item.alt} />
+                {item.text}
+              </SubMenuItem>
+            );
+          })}
+        </Stack>
+      </motion.div>
     </Flex>
   );
 };
diff --git a/packages/web/package.json b/packages/web/package.json
index 8e7a4c2c..92404fa4 100644
--- a/packages/web/package.json
+++ b/packages/web/package.json
@@ -17,9 +17,10 @@
     "@walletconnect/web3-provider": "^1.2.1",
     "ethers": "^5.0.8",
     "fake-tag": "2.0.0",
+    "framer-motion": "^3.1.1",
     "graphql": "^15.0.0",
     "isomorphic-unfetch": "^3.0.0",
-    "next": "latest",
+    "next": "^10.0.3",
     "next-images": "^1.4.1",
     "next-urql": "2.0.0",
     "node-fetch": "^2.6.1",
diff --git a/packages/web/pages/_app.tsx b/packages/web/pages/_app.tsx
index b4bdfafd..93a506f6 100644
--- a/packages/web/pages/_app.tsx
+++ b/packages/web/pages/_app.tsx
@@ -1,4 +1,5 @@
 import { ChakraProvider, CSSReset, MetaTheme } from '@metafam/ds';
+import { MobileFooter } from 'components/MobileFooter';
 import { PageHeader } from 'components/PageHeader';
 import { CONFIG } from 'config';
 import { Web3ContextProvider } from 'contexts/Web3Context';
@@ -16,7 +17,8 @@ const app: React.FC<AppProps> = ({ pageProps, Component }) => {
         <title>MetaGame</title>
       </Head>
       <Web3ContextProvider>
-        {!pageProps.hidePageHeader && <PageHeader />}
+        {!pageProps.hideAppDrawer && <PageHeader />}
+        {!pageProps.hideAppDrawer && <MobileFooter />}
         <Component {...pageProps} />
       </Web3ContextProvider>
     </ChakraProvider>
diff --git a/packages/web/pages/profile/setup.tsx b/packages/web/pages/profile/setup.tsx
index b0de3255..e4592879 100644
--- a/packages/web/pages/profile/setup.tsx
+++ b/packages/web/pages/profile/setup.tsx
@@ -21,7 +21,7 @@ export const getStaticProps = async () => {
       skillsList,
       personalityTypes,
       playerTypes,
-      hidePageHeader: true,
+      hideAppDrawer: true,
     },
   };
 };
diff --git a/packages/web/pages/profile/success.tsx b/packages/web/pages/profile/success.tsx
index 9dea83a5..972bce4b 100644
--- a/packages/web/pages/profile/success.tsx
+++ b/packages/web/pages/profile/success.tsx
@@ -5,7 +5,7 @@ import React from 'react';
 export const getStaticProps = async () => {
   return {
     props: {
-      hidePageHeader: true,
+      hideAppDrawer: true,
     },
   };
 };
diff --git a/packages/web/pages/register.tsx b/packages/web/pages/register.tsx
index 7f704b01..7417efc5 100644
--- a/packages/web/pages/register.tsx
+++ b/packages/web/pages/register.tsx
@@ -7,7 +7,7 @@ import React from 'react';
 export const getStaticProps = async () => {
   return {
     props: {
-      hidePageHeader: true,
+      hideAppDrawer: true,
     },
   };
 };
diff --git a/packages/web/pages/welcome.tsx b/packages/web/pages/welcome.tsx
index bd3dd792..f647648e 100644
--- a/packages/web/pages/welcome.tsx
+++ b/packages/web/pages/welcome.tsx
@@ -7,7 +7,7 @@ import React from 'react';
 export const getStaticProps = async () => {
   return {
     props: {
-      hidePageHeader: true,
+      hideAppDrawer: true,
     },
   };
 };
diff --git a/packages/web/public/assets/drawer/box.button.bg.png b/packages/web/public/assets/drawer/box.button.bg.png
new file mode 100644
index 00000000..e6e29e10
Binary files /dev/null and b/packages/web/public/assets/drawer/box.button.bg.png differ
diff --git a/packages/web/public/assets/drawer/calendar.png b/packages/web/public/assets/drawer/calendar.png
new file mode 100644
index 00000000..df0623d4
Binary files /dev/null and b/packages/web/public/assets/drawer/calendar.png differ
diff --git a/packages/web/public/assets/drawer/desktop-box.png b/packages/web/public/assets/drawer/desktop-box.png
new file mode 100644
index 00000000..6d6475fa
Binary files /dev/null and b/packages/web/public/assets/drawer/desktop-box.png differ
diff --git a/packages/web/public/assets/drawer/desktop.gradient.png b/packages/web/public/assets/drawer/desktop.gradient.png
new file mode 100644
index 00000000..1d791687
Binary files /dev/null and b/packages/web/public/assets/drawer/desktop.gradient.png differ
diff --git a/packages/web/public/assets/drawer/discord.png b/packages/web/public/assets/drawer/discord.png
new file mode 100644
index 00000000..3d09e12b
Binary files /dev/null and b/packages/web/public/assets/drawer/discord.png differ
diff --git a/packages/web/public/assets/drawer/forum.png b/packages/web/public/assets/drawer/forum.png
new file mode 100644
index 00000000..f49454ea
Binary files /dev/null and b/packages/web/public/assets/drawer/forum.png differ
diff --git a/packages/web/public/assets/drawer/github.png b/packages/web/public/assets/drawer/github.png
new file mode 100644
index 00000000..3b6e113f
Binary files /dev/null and b/packages/web/public/assets/drawer/github.png differ
diff --git a/packages/web/public/assets/drawer/guilds.png b/packages/web/public/assets/drawer/guilds.png
new file mode 100644
index 00000000..35f17955
Binary files /dev/null and b/packages/web/public/assets/drawer/guilds.png differ
diff --git a/packages/web/public/assets/drawer/leaderboard.png b/packages/web/public/assets/drawer/leaderboard.png
new file mode 100644
index 00000000..3ee2db68
Binary files /dev/null and b/packages/web/public/assets/drawer/leaderboard.png differ
diff --git a/packages/web/public/assets/drawer/library.png b/packages/web/public/assets/drawer/library.png
new file mode 100644
index 00000000..18f1a482
Binary files /dev/null and b/packages/web/public/assets/drawer/library.png differ
diff --git a/packages/web/public/assets/drawer/metaview.png b/packages/web/public/assets/drawer/metaview.png
new file mode 100644
index 00000000..78db661f
Binary files /dev/null and b/packages/web/public/assets/drawer/metaview.png differ
diff --git a/packages/web/public/assets/drawer/newsletter.png b/packages/web/public/assets/drawer/newsletter.png
new file mode 100644
index 00000000..9d616d1b
Binary files /dev/null and b/packages/web/public/assets/drawer/newsletter.png differ
diff --git a/packages/web/public/assets/drawer/players.png b/packages/web/public/assets/drawer/players.png
new file mode 100644
index 00000000..56178708
Binary files /dev/null and b/packages/web/public/assets/drawer/players.png differ
diff --git a/packages/web/public/assets/drawer/quests.png b/packages/web/public/assets/drawer/quests.png
new file mode 100644
index 00000000..1cb54991
Binary files /dev/null and b/packages/web/public/assets/drawer/quests.png differ
diff --git a/packages/web/public/assets/drawer/raids.png b/packages/web/public/assets/drawer/raids.png
new file mode 100644
index 00000000..f3b6f687
Binary files /dev/null and b/packages/web/public/assets/drawer/raids.png differ
diff --git a/packages/web/public/assets/drawer/seed_pool.png b/packages/web/public/assets/drawer/seed_pool.png
new file mode 100644
index 00000000..d2909e78
Binary files /dev/null and b/packages/web/public/assets/drawer/seed_pool.png differ
diff --git a/packages/web/public/assets/drawer/seedmarket.png b/packages/web/public/assets/drawer/seedmarket.png
new file mode 100644
index 00000000..673d964c
Binary files /dev/null and b/packages/web/public/assets/drawer/seedmarket.png differ
diff --git a/packages/web/public/assets/drawer/twitter.png b/packages/web/public/assets/drawer/twitter.png
new file mode 100644
index 00000000..8264d835
Binary files /dev/null and b/packages/web/public/assets/drawer/twitter.png differ
diff --git a/packages/web/public/assets/emojis/crossed-swords.png b/packages/web/public/assets/emojis/crossed-swords.png
new file mode 100644
index 00000000..d225145a
Binary files /dev/null and b/packages/web/public/assets/emojis/crossed-swords.png differ
diff --git a/packages/web/public/assets/logo.png b/packages/web/public/assets/logo.png
new file mode 100644
index 00000000..05007b47
Binary files /dev/null and b/packages/web/public/assets/logo.png differ
diff --git a/packages/web/public/assets/metagame.png b/packages/web/public/assets/metagame.png
new file mode 100644
index 00000000..54201cc8
Binary files /dev/null and b/packages/web/public/assets/metagame.png differ
diff --git a/packages/web/utils/drawerItems.ts b/packages/web/utils/drawerItems.ts
new file mode 100644
index 00000000..dba99889
--- /dev/null
+++ b/packages/web/utils/drawerItems.ts
@@ -0,0 +1,132 @@
+const MetaCalendarImageUrl = '/assets/drawer/calendar.png';
+const MetaDiscordImageUrl = '/assets/drawer/discord.png';
+const MetaGithubImageUrl = '/assets/drawer/github.png';
+const MetaGuildsImageUrl = '/assets/emojis/crossed-swords.png';
+const MetaSeedPoolImageUrl = '/assets/drawer/seed_pool.png';
+const MetaLeaderboardImageUrl = '/assets/drawer/leaderboard.png';
+const MetaLibraryImageUrl = '/assets/drawer/library.png';
+const MetaViewImageUrl = '/assets/drawer/metaview.png';
+const MetaNewsletterImageUrl = '/assets/drawer/newsletter.png';
+const MetaSeedmarketImageUrl = '/assets/drawer/seedmarket.png';
+const MetaTwitterImageUrl = '/assets/drawer/twitter.png';
+
+const MetaQuestsImageUrl = '/assets/drawer/quests.png';
+const MetaRaidsImageUrl = '/assets/drawer/raids.png';
+const MetaPlayersImageUrl = '/assets/drawer/players.png';
+const MetaForumImageUrl = '/assets/drawer/forum.png';
+
+export interface DrawerItemType {
+  href: string;
+  isExternal?: boolean;
+  src: string;
+  alt: string;
+  text?: string;
+}
+
+export const DrawerItemsLeft: DrawerItemType[] = [
+  {
+    href: '/',
+    isExternal: false,
+    src: MetaPlayersImageUrl,
+    alt: 'MetaPlayers',
+    text: 'Players',
+  },
+  {
+    href: '/guilds',
+    isExternal: false,
+    src: MetaGuildsImageUrl,
+    alt: 'MetaGuilds',
+    text: 'Guilds',
+  },
+];
+
+export const DrawerItemsRight: DrawerItemType[] = [
+  {
+    href: 'https://forum.metagame.wtf/',
+    isExternal: true,
+    src: MetaForumImageUrl,
+    alt: 'MetaForm',
+    text: 'Forum',
+  },
+  {
+    href:
+      'https://miro.com/app/live-embed/o9J_knhEt7w=/?moveToViewport=-8516,-5516,21788,13742',
+    isExternal: true,
+    src: MetaRaidsImageUrl,
+    alt: 'MetaRaids',
+    text: 'Raids',
+  },
+];
+
+export const DrawerSubItems: DrawerItemType[] = [
+  {
+    href: 'https://metagame.substack.com/',
+    isExternal: true,
+    src: MetaNewsletterImageUrl,
+    alt: 'MetaNewsletter',
+  },
+  {
+    href: 'https://anchor.fm/MetaGame/',
+    isExternal: true,
+    src: MetaViewImageUrl,
+    alt: 'MetaView',
+  },
+  {
+    href: 'https://wiki.metagame.wtf/docs/home',
+    isExternal: true,
+    src: MetaLibraryImageUrl,
+    alt: 'MetaLibrary',
+  },
+  {
+    href: 'https://twitter.com/Metafam',
+    isExternal: true,
+    src: MetaTwitterImageUrl,
+    alt: 'MetaTwitter',
+  },
+  {
+    href: 'https://discord.gg/XazuypRcv6',
+    isExternal: true,
+    src: MetaDiscordImageUrl,
+    alt: 'MetaDiscord',
+  },
+  {
+    href: 'https://github.com/MetaFam/TheGame',
+    isExternal: true,
+    src: MetaGithubImageUrl,
+    alt: 'MetaGithub',
+  },
+  {
+    href:
+      'https://calendar.google.com/calendar/u/1?cid=bmloNTlrdGdhZm1tNjRlZDRxazZ1ZTh2djRAZ3JvdXAuY2FsZW5kYXIuZ29vZ2xlLmNvbQ',
+    isExternal: true,
+    src: MetaCalendarImageUrl,
+    alt: 'MetaCalendar',
+  },
+  {
+    href:
+      'https://balancer.exchange/#/swap/ether/0x30cf203b48edaa42c3b4918e955fed26cd012a3f',
+    isExternal: true,
+    src: MetaSeedmarketImageUrl,
+    alt: 'MetaSeedmarket',
+  },
+  {
+    href:
+      'https://pools.balancer.exchange/#/pool/0xea05a15dbce2eb543ffda16950e95b2bd2e40d0e/',
+    isExternal: true,
+    src: MetaSeedPoolImageUrl,
+    alt: 'MetaSeedPool',
+  },
+  {
+    href: 'https://wiki.metagame.wtf/docs/enter-metagame/leaderboard',
+    isExternal: true,
+    src: MetaLeaderboardImageUrl,
+    alt: 'MetaLeaderboard',
+  },
+  {
+    href: 'https://discord.gg/WYUkVpe',
+    isExternal: true,
+    src: MetaQuestsImageUrl,
+    alt: 'MetaQuests',
+    text: 'Quests',
+  },
+];
diff --git a/yarn.lock b/yarn.lock
index e013822b..bc960825 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -238,6 +238,14 @@
     cross-fetch "3.0.6"
     lru-cache "6.0.0"
 
+"@ampproject/toolbox-core@^2.7.2":
+  version "2.7.2"
+  resolved "https://registry.yarnpkg.com/@ampproject/toolbox-core/-/toolbox-core-2.7.2.tgz#43acd7c1d0331be1db611d781d7dc2184c0aadb5"
+  integrity sha512-deQiuOghOShoEBoTIDNsSER5gMC6qZfVqYKvlQYcQ+OxKR7J3FtA5XDz98UQsuWx1EB2x2hivrpC6G9BQaXMHw==
+  dependencies:
+    lru-cache "6.0.0"
+    node-fetch "2.6.1"
+
 "@ampproject/toolbox-optimizer@2.6.0":
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/@ampproject/toolbox-optimizer/-/toolbox-optimizer-2.6.0.tgz#e1bde0697d0fb25ab888bc0d0422998abaf6bad1"
@@ -262,6 +270,30 @@
     postcss-safe-parser "4.0.2"
     terser "4.8.0"
 
+"@ampproject/toolbox-optimizer@2.7.0-alpha.1":
+  version "2.7.0-alpha.1"
+  resolved "https://registry.yarnpkg.com/@ampproject/toolbox-optimizer/-/toolbox-optimizer-2.7.0-alpha.1.tgz#ab4c386645f991e5da5a9d2967ed2bb734a9f6c4"
+  integrity sha512-2wTvOyM6GP6FrYQzxSQCg43STo1jMRGeDKa6YUkYXYH9fm9Wbt2wTRx+ajjb48JQ6WwUnGwga1MhQhVFzRQ+wQ==
+  dependencies:
+    "@ampproject/toolbox-core" "^2.6.0"
+    "@ampproject/toolbox-runtime-version" "^2.7.0-alpha.1"
+    "@ampproject/toolbox-script-csp" "^2.5.4"
+    "@ampproject/toolbox-validator-rules" "^2.5.4"
+    abort-controller "3.0.0"
+    cross-fetch "3.0.5"
+    cssnano-simple "1.2.0"
+    dom-serializer "1.0.1"
+    domhandler "3.0.0"
+    domutils "2.1.0"
+    htmlparser2 "4.1.0"
+    https-proxy-agent "5.0.0"
+    lru-cache "6.0.0"
+    node-fetch "2.6.0"
+    normalize-html-whitespace "1.0.0"
+    postcss "7.0.32"
+    postcss-safe-parser "4.0.2"
+    terser "5.1.0"
+
 "@ampproject/toolbox-runtime-version@^2.6.0":
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/@ampproject/toolbox-runtime-version/-/toolbox-runtime-version-2.6.0.tgz#c2a310840a6c60a7f5046d2ccaf45646a761bd4f"
@@ -269,6 +301,13 @@
   dependencies:
     "@ampproject/toolbox-core" "^2.6.0"
 
+"@ampproject/toolbox-runtime-version@^2.7.0-alpha.1":
+  version "2.7.2"
+  resolved "https://registry.yarnpkg.com/@ampproject/toolbox-runtime-version/-/toolbox-runtime-version-2.7.2.tgz#32d0867c4a0625b7fe0f2114df6669d9d2e63863"
+  integrity sha512-BKDl29i/cvC0xtrUHnF2YR25gMfyVnXCaV1ZaMDNcPNRJGbBSNQtW6eZt9+rPoV/hKpFxyJia30ECw42FVhh9g==
+  dependencies:
+    "@ampproject/toolbox-core" "^2.7.2"
+
 "@ampproject/toolbox-script-csp@^2.5.4":
   version "2.5.4"
   resolved "https://registry.yarnpkg.com/@ampproject/toolbox-script-csp/-/toolbox-script-csp-2.5.4.tgz#d8b7b91a678ae8f263cb36d9b74e441b7d633aad"
@@ -1769,6 +1808,13 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
+"@babel/runtime@7.12.5", "@babel/runtime@^7.12.5":
+  version "7.12.5"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.12.5.tgz#410e7e487441e1b360c29be715d870d9b985882e"
+  integrity sha512-plcc+hbExy3McchJCEQG3knOsuh3HH+Prx1P6cLIkET/0dLuQDEnrT+s27Axgc9bqfsmNUNHfscgMUdBpC9xfg==
+  dependencies:
+    regenerator-runtime "^0.13.4"
+
 "@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.10.0", "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.0", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.2", "@babel/runtime@^7.6.3", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
   version "7.12.1"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.12.1.tgz#b4116a6b6711d010b2dad3b7b6e43bf1b9954740"
@@ -1776,13 +1822,6 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
-"@babel/runtime@^7.12.5":
-  version "7.12.5"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.12.5.tgz#410e7e487441e1b360c29be715d870d9b985882e"
-  integrity sha512-plcc+hbExy3McchJCEQG3knOsuh3HH+Prx1P6cLIkET/0dLuQDEnrT+s27Axgc9bqfsmNUNHfscgMUdBpC9xfg==
-  dependencies:
-    regenerator-runtime "^0.13.4"
-
 "@babel/standalone@^7.4.5":
   version "7.12.2"
   resolved "https://registry.yarnpkg.com/@babel/standalone/-/standalone-7.12.2.tgz#af1068abf12c1b8296c655fdd4fce093e57f1a73"
@@ -2497,7 +2536,7 @@
   resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.8.0.tgz#bbbff68978fefdbe68ccb533bc8cbe1d1afb5413"
   integrity sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==
 
-"@emotion/is-prop-valid@0.8.8", "@emotion/is-prop-valid@^0.8.1", "@emotion/is-prop-valid@^0.8.6", "@emotion/is-prop-valid@^0.8.8":
+"@emotion/is-prop-valid@0.8.8", "@emotion/is-prop-valid@^0.8.1", "@emotion/is-prop-valid@^0.8.2", "@emotion/is-prop-valid@^0.8.6", "@emotion/is-prop-valid@^0.8.8":
   version "0.8.8"
   resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz#db28b1c4368a259b60a97311d6a952d4fd01ac1a"
   integrity sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==
@@ -4946,16 +4985,42 @@
   resolved "https://registry.yarnpkg.com/@multiformats/base-x/-/base-x-4.0.1.tgz#95ff0fa58711789d53aefb2590a8b7a4e715d121"
   integrity sha512-eMk0b9ReBbV23xXU693TAIrLyeO5iTgBZGSJfpqriG8UkYvr/hC9u9pyMlAakDNHWmbhMZCDs6KQO0jzKD8OTw==
 
+"@next/env@10.0.3":
+  version "10.0.3"
+  resolved "https://registry.yarnpkg.com/@next/env/-/env-10.0.3.tgz#ef1077d78bf500855576f83090d6fb1ec96272f8"
+  integrity sha512-xjJt2VXoSxAydskmt77nJuEtRL782E4ltaj5JtMzJ8YkNUMMu3d5ktpCR+Q3INKHF/RY6zHJ9QzyE3/s1ikbNg==
+
 "@next/env@9.5.5":
   version "9.5.5"
   resolved "https://registry.yarnpkg.com/@next/env/-/env-9.5.5.tgz#db993649ec6e619e34a36de90dc2baa52fc5280f"
   integrity sha512-N9wdjU6XoqLqNQWtrGiWtp1SUuJsYK1cNrZ24A6YD+4w5CNV5SkZX6aewKZCCLP5Y8UNfTij2FkJiSYUfBjX8g==
 
+"@next/polyfill-module@10.0.3":
+  version "10.0.3"
+  resolved "https://registry.yarnpkg.com/@next/polyfill-module/-/polyfill-module-10.0.3.tgz#507e99f6dd351dc4a6e45b63dbd397087ece459a"
+  integrity sha512-JaiycQZZbqViaMZgRGYcPIdCPDz+qRnqEGxbhQlrxyPaBaOtsrAEkGf1SS2wJZKa/ncxqWHMfSvizDcGcz/ygQ==
+
 "@next/polyfill-module@9.5.5":
   version "9.5.5"
   resolved "https://registry.yarnpkg.com/@next/polyfill-module/-/polyfill-module-9.5.5.tgz#d9c65679a66664ab4859078f58997113c9d01f10"
   integrity sha512-itqYFeHo3yN4ccpHq2uNFC2UVQm12K6DxUVwYdui9MJiiueT0pSGb2laYEjf/G5+vVq7M2vb+DkjkOkPMBVfeg==
 
+"@next/react-dev-overlay@10.0.3":
+  version "10.0.3"
+  resolved "https://registry.yarnpkg.com/@next/react-dev-overlay/-/react-dev-overlay-10.0.3.tgz#99f3151677747d8be08a9314fa7ab3611e8161b8"
+  integrity sha512-ykiKeUhTsMRoyyYnx4jM8xeOPfKGqQ7xgx2dNXOu4tbPpdivzjJp2+K6+xnqhTmZ7uxfFBV+b1OE1ZzA8qyX5Q==
+  dependencies:
+    "@babel/code-frame" "7.10.4"
+    ally.js "1.4.1"
+    anser "1.4.9"
+    chalk "4.0.0"
+    classnames "2.2.6"
+    data-uri-to-buffer "3.0.0"
+    shell-quote "1.7.2"
+    source-map "0.8.0-beta.0"
+    stacktrace-parser "0.1.10"
+    strip-ansi "6.0.0"
+
 "@next/react-dev-overlay@9.5.5":
   version "9.5.5"
   resolved "https://registry.yarnpkg.com/@next/react-dev-overlay/-/react-dev-overlay-9.5.5.tgz#11b36813d75c43b7bd9d5e478bded1ed5391d03a"
@@ -4972,6 +5037,11 @@
     stacktrace-parser "0.1.10"
     strip-ansi "6.0.0"
 
+"@next/react-refresh-utils@10.0.3":
+  version "10.0.3"
+  resolved "https://registry.yarnpkg.com/@next/react-refresh-utils/-/react-refresh-utils-10.0.3.tgz#276bec60eae18768f96baf8a52f668f657f50ab4"
+  integrity sha512-XtzzPX2R4+MIyu1waEQUo2tiNwWVEkmObA6pboRCDTPOs4Ri8ckaIE08lN5A5opyF6GVN+IEq/J8KQrgsePsZQ==
+
 "@next/react-refresh-utils@9.5.5":
   version "9.5.5"
   resolved "https://registry.yarnpkg.com/@next/react-refresh-utils/-/react-refresh-utils-9.5.5.tgz#fe559b5ca51c038cb7840e0d669a6d7ef01fe4eb"
@@ -7679,6 +7749,14 @@ adjust-sourcemap-loader@2.0.0:
     object-path "0.11.4"
     regex-parser "2.2.10"
 
+adjust-sourcemap-loader@3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/adjust-sourcemap-loader/-/adjust-sourcemap-loader-3.0.0.tgz#5ae12fb5b7b1c585e80bbb5a63ec163a1a45e61e"
+  integrity sha512-YBrGyT2/uVQ/c6Rr+t6ZJXniY03YtHGMJQYal368burRGYKqhx9qGTWqcBU5s1CwYY9E/ri63RYyG1IacMZtqw==
+  dependencies:
+    loader-utils "^2.0.0"
+    regex-parser "^2.2.11"
+
 aes-js@3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/aes-js/-/aes-js-3.0.0.tgz#e21df10ad6c2053295bcbb8dab40b09dbea87e4d"
@@ -9917,6 +9995,16 @@ browserslist@4.13.0:
     escalade "^3.0.1"
     node-releases "^1.1.58"
 
+browserslist@4.14.6:
+  version "4.14.6"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.14.6.tgz#97702a9c212e0c6b6afefad913d3a1538e348457"
+  integrity sha512-zeFYcUo85ENhc/zxHbiIp0LGzzTrE2Pv2JhxvS7kpUb9Q9D38kUX6Bie7pGutJ/5iF5rOxE7CepAuWD56xJ33A==
+  dependencies:
+    caniuse-lite "^1.0.30001154"
+    electron-to-chromium "^1.3.585"
+    escalade "^3.1.1"
+    node-releases "^1.1.65"
+
 browserslist@^3.2.6:
   version "3.2.8"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-3.2.8.tgz#b0005361d6471f0f5952797a76fc985f1f978fc6"
@@ -10332,6 +10420,11 @@ caniuse-lite@^1.0.30001035, caniuse-lite@^1.0.30001093, caniuse-lite@^1.0.300011
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001148.tgz#dc97c7ed918ab33bf8706ddd5e387287e015d637"
   integrity sha512-E66qcd0KMKZHNJQt9hiLZGE3J4zuTqE1OnU53miEVtylFbwOEmeA5OsRu90noZful+XGSQOni1aT2tiqu/9yYw==
 
+caniuse-lite@^1.0.30001154:
+  version "1.0.30001170"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001170.tgz#0088bfecc6a14694969e391cc29d7eb6362ca6a7"
+  integrity sha512-Dd4d/+0tsK0UNLrZs3CvNukqalnVTRrxb5mcQm8rHL49t7V5ZaTygwXkrq+FB+dVDf++4ri8eJnFEJAB8332PA==
+
 capital-case@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/capital-case/-/capital-case-1.0.3.tgz#339bd77e8fab6cf75111d4fca509b3edf7c117c8"
@@ -10518,7 +10611,7 @@ chokidar@2.1.8, chokidar@^2.1.8:
   optionalDependencies:
     fsevents "^1.2.7"
 
-chokidar@^3.3.0, chokidar@^3.4.0, chokidar@^3.4.1, chokidar@^3.4.2:
+chokidar@3.4.3, chokidar@^3.3.0, chokidar@^3.4.0, chokidar@^3.4.1, chokidar@^3.4.2:
   version "3.4.3"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.4.3.tgz#c1df38231448e45ca4ac588e6c79573ba6a57d5b"
   integrity sha512-DtM3g7juCXQxFVSNPNByEC2+NImtBuxQQvWlHunpJIS5Ocr0lG306cC7FCi7cEA0fzmybPUIl4txBIobk1gGOQ==
@@ -10856,7 +10949,7 @@ color-name@^1.0.0, color-name@~1.1.4:
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
   integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
 
-color-string@^1.5.2:
+color-string@^1.5.2, color-string@^1.5.4:
   version "1.5.4"
   resolved "https://registry.yarnpkg.com/color-string/-/color-string-1.5.4.tgz#dd51cd25cfee953d138fe4002372cc3d0e504cb6"
   integrity sha512-57yF5yt8Xa3czSEW1jfQDE79Idk0+AkN/4KWad6tbdxUmAs3MvjxlWSWD4deYytcRfoZ9nhKyFl1kj5tBvidbw==
@@ -10872,6 +10965,14 @@ color@3.1.2:
     color-convert "^1.9.1"
     color-string "^1.5.2"
 
+color@^3.1.2:
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/color/-/color-3.1.3.tgz#ca67fb4e7b97d611dcde39eceed422067d91596e"
+  integrity sha512-xgXAcTHa2HeFCGLE9Xs/R82hujGtu9Jd9x4NW3T34+OMs7VoPsjwzRczKHvTAHeJwWFwX5j15+MgAppE8ztObQ==
+  dependencies:
+    color-convert "^1.9.1"
+    color-string "^1.5.4"
+
 colorette@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.2.1.tgz#4d0b921325c14faf92633086a536db6e89564b1b"
@@ -11645,6 +11746,14 @@ cssnano-preset-simple@1.2.0:
     caniuse-lite "^1.0.30001093"
     postcss "^7.0.32"
 
+cssnano-preset-simple@1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/cssnano-preset-simple/-/cssnano-preset-simple-1.2.1.tgz#8976013114b1fc4718253d30f21aaed1780fb80e"
+  integrity sha512-B2KahOIFTV6dw5Ioy9jHshTh/vAYNnUB2enyWRgnAEg3oJBjI/035ExpePaMqS2SwpbH7gCgvQqwpMBH6hTJSw==
+  dependencies:
+    caniuse-lite "^1.0.30001093"
+    postcss "^7.0.32"
+
 cssnano-simple@1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/cssnano-simple/-/cssnano-simple-1.0.5.tgz#66ee528f3a4e60754e2625ea9f51ac315f5f0a92"
@@ -11661,6 +11770,14 @@ cssnano-simple@1.2.0:
     cssnano-preset-simple "1.2.0"
     postcss "^7.0.32"
 
+cssnano-simple@1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/cssnano-simple/-/cssnano-simple-1.2.1.tgz#6de5d9dd75774bc8f31767573410a952c7dd8a12"
+  integrity sha512-9vOyjw8Dj/T12kIOnXPZ5VnEIo6F3YMaIn0wqJXmn277R58cWpI3AvtdlCBtohX7VAUNYcyk2d0dKcXXkb5I6Q==
+  dependencies:
+    cssnano-preset-simple "1.2.1"
+    postcss "^7.0.32"
+
 cssom@0.3.x, "cssom@>= 0.3.2 < 0.4.0", cssom@~0.3.6:
   version "0.3.8"
   resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.3.8.tgz#9f1276f5b2b463f2114d3f2c75250af8c1a36f4a"
@@ -12069,6 +12186,13 @@ decompress-response@^4.2.0:
   dependencies:
     mimic-response "^2.0.0"
 
+decompress-response@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/decompress-response/-/decompress-response-6.0.0.tgz#ca387612ddb7e104bd16d85aab00d5ecf09c66fc"
+  integrity sha512-aW35yZM6Bb/4oJlZncMH2LCoZtJXTRxES17vE3hoRiowU2kWHaJKFkSBDnDR+cm9J+9QhXmREyIfv0pji9ejCQ==
+  dependencies:
+    mimic-response "^3.1.0"
+
 dedent@^0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/dedent/-/dedent-0.7.0.tgz#2495ddbaf6eb874abb0e1be9df22d2e5a544326c"
@@ -12781,10 +12905,10 @@ electron-to-chromium@^1.3.378, electron-to-chromium@^1.3.488, electron-to-chromi
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.582.tgz#1adfac5affce84d85b3d7b3dfbc4ade293a6ffc4"
   integrity sha512-0nCJ7cSqnkMC+kUuPs0YgklFHraWGl/xHqtZWWtOeVtyi+YqkoAOMGuZQad43DscXCQI/yizcTa3u6B5r+BLww==
 
-electron-to-chromium@^1.3.47:
-  version "1.3.627"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.627.tgz#4acdbbbbe31eb605fba8380063fd9c8a7e5ca4a0"
-  integrity sha512-O5IVRS4sCxP2+vECAp7uHkaI8V+dKYpuCyBcLn+hqVAOy/RONd8zx+6eH7TuWSTBYs/oUrzBXkNMZuVsQd58kQ==
+electron-to-chromium@^1.3.47, electron-to-chromium@^1.3.585:
+  version "1.3.629"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.629.tgz#a08d13b64d90e3c77ec5b9bffa3efbc5b4a00969"
+  integrity sha512-iSPPJtPvHrMAvYOt+9cdbDmTasPqwnwz4lkP8Dn200gDNUBQOLQ96xUsWXBwXslAo5XxdoXAoQQ3RAy4uao9IQ==
 
 electron-to-chromium@^1.3.621:
   version "1.3.626"
@@ -13630,7 +13754,7 @@ esutils@^2.0.2:
   resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64"
   integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==
 
-etag@~1.8.1:
+etag@1.8.1, etag@~1.8.1:
   version "1.8.1"
   resolved "https://registry.yarnpkg.com/etag/-/etag-1.8.1.tgz#41ae2eeb65efa62268aebfea83ac7d79299b0887"
   integrity sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc=
@@ -14801,6 +14925,24 @@ fragment-cache@^0.2.1:
   dependencies:
     map-cache "^0.2.2"
 
+framer-motion@^3.1.1:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/framer-motion/-/framer-motion-3.1.1.tgz#a8a779501213b7ce02cc35beb27621d73cc2f1e7"
+  integrity sha512-Gm1QSb0xUxuhcPar5FIs5Ws+STrhLZ6XZf2Io8dVwFofe1OzwkL9asGFVu7z3y6WqC4Hvnxm7wsW5SBHlxZDYw==
+  dependencies:
+    framesync "^5.0.0"
+    hey-listen "^1.0.8"
+    popmotion "^9.0.2"
+    style-value-types "^3.2.0"
+    tslib "^1.10.0"
+  optionalDependencies:
+    "@emotion/is-prop-valid" "^0.8.2"
+
+framesync@5.0.0, framesync@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/framesync/-/framesync-5.0.0.tgz#7de8caedf53ac441118e79680f1beb7391c328b6"
+  integrity sha512-wd8t+JsQGisluSv1twiEeDv0aNGpavGb9q7xgIk9fGbcIWkNXF/KVtrjnOrCwBWJuiXxlJfNkcvGudsI32FxYA==
+
 fresh@0.5.2:
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/fresh/-/fresh-0.5.2.tgz#3d8cadd90d976569fa835ab1f8e4b23a105605a7"
@@ -15778,6 +15920,11 @@ heap@~0.2.6:
   resolved "https://registry.yarnpkg.com/heap/-/heap-0.2.6.tgz#087e1f10b046932fc8594dd9e6d378afc9d1e5ac"
   integrity sha1-CH4fELBGky/IWU3Z5tN4r8nR5aw=
 
+hey-listen@^1.0.8:
+  version "1.0.8"
+  resolved "https://registry.yarnpkg.com/hey-listen/-/hey-listen-1.0.8.tgz#8e59561ff724908de1aa924ed6ecc84a56a9aa68"
+  integrity sha512-COpmrF2NOg4TBWUJ5UVyaCU2A88wEMkUPK4hNqyCkqHbxT92BbvfjoSozkAIIm6XhicGlJHhFdullInrdhwU8Q==
+
 highlight.js@^10.1.1, highlight.js@~10.4.0:
   version "10.4.1"
   resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-10.4.1.tgz#d48fbcf4a9971c4361b3f95f302747afe19dbad0"
@@ -19339,7 +19486,7 @@ kleur@^3.0.3:
   resolved "https://registry.yarnpkg.com/kleur/-/kleur-3.0.3.tgz#a79c9ecc86ee1ce3fa6206d1216c501f147fc07e"
   integrity sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==
 
-klona@^2.0.3:
+klona@^2.0.3, klona@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/klona/-/klona-2.0.4.tgz#7bb1e3affb0cb8624547ef7e8f6708ea2e39dfc0"
   integrity sha512-ZRbnvdg/NxqzC7L9Uyqzf4psi1OM4Cuc+sJAkQPjO6XkQIJTNbfK2Rsmbw8fx1p2mkZdp2FZYo2+LwXYY/uwIA==
@@ -20038,6 +20185,14 @@ libp2p@^0.27.7:
     timeout-abort-controller "^1.0.0"
     xsalsa20 "^1.0.2"
 
+line-column@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/line-column/-/line-column-1.0.2.tgz#d25af2936b6f4849172b312e4792d1d987bc34a2"
+  integrity sha1-0lryk2tvSEkXKzEuR5LR2Ye8NKI=
+  dependencies:
+    isarray "^1.0.0"
+    isobject "^2.0.0"
+
 lines-and-columns@^1.1.6:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.1.6.tgz#1c00c743b433cd0a4e80758f7b64a57440d9ff00"
@@ -21067,6 +21222,11 @@ mimic-response@^2.0.0:
   resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-2.1.0.tgz#d13763d35f613d09ec37ebb30bac0469c0ee8f43"
   integrity sha512-wXqjST+SLt7R009ySCglWBCFpjUygmCIfD790/kVbiGmUgfYGuB14PiTd5DwVxSV4NcYHjzMkoj5LjQZwTQLEA==
 
+mimic-response@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-3.1.0.tgz#2d1d59af9c1b129815accc2c46a022a5ce1fa3c9"
+  integrity sha512-z0yWI+4FDrrweS8Zmt4Ej5HdJmky15+L2e6Wgn3+iK5fWzb6T3fhNFq2+MeTRb064c6Wr4N/wv0DzQTjNzHNGQ==
+
 min-document@^2.19.0:
   version "2.19.0"
   resolved "https://registry.yarnpkg.com/min-document/-/min-document-2.19.0.tgz#7bd282e3f5842ed295bb748cdd9f1ffa2c824685"
@@ -21201,7 +21361,7 @@ mixin-deep@^1.2.0:
     for-in "^1.0.2"
     is-extendable "^1.0.1"
 
-mkdirp-classic@^0.5.2:
+mkdirp-classic@^0.5.2, mkdirp-classic@^0.5.3:
   version "0.5.3"
   resolved "https://registry.yarnpkg.com/mkdirp-classic/-/mkdirp-classic-0.5.3.tgz#fa10c9115cc6d8865be221ba47ee9bed78601113"
   integrity sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A==
@@ -21544,6 +21704,11 @@ nanoid@^3.0.2, nanoid@^3.1.12, nanoid@^3.1.3:
   resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.12.tgz#6f7736c62e8d39421601e4a0c77623a97ea69654"
   integrity sha512-1qstj9z5+x491jfiC4Nelk+f8XBad7LN20PmyWINJEMRSf3wcAjAWysw1qaA8z6NSKe2sjq1hRSDpBH5paCb6A==
 
+nanoid@^3.1.16:
+  version "3.1.20"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.20.tgz#badc263c6b1dcf14b71efaa85f6ab4c1d6cfc788"
+  integrity sha512-a1cQNyczgKbLX9jwbS/+d7W8fX/RfgYR7lVWwWOGIPNgK2m0MWvrGF6/m4kk6U3QcFMnZf3RIhL0v2Jgh/0Uxw==
+
 nanomatch@^1.2.9:
   version "1.2.13"
   resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119"
@@ -21654,6 +21819,58 @@ next-urql@2.0.0:
   dependencies:
     react-ssr-prepass "^1.2.1"
 
+next@^10.0.3:
+  version "10.0.3"
+  resolved "https://registry.yarnpkg.com/next/-/next-10.0.3.tgz#2bf9a1625dcd0afc8c31be19fc5516af68d99e80"
+  integrity sha512-QYCfjZgowjaLUFvyV8959SmkUZU/edFgHeiXNtWDv7kffo/oTm891p0KZAkk5cMIHcsDX3g3UuQdw/zmui783g==
+  dependencies:
+    "@ampproject/toolbox-optimizer" "2.7.0-alpha.1"
+    "@babel/runtime" "7.12.5"
+    "@hapi/accept" "5.0.1"
+    "@next/env" "10.0.3"
+    "@next/polyfill-module" "10.0.3"
+    "@next/react-dev-overlay" "10.0.3"
+    "@next/react-refresh-utils" "10.0.3"
+    ast-types "0.13.2"
+    babel-plugin-transform-define "2.0.0"
+    babel-plugin-transform-react-remove-prop-types "0.4.24"
+    browserslist "4.14.6"
+    buffer "5.6.0"
+    caniuse-lite "^1.0.30001113"
+    chalk "2.4.2"
+    chokidar "3.4.3"
+    crypto-browserify "3.12.0"
+    css-loader "4.3.0"
+    cssnano-simple "1.2.1"
+    etag "1.8.1"
+    find-cache-dir "3.3.1"
+    jest-worker "24.9.0"
+    loader-utils "2.0.0"
+    native-url "0.3.4"
+    node-fetch "2.6.1"
+    node-html-parser "1.4.9"
+    path-browserify "1.0.1"
+    pnp-webpack-plugin "1.6.4"
+    postcss "8.1.7"
+    process "0.11.10"
+    prop-types "15.7.2"
+    raw-body "2.4.1"
+    react-is "16.13.1"
+    react-refresh "0.8.3"
+    resolve-url-loader "3.1.2"
+    sass-loader "10.0.5"
+    schema-utils "2.7.1"
+    stream-browserify "3.0.0"
+    style-loader "1.2.1"
+    styled-jsx "3.3.2"
+    use-subscription "1.5.1"
+    vm-browserify "1.1.2"
+    watchpack "2.0.0-beta.13"
+    webpack "4.44.1"
+    webpack-sources "1.4.3"
+  optionalDependencies:
+    sharp "0.26.2"
+
 next@latest:
   version "9.5.5"
   resolved "https://registry.yarnpkg.com/next/-/next-9.5.5.tgz#37a37095e7c877ed6c94ba82e34ab9ed02b4eb33"
@@ -21763,6 +21980,11 @@ node-addon-api@^2.0.0:
   resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-2.0.2.tgz#432cfa82962ce494b132e9d72a15b29f71ff5d32"
   integrity sha512-Ntyt4AIXyaLIuMHF6IOoTakB3K+RWxwtsHNRxllEoA6vPwP9o4866g6YWDLUdnucilZhmkxiHwHr11gAENw+QA==
 
+node-addon-api@^3.0.2:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-3.1.0.tgz#98b21931557466c6729e51cb77cd39c965f42239"
+  integrity sha512-flmrDNB06LIl5lywUz7YlNGZH/5p0M7W28k8hzd9Lshtdh1wshD2Y+U4h9LD6KObOy1f+fEVdgprPrEymjM5uw==
+
 node-dir@^0.1.10, node-dir@^0.1.17:
   version "0.1.17"
   resolved "https://registry.yarnpkg.com/node-dir/-/node-dir-0.1.17.tgz#5f5665d93351335caabef8f1c554516cf5f1e4e5"
@@ -21839,6 +22061,13 @@ node-gyp@^5.0.2:
     tar "^4.4.12"
     which "^1.3.1"
 
+node-html-parser@1.4.9:
+  version "1.4.9"
+  resolved "https://registry.yarnpkg.com/node-html-parser/-/node-html-parser-1.4.9.tgz#3c8f6cac46479fae5800725edb532e9ae8fd816c"
+  integrity sha512-UVcirFD1Bn0O+TSmloHeHqZZCxHjvtIeGdVdGMhyZ8/PWlEiZaZ5iJzR189yKZr8p0FXN58BUeC7RHRkf/KYGw==
+  dependencies:
+    he "1.2.0"
+
 node-html-parser@^1.2.19:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/node-html-parser/-/node-html-parser-1.3.1.tgz#f58e55a029b51deae8924312be9817ef5cf5ed96"
@@ -21939,7 +22168,7 @@ node-releases@^1.1.52, node-releases@^1.1.58, node-releases@^1.1.61:
   resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.63.tgz#db6dbb388544c31e888216304e8fd170efee3ff5"
   integrity sha512-ukW3iCfQaoxJkSPN+iK7KznTeqDGVJatAEuXsJERYHa9tn/KaT5lBdIyxQjLEVTzSkyjJEuQ17/vaEjrOauDkg==
 
-node-releases@^1.1.67:
+node-releases@^1.1.65, node-releases@^1.1.67:
   version "1.1.67"
   resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.67.tgz#28ebfcccd0baa6aad8e8d4d8fe4cbc49ae239c12"
   integrity sha512-V5QF9noGFl3EymEwUYzO+3NTDpGfQB4ve6Qfnzf3UNydMhjQRVPR1DZTuvWiLzaFJYw2fmDwAfnRNEVb64hSIg==
@@ -23422,6 +23651,16 @@ polished@^3.3.1, polished@^3.4.4:
   dependencies:
     "@babel/runtime" "^7.9.2"
 
+popmotion@^9.0.2:
+  version "9.0.2"
+  resolved "https://registry.yarnpkg.com/popmotion/-/popmotion-9.0.2.tgz#477650c3b4af97161011809223d9ca6860f3a2b5"
+  integrity sha512-WfSg8IfoUwYIP9uqeqbgncIsMHLAKWqebT2IP1aGAI6gdSJqTPy/H8NvP4ZyDtDCUCx5Yh3Pth/7iUJjIwR7LA==
+  dependencies:
+    framesync "5.0.0"
+    hey-listen "^1.0.8"
+    style-value-types "3.2.0"
+    tslib "^1.10.0"
+
 popper.js@1.16.1-lts:
   version "1.16.1-lts"
   resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.16.1-lts.tgz#cf6847b807da3799d80ee3d6d2f90df8a3f50b05"
@@ -23550,6 +23789,16 @@ postcss@7.0.32:
     source-map "^0.6.1"
     supports-color "^6.1.0"
 
+postcss@8.1.7:
+  version "8.1.7"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.1.7.tgz#ff6a82691bd861f3354fd9b17b2332f88171233f"
+  integrity sha512-llCQW1Pz4MOPwbZLmOddGM9eIJ8Bh7SZ2Oj5sxZva77uVaotYDsYTch1WBTNu7fUY0fpWp0fdt7uW40D4sRiiQ==
+  dependencies:
+    colorette "^1.2.1"
+    line-column "^1.0.2"
+    nanoid "^3.1.16"
+    source-map "^0.6.1"
+
 postcss@^7.0.0, postcss@^7.0.14, postcss@^7.0.26, postcss@^7.0.32, postcss@^7.0.5, postcss@^7.0.6:
   version "7.0.35"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.35.tgz#d2be00b998f7f211d8a276974079f2e92b970e24"
@@ -23592,6 +23841,27 @@ prebuild-install@^5.3.3:
     tunnel-agent "^0.6.0"
     which-pm-runs "^1.0.0"
 
+prebuild-install@^5.3.5:
+  version "5.3.6"
+  resolved "https://registry.yarnpkg.com/prebuild-install/-/prebuild-install-5.3.6.tgz#7c225568d864c71d89d07f8796042733a3f54291"
+  integrity sha512-s8Aai8++QQGi4sSbs/M1Qku62PFK49Jm1CbgXklGz4nmHveDq0wzJkg7Na5QbnO1uNH8K7iqx2EQ/mV0MZEmOg==
+  dependencies:
+    detect-libc "^1.0.3"
+    expand-template "^2.0.3"
+    github-from-package "0.0.0"
+    minimist "^1.2.3"
+    mkdirp-classic "^0.5.3"
+    napi-build-utils "^1.0.1"
+    node-abi "^2.7.0"
+    noop-logger "^0.1.1"
+    npmlog "^4.0.1"
+    pump "^3.0.0"
+    rc "^1.2.7"
+    simple-get "^3.0.3"
+    tar-fs "^2.0.0"
+    tunnel-agent "^0.6.0"
+    which-pm-runs "^1.0.0"
+
 precond@0.2:
   version "0.2.3"
   resolved "https://registry.yarnpkg.com/precond/-/precond-0.2.3.tgz#aa9591bcaa24923f1e0f4849d240f47efc1075ac"
@@ -24298,7 +24568,7 @@ raw-body@2.4.0:
     iconv-lite "0.4.24"
     unpipe "1.0.0"
 
-raw-body@^2.4.1:
+raw-body@2.4.1, raw-body@^2.4.1:
   version "2.4.1"
   resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.4.1.tgz#30ac82f98bb5ae8c152e67149dac8d55153b168c"
   integrity sha512-9WmIKF6mkvA0SLmA2Knm9+qj89e+j1zqgyn8aXGd7+nAduPoqgI9lO57SAZNn/Byzo5P7JhXTyg9PzaJbH73bA==
@@ -25273,6 +25543,11 @@ regex-parser@2.2.10:
   resolved "https://registry.yarnpkg.com/regex-parser/-/regex-parser-2.2.10.tgz#9e66a8f73d89a107616e63b39d4deddfee912b37"
   integrity sha512-8t6074A68gHfU8Neftl0Le6KTDwfGAj7IyjPIMSfikI2wJUTHDMaIq42bUsfVnj8mhx0R+45rdUXHGpN164avA==
 
+regex-parser@^2.2.11:
+  version "2.2.11"
+  resolved "https://registry.yarnpkg.com/regex-parser/-/regex-parser-2.2.11.tgz#3b37ec9049e19479806e878cabe7c1ca83ccfe58"
+  integrity sha512-jbD/FT0+9MBU2XAZluI7w2OBs1RBi6p9M83nkoZayQXXU9e8Robt69FcZc7wU4eJD/YFTjn1JdCk3rbMJajz8Q==
+
 regexp.prototype.flags@^1.2.0, regexp.prototype.flags@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.3.0.tgz#7aba89b3c13a64509dabcf3ca8d9fbb9bdf5cb75"
@@ -25664,6 +25939,22 @@ resolve-url-loader@3.1.1:
     rework-visit "1.0.0"
     source-map "0.6.1"
 
+resolve-url-loader@3.1.2:
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/resolve-url-loader/-/resolve-url-loader-3.1.2.tgz#235e2c28e22e3e432ba7a5d4e305c59a58edfc08"
+  integrity sha512-QEb4A76c8Mi7I3xNKXlRKQSlLBwjUV/ULFMP+G7n3/7tJZ8MG5wsZ3ucxP1Jz8Vevn6fnJsxDx9cIls+utGzPQ==
+  dependencies:
+    adjust-sourcemap-loader "3.0.0"
+    camelcase "5.3.1"
+    compose-function "3.0.3"
+    convert-source-map "1.7.0"
+    es6-iterator "2.0.3"
+    loader-utils "1.2.3"
+    postcss "7.0.21"
+    rework "1.0.1"
+    rework-visit "1.0.0"
+    source-map "0.6.1"
+
 resolve-url@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
@@ -26006,6 +26297,17 @@ sass-loader@10.0.2:
     schema-utils "^2.7.1"
     semver "^7.3.2"
 
+sass-loader@10.0.5:
+  version "10.0.5"
+  resolved "https://registry.yarnpkg.com/sass-loader/-/sass-loader-10.0.5.tgz#f53505b5ddbedf43797470ceb34066ded82bb769"
+  integrity sha512-2LqoNPtKkZq/XbXNQ4C64GFEleSEHKv6NPSI+bMC/l+jpEXGJhiRYkAQToO24MR7NU4JRY2RpLpJ/gjo2Uf13w==
+  dependencies:
+    klona "^2.0.4"
+    loader-utils "^2.0.0"
+    neo-async "^2.6.2"
+    schema-utils "^3.0.0"
+    semver "^7.3.2"
+
 sax@>=0.6.0, sax@^1.2.4:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
@@ -26281,6 +26583,21 @@ shallowequal@^1.1.0:
   resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
   integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
 
+sharp@0.26.2:
+  version "0.26.2"
+  resolved "https://registry.yarnpkg.com/sharp/-/sharp-0.26.2.tgz#3d5777d246ae32890afe82a783c1cbb98456a88c"
+  integrity sha512-bGBPCxRAvdK9bX5HokqEYma4j/Q5+w8Nrmb2/sfgQCLEUx/HblcpmOfp59obL3+knIKnOhyKmDb4tEOhvFlp6Q==
+  dependencies:
+    color "^3.1.2"
+    detect-libc "^1.0.3"
+    node-addon-api "^3.0.2"
+    npmlog "^4.1.2"
+    prebuild-install "^5.3.5"
+    semver "^7.3.2"
+    simple-get "^4.0.0"
+    tar-fs "^2.1.0"
+    tunnel-agent "^0.6.0"
+
 shebang-command@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-1.2.0.tgz#44aac65b695b03398968c39f363fee5deafdf1ea"
@@ -26379,6 +26696,15 @@ simple-get@^3.0.3:
     once "^1.3.1"
     simple-concat "^1.0.0"
 
+simple-get@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/simple-get/-/simple-get-4.0.0.tgz#73fa628278d21de83dadd5512d2cc1f4872bd675"
+  integrity sha512-ZalZGexYr3TA0SwySsr5HlgOOinS4Jsa8YB2GJ6lUNAazyAu4KG/VmzMTwAt2YVXzzVj8QmefmAonZIK2BSGcQ==
+  dependencies:
+    decompress-response "^6.0.0"
+    once "^1.3.1"
+    simple-concat "^1.0.0"
+
 simple-peer@^9.6.0:
   version "9.7.2"
   resolved "https://registry.yarnpkg.com/simple-peer/-/simple-peer-9.7.2.tgz#8cd9cb156bf456ad9c3d379119f0c39dfb3b20f7"
@@ -27315,6 +27641,14 @@ style-to-object@0.3.0, style-to-object@^0.3.0:
   dependencies:
     inline-style-parser "0.1.1"
 
+style-value-types@3.2.0, style-value-types@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/style-value-types/-/style-value-types-3.2.0.tgz#eb89cab1340823fa7876f3e289d29d99c92111bb"
+  integrity sha512-ih0mGsrYYmVvdDi++/66O6BaQPRPRMQHoZevNNdMMcPlP/cH28Rnfsqf1UEba/Bwfuw9T8BmIMwbGdzsPwQKrQ==
+  dependencies:
+    hey-listen "^1.0.8"
+    tslib "^1.10.0"
+
 styled-components@^5.1.1:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-5.2.0.tgz#6dcb5aa8a629c84b8d5ab34b7167e3e0c6f7ed74"
@@ -27345,6 +27679,20 @@ styled-jsx@3.3.0:
     stylis "3.5.4"
     stylis-rule-sheet "0.0.10"
 
+styled-jsx@3.3.2:
+  version "3.3.2"
+  resolved "https://registry.yarnpkg.com/styled-jsx/-/styled-jsx-3.3.2.tgz#2474601a26670a6049fb4d3f94bd91695b3ce018"
+  integrity sha512-daAkGd5mqhbBhLd6jYAjYBa9LpxYCzsgo/f6qzPdFxVB8yoGbhxvzQgkC0pfmCVvW3JuAEBn0UzFLBfkHVZG1g==
+  dependencies:
+    "@babel/types" "7.8.3"
+    babel-plugin-syntax-jsx "6.18.0"
+    convert-source-map "1.7.0"
+    loader-utils "1.2.3"
+    source-map "0.7.3"
+    string-hash "1.1.3"
+    stylis "3.5.4"
+    stylis-rule-sheet "0.0.10"
+
 styled-system@5.1.5, styled-system@^5.1.5:
   version "5.1.5"
   resolved "https://registry.yarnpkg.com/styled-system/-/styled-system-5.1.5.tgz#e362d73e1dbb5641a2fd749a6eba1263dc85075e"
@@ -27512,7 +27860,17 @@ tar-fs@^2.0.0:
     pump "^3.0.0"
     tar-stream "^2.0.0"
 
-tar-stream@^2.0.0:
+tar-fs@^2.1.0:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/tar-fs/-/tar-fs-2.1.1.tgz#489a15ab85f1f0befabb370b7de4f9eb5cbe8784"
+  integrity sha512-V0r2Y9scmbDRLCNex/+hYzvp/zyYjvFbHPNgVTKfQvVrb6guiE/fxP+XblDNR011utopbkex2nM4dHNV6GDsng==
+  dependencies:
+    chownr "^1.1.1"
+    mkdirp-classic "^0.5.2"
+    pump "^3.0.0"
+    tar-stream "^2.1.4"
+
+tar-stream@^2.0.0, tar-stream@^2.1.4:
   version "2.1.4"
   resolved "https://registry.yarnpkg.com/tar-stream/-/tar-stream-2.1.4.tgz#c4fb1a11eb0da29b893a5b25476397ba2d053bfa"
   integrity sha512-o3pS2zlG4gxr67GmFYBLlq+dM8gyRGUOvsrHclSkvtVtQbjV0s/+ZE8OpICbaj8clrX3tjeHngYGP7rweaBnuw==
@@ -27679,6 +28037,15 @@ terser@4.8.0, terser@^4.1.2, terser@^4.6.2, terser@^4.6.3, terser@^4.8.0:
     source-map "~0.6.1"
     source-map-support "~0.5.12"
 
+terser@5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/terser/-/terser-5.1.0.tgz#1f4ab81c8619654fdded51f3157b001e1747281d"
+  integrity sha512-pwC1Jbzahz1ZPU87NQ8B3g5pKbhyJSiHih4gLH6WZiPU8mmS1IlGbB0A2Nuvkj/LCNsgIKctg6GkYwWCeTvXZQ==
+  dependencies:
+    commander "^2.20.0"
+    source-map "~0.6.1"
+    source-map-support "~0.5.12"
+
 terser@^5.2.0:
   version "5.3.5"
   resolved "https://registry.yarnpkg.com/terser/-/terser-5.3.5.tgz#9e080baa0568f96654621b20eb9effa440b1484e"
@@ -29006,6 +29373,13 @@ use-subscription@1.4.1:
   dependencies:
     object-assign "^4.1.1"
 
+use-subscription@1.5.1:
+  version "1.5.1"
+  resolved "https://registry.yarnpkg.com/use-subscription/-/use-subscription-1.5.1.tgz#73501107f02fad84c6dd57965beb0b75c68c42d1"
+  integrity sha512-Xv2a1P/yReAjAbhylMfFplFKj9GssgTwN7RlcTxBujFQcloStWNDQdc4g4NRWH9xS4i/FDk04vQBptAXoF3VcA==
+  dependencies:
+    object-assign "^4.1.1"
+
 use@^3.1.0:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/use/-/use-3.1.1.tgz#d50c8cac79a19fbc20f2911f56eb973f4e10070f"