diff --git a/components/CollectionCard.tsx b/components/CollectionCard.tsx
index 622e066..9a82380 100644
--- a/components/CollectionCard.tsx
+++ b/components/CollectionCard.tsx
@@ -10,11 +10,12 @@ import CollectionModal from "@/components/Modal/Collection";
 import ProfilePhoto from "./ProfilePhoto";
 import { faCalendarDays } from "@fortawesome/free-regular-svg-icons";
 
-export default function CollectionCard({
-  collection,
-}: {
+type Props = {
   collection: CollectionIncludingMembers;
-}) {
+  className?: string;
+};
+
+export default function CollectionCard({ collection, className }: Props) {
   const { links } = useLinkStore();
   const formattedDate = new Date(collection.createdAt as string).toLocaleString(
     "en-US",
@@ -43,7 +44,9 @@ export default function CollectionCard({
   };
 
   return (
-    <div className="bg-gradient-to-tr from-sky-100 from-10% via-gray-100 via-20% self-stretch min-h-[12rem] rounded-2xl shadow duration-100 hover:shadow-none group relative">
+    <div
+      className={`bg-gradient-to-tr from-sky-100 from-10% via-gray-100 via-20% to-white to-100% self-stretch min-h-[12rem] rounded-2xl shadow duration-100 hover:shadow-none group relative ${className}`}
+    >
       <div
         onClick={() => setExpandDropdown(!expandDropdown)}
         id={"expand-dropdown" + collection.id}
@@ -55,43 +58,41 @@ export default function CollectionCard({
           className="w-5 h-5 text-gray-500"
         />
       </div>
-      <Link href={`/collections/${collection.id}`}>
-        <div className="flex flex-col gap-2 justify-between h-full select-none p-5 cursor-pointer">
-          <p className="text-2xl font-bold capitalize bg-gradient-to-tr from-sky-500 to-slate-400 bg-clip-text text-transparent break-words w-4/5">
-            {collection.name}
-          </p>
-          <div className="flex justify-between items-center">
-            <div className="text-sky-400 flex items-center w-full">
-              {collection.members
-                .sort((a, b) => (a.userId as number) - (b.userId as number))
-                .map((e, i) => {
-                  return (
-                    <ProfilePhoto
-                      key={i}
-                      src={`/api/avatar/${e.userId}`}
-                      className="-mr-3"
-                    />
-                  );
-                })
-                .slice(0, 4)}
-              {collection.members.length - 4 > 0 ? (
-                <div className="h-10 w-10 text-white flex items-center justify-center rounded-full border-[3px] bg-sky-500 border-sky-100 -mr-3">
-                  +{collection.members.length - 4}
-                </div>
-              ) : null}
+      <Link
+        href={`/collections/${collection.id}`}
+        className="flex flex-col gap-2 justify-between min-h-[12rem] h-full select-none p-5"
+      >
+        <p className="text-2xl font-bold capitalize text-sky-500 break-words line-clamp-3 w-4/5">
+          {collection.name}
+        </p>
+        <div className="flex justify-between items-center">
+          <div className="text-sky-400 flex items-center w-full">
+            {collection.members
+              .sort((a, b) => (a.userId as number) - (b.userId as number))
+              .map((e, i) => {
+                return (
+                  <ProfilePhoto
+                    key={i}
+                    src={`/api/avatar/${e.userId}`}
+                    className="-mr-3"
+                  />
+                );
+              })
+              .slice(0, 4)}
+            {collection.members.length - 4 > 0 ? (
+              <div className="h-10 w-10 text-white flex items-center justify-center rounded-full border-[3px] bg-sky-500 border-sky-100 -mr-3">
+                +{collection.members.length - 4}
+              </div>
+            ) : null}
+          </div>
+          <div className="text-right w-40">
+            <div className="text-sky-500 font-bold text-sm flex justify-end gap-1 items-center">
+              <FontAwesomeIcon icon={faLink} className="w-5 h-5 text-sky-600" />
+              {links.filter((e) => e.collectionId === collection.id).length}
             </div>
-            <div className="text-right w-40">
-              <div className="text-sky-500 font-bold text-sm flex justify-end gap-1 items-center">
-                <FontAwesomeIcon
-                  icon={faLink}
-                  className="w-5 h-5 text-sky-600"
-                />
-                {links.filter((e) => e.collectionId === collection.id).length}
-              </div>
-              <div className="flex items-center justify-end gap-1 text-gray-600">
-                <FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" />
-                <p className="font-bold text-xs">{formattedDate}</p>
-              </div>
+            <div className="flex items-center justify-end gap-1 text-gray-600">
+              <FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" />
+              <p className="font-bold text-xs">{formattedDate}</p>
             </div>
           </div>
         </div>
diff --git a/components/LinkCard.tsx b/components/LinkCard.tsx
index 6d53b04..3f9512c 100644
--- a/components/LinkCard.tsx
+++ b/components/LinkCard.tsx
@@ -21,9 +21,10 @@ import useCollectionStore from "@/store/collections";
 type Props = {
   link: LinkIncludingCollectionAndTags;
   count: number;
+  className?: string;
 };
 
-export default function LinkCard({ link, count }: Props) {
+export default function LinkCard({ link, count, className }: Props) {
   const [expandDropdown, setExpandDropdown] = useState(false);
   const [editModal, setEditModal] = useState(false);
 
@@ -60,159 +61,169 @@ export default function LinkCard({ link, count }: Props) {
   };
 
   return (
-    <div className="bg-gradient-to-tr from-slate-200 from-10% to-gray-50 via-20% shadow-sm p-5 rounded-2xl flex items-start relative gap-5 sm:gap-10 group/item">
-      {editModal ? (
-        <Modal toggleModal={toggleEditModal}>
-          <LinkModal
-            toggleLinkModal={toggleEditModal}
-            activeLink={link}
-            method="UPDATE"
-          />
-        </Modal>
-      ) : null}
+    <div
+      className={`bg-gradient-to-tr from-slate-200 from-10% to-gray-50 via-20% shadow-sm p-5 rounded-2xl relative group/item ${className}`}
+    >
+      <div className="flex items-start gap-5 sm:gap-10 h-full w-full">
+        {editModal ? (
+          <Modal toggleModal={toggleEditModal}>
+            <LinkModal
+              toggleLinkModal={toggleEditModal}
+              activeLink={link}
+              method="UPDATE"
+            />
+          </Modal>
+        ) : null}
 
-      <Image
-        src={`https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${url.origin}&size=32`}
-        width={42}
-        height={42}
-        alt=""
-        className="select-none mt-3 z-10 rounded-full shadow border-[3px] border-white bg-white"
-        draggable="false"
-        onError={(e) => {
-          const target = e.target as HTMLElement;
-          target.style.opacity = "0";
-        }}
-      />
-      <Image
-        src={`https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${url.origin}&size=32`}
-        width={80}
-        height={80}
-        alt=""
-        className="blur-sm absolute left-2 opacity-40 select-none hidden sm:block"
-        draggable="false"
-        onError={(e) => {
-          const target = e.target as HTMLElement;
-          target.style.opacity = "0";
-        }}
-      />
-      <div className="flex justify-between gap-5 w-full h-full z-0">
-        <div className="flex flex-col justify-between">
-          <div className="flex items-baseline gap-1">
-            <p className="text-sm text-sky-400 font-bold">{count + 1}.</p>
-            <p className="text-lg text-sky-500 font-bold">{link.name}</p>
-          </div>
-          <p className="text-gray-500 text-sm font-medium">{link.title}</p>
-          <div className="flex gap-3 items-center flex-wrap my-3">
-            <Link href={`/collections/${link.collection.id}`}>
-              <div className="flex items-center gap-1 cursor-pointer hover:opacity-60 duration-100">
-                <FontAwesomeIcon
-                  icon={faFolder}
-                  className="w-4 h-4 mt-1 drop-shadow"
-                  style={{ color: collection?.color }}
-                />
-                <p className="text-sky-900">{collection?.name}</p>
-              </div>
-            </Link>
-
-            <div className="flex gap-1 items-center flex-wrap mt-1">
-              {link.tags.map((e, i) => (
-                <Link key={i} href={`/tags/${e.id}`}>
-                  <p className="px-2 py-1 bg-sky-200 text-sky-700 text-xs rounded-3xl cursor-pointer hover:opacity-60 duration-100">
-                    {e.name}
+        <Image
+          src={`https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${url.origin}&size=32`}
+          width={42}
+          height={42}
+          alt=""
+          className="select-none mt-3 z-10 rounded-full shadow border-[3px] border-white bg-white"
+          draggable="false"
+          onError={(e) => {
+            const target = e.target as HTMLElement;
+            target.style.opacity = "0";
+          }}
+        />
+        <Image
+          src={`https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${url.origin}&size=32`}
+          width={80}
+          height={80}
+          alt=""
+          className="blur-sm absolute left-2 opacity-40 select-none hidden sm:block"
+          draggable="false"
+          onError={(e) => {
+            const target = e.target as HTMLElement;
+            target.style.opacity = "0";
+          }}
+        />
+        <div className="flex justify-between gap-5 w-full h-full z-0">
+          <div className="flex flex-col justify-between w-full">
+            <div className="flex items-baseline gap-1">
+              <p className="text-sm text-sky-400 font-bold">{count + 1}.</p>
+              <p className="text-lg text-sky-500 font-bold truncate max-w-[12rem]">
+                {link.name}
+              </p>
+            </div>
+            <p className="text-gray-500 text-sm font-medium line-clamp-3 w-4/5">
+              {link.title}
+            </p>
+            <div className="flex gap-3 items-center flex-wrap my-3">
+              <Link href={`/collections/${link.collection.id}`}>
+                <div className="flex items-center gap-1 cursor-pointer hover:opacity-60 duration-100">
+                  <FontAwesomeIcon
+                    icon={faFolder}
+                    className="w-4 h-4 mt-1 drop-shadow"
+                    style={{ color: collection?.color }}
+                  />
+                  <p className="text-sky-900 truncate max-w-[10rem]">
+                    {collection?.name}
                   </p>
-                </Link>
-              ))}
-            </div>
-          </div>
-          <div className="flex gap-2 items-center flex-wrap">
-            <p className="text-gray-500">{formattedDate}</p>
-            <a
-              href={link.url}
-              target="_blank"
-              rel="noreferrer"
-              className="group/url"
-            >
-              <div className="text-sky-400 font-bold flex items-center gap-1">
-                <p>{url.host}</p>
-                <FontAwesomeIcon
-                  icon={faArrowUpRightFromSquare}
-                  className="w-3 opacity-0 group-hover/url:opacity-100 duration-75"
-                />
+                </div>
+              </Link>
+
+              <div className="flex gap-1 items-center flex-wrap mt-1">
+                {link.tags.map((e, i) => (
+                  <Link key={i} href={`/tags/${e.id}`}>
+                    <p className="px-2 py-1 bg-sky-200 text-sky-700 text-xs rounded-3xl cursor-pointer hover:opacity-60 duration-100 truncate max-w-[10rem]">
+                      {e.name}
+                    </p>
+                  </Link>
+                ))}
               </div>
-            </a>
-          </div>
-        </div>
-
-        <div className="flex flex-col justify-between items-end relative">
-          <div
-            onClick={() => setExpandDropdown(!expandDropdown)}
-            id={"expand-dropdown" + link.id}
-            className="text-gray-500 inline-flex rounded-md cursor-pointer hover:bg-slate-200 duration-100 p-1"
-          >
-            <FontAwesomeIcon
-              icon={faEllipsis}
-              title="More"
-              className="w-5 h-5"
-              id={"expand-dropdown" + link.id}
-            />
-          </div>
-          <div className="relative">
-            <div className="flex flex-col items-end justify-center gap-1">
+            </div>
+            <div className="flex gap-2 items-center flex-wrap">
+              <p className="text-gray-500">{formattedDate}</p>
               <a
-                href={`/api/archives/${link.collectionId}/${encodeURIComponent(
-                  link.screenshotPath
-                )}`}
+                href={link.url}
                 target="_blank"
                 rel="noreferrer"
-                title="Screenshot"
+                className="group/url"
               >
-                <FontAwesomeIcon
-                  icon={faFileImage}
-                  className="w-5 h-5 text-sky-600 cursor-pointer hover:text-sky-500 duration-100"
-                />
-              </a>
-              <a
-                href={`/api/archives/${link.collectionId}/${encodeURIComponent(
-                  link.pdfPath
-                )}`}
-                target="_blank"
-                rel="noreferrer"
-                title="PDF"
-              >
-                <FontAwesomeIcon
-                  icon={faFilePdf}
-                  className="w-5 h-5 text-sky-600 cursor-pointer hover:text-sky-500 duration-100"
-                />
+                <div className="text-sky-400 font-bold flex items-center gap-1">
+                  <p className="truncate w-40">{url.host}</p>
+                  <FontAwesomeIcon
+                    icon={faArrowUpRightFromSquare}
+                    className="w-3 opacity-0 group-hover/url:opacity-100 duration-75"
+                  />
+                </div>
               </a>
             </div>
           </div>
 
-          {expandDropdown ? (
-            <Dropdown
-              items={[
-                {
-                  name: "Edit",
-                  onClick: () => {
-                    setEditModal(true);
-                    setExpandDropdown(false);
+          <div className="flex flex-col justify-between items-end relative">
+            <div
+              onClick={() => setExpandDropdown(!expandDropdown)}
+              id={"expand-dropdown" + link.id}
+              className="text-gray-500 inline-flex rounded-md cursor-pointer hover:bg-slate-200 duration-100 p-1"
+            >
+              <FontAwesomeIcon
+                icon={faEllipsis}
+                title="More"
+                className="w-5 h-5"
+                id={"expand-dropdown" + link.id}
+              />
+            </div>
+            <div className="relative">
+              <div className="flex flex-col items-end justify-center gap-1">
+                <a
+                  href={`/api/archives/${
+                    link.collectionId
+                  }/${encodeURIComponent(link.screenshotPath)}`}
+                  target="_blank"
+                  rel="noreferrer"
+                  title="Screenshot"
+                >
+                  <FontAwesomeIcon
+                    icon={faFileImage}
+                    className="w-5 h-5 text-sky-600 cursor-pointer hover:text-sky-500 duration-100"
+                  />
+                </a>
+                <a
+                  href={`/api/archives/${
+                    link.collectionId
+                  }/${encodeURIComponent(link.pdfPath)}`}
+                  target="_blank"
+                  rel="noreferrer"
+                  title="PDF"
+                >
+                  <FontAwesomeIcon
+                    icon={faFilePdf}
+                    className="w-5 h-5 text-sky-600 cursor-pointer hover:text-sky-500 duration-100"
+                  />
+                </a>
+              </div>
+            </div>
+
+            {expandDropdown ? (
+              <Dropdown
+                items={[
+                  {
+                    name: "Edit",
+                    onClick: () => {
+                      setEditModal(true);
+                      setExpandDropdown(false);
+                    },
                   },
-                },
-                {
-                  name: "Delete",
-                  onClick: () => {
-                    removeLink(link);
-                    setExpandDropdown(false);
+                  {
+                    name: "Delete",
+                    onClick: () => {
+                      removeLink(link);
+                      setExpandDropdown(false);
+                    },
                   },
-                },
-              ]}
-              onClickOutside={(e: Event) => {
-                const target = e.target as HTMLInputElement;
-                if (target.id !== "expand-dropdown" + link.id)
-                  setExpandDropdown(false);
-              }}
-              className="absolute top-8 right-0 w-36"
-            />
-          ) : null}
+                ]}
+                onClickOutside={(e: Event) => {
+                  const target = e.target as HTMLInputElement;
+                  if (target.id !== "expand-dropdown" + link.id)
+                    setExpandDropdown(false);
+                }}
+                className="absolute top-8 right-0 w-36"
+              />
+            ) : null}
+          </div>
         </div>
       </div>
     </div>
diff --git a/components/Modal/User/ProfileSettings.tsx b/components/Modal/User/ProfileSettings.tsx
index 2a464bc..03db59f 100644
--- a/components/Modal/User/ProfileSettings.tsx
+++ b/components/Modal/User/ProfileSettings.tsx
@@ -25,7 +25,6 @@ export default function ProfileSettings({
   const [profileStatus, setProfileStatus] = useState(true);
 
   const handleProfileStatus = (e: boolean) => {
-    console.log(e);
     setProfileStatus(!e);
   };
 
@@ -60,10 +59,6 @@ export default function ProfileSettings({
     setUser({ ...user, oldPassword: undefined, newPassword: undefined });
   }, []);
 
-  useEffect(() => {
-    console.log(user.profilePic);
-  }, [user.profilePic]);
-
   const submit = async () => {
     const response = await updateAccount({
       ...user,
diff --git a/components/Sidebar.tsx b/components/Sidebar.tsx
index 95c24d6..5263ece 100644
--- a/components/Sidebar.tsx
+++ b/components/Sidebar.tsx
@@ -74,20 +74,6 @@ export default function Sidebar({ className }: { className?: string }) {
           </div>
         </Link>
 
-        <Link href="/collections">
-          <div
-            className={`${
-              active === "/collections" ? "bg-sky-200" : "hover:bg-slate-200"
-            } outline-sky-100 outline-1 duration-100  py-1 px-2 rounded-md cursor-pointer flex items-center gap-2`}
-          >
-            <FontAwesomeIcon
-              icon={faBox}
-              className={`w-6 h-6 drop-shadow text-sky-500`}
-            />
-            <p className="text-sky-600">All Collections</p>
-          </div>
-        </Link>
-
         <Link href="/links">
           <div
             className={`${
@@ -103,6 +89,20 @@ export default function Sidebar({ className }: { className?: string }) {
             <p className="text-sky-600">All Links</p>
           </div>
         </Link>
+
+        <Link href="/collections">
+          <div
+            className={`${
+              active === "/collections" ? "bg-sky-200" : "hover:bg-slate-200"
+            } outline-sky-100 outline-1 duration-100  py-1 px-2 rounded-md cursor-pointer flex items-center gap-2`}
+          >
+            <FontAwesomeIcon
+              icon={faBox}
+              className={`w-6 h-6 drop-shadow text-sky-500`}
+            />
+            <p className="text-sky-600">All Collections</p>
+          </div>
+        </Link>
       </div>
 
       <Disclosure defaultOpen={collectionDisclosure}>
diff --git a/package.json b/package.json
index 7651c86..4833bec 100644
--- a/package.json
+++ b/package.json
@@ -46,9 +46,9 @@
   "devDependencies": {
     "@types/bcrypt": "^5.0.0",
     "@types/multer": "^1.4.7",
-    "autoprefixer": "^10.4.13",
-    "postcss": "^8.4.21",
+    "autoprefixer": "^10.4.14",
+    "postcss": "^8.4.24",
     "prisma": "^4.9.0",
-    "tailwindcss": "^3.2.4"
+    "tailwindcss": "^3.3.2"
   }
 }
diff --git a/pages/collections/[id].tsx b/pages/collections/[id].tsx
index c3e2369..29be60d 100644
--- a/pages/collections/[id].tsx
+++ b/pages/collections/[id].tsx
@@ -102,24 +102,24 @@ export default function Index() {
       <div className="p-5 flex flex-col gap-5 w-full">
         <div className="bg-gradient-to-tr from-sky-100 from-10% via-gray-100 via-20% rounded-xl shadow min-h-[10rem] p-5 flex gap-5 flex-col justify-between">
           <div className="flex flex-col sm:flex-row gap-3 justify-between items-center sm:items-start">
-            {activeCollection ? (
+            {activeCollection && (
               <div className="flex gap-3 items-center">
                 <div className="flex gap-2">
                   <FontAwesomeIcon
                     icon={faFolder}
                     style={{ color: activeCollection?.color }}
-                    className="sm:w-8 sm:h-8 w-6 h-6 mt-2 drop-shadow"
+                    className="sm:w-8 sm:h-8 w-6 h-6 mt-3 drop-shadow"
                   />
-                  <p className="sm:text-4xl text-3xl capitalize bg-gradient-to-tr from-sky-500 to-slate-400 bg-clip-text text-transparent font-bold">
+                  <p className="sm:text-4xl text-3xl capitalize bg-gradient-to-tr from-sky-500 to-slate-400 bg-clip-text text-transparent font-bold py-1">
                     {activeCollection?.name}
                   </p>
                 </div>
               </div>
-            ) : null}
+            )}
 
             {activeCollection ? (
               <div
-                className={`text-sky-400 w-60 ${
+                className={`text-sky-400 min-w-[15rem] ${
                   activeCollection.members[0] && "mr-3"
                 }`}
               >
diff --git a/pages/collections/index.tsx b/pages/collections/index.tsx
index 0932b04..5f205c1 100644
--- a/pages/collections/index.tsx
+++ b/pages/collections/index.tsx
@@ -191,7 +191,7 @@ export default function Collections() {
           </div>
         </div>
 
-        <div className="grid 2xl:grid-cols-4 xl:grid-cols-3 sm:grid-cols-2 gap-5">
+        <div className="grid 2xl:grid-cols-4 xl:grid-cols-3 sm:grid-cols-2 grid-cols-1 gap-5">
           {sortedCollections.map((e, i) => {
             return <CollectionCard key={i} collection={e} />;
           })}
diff --git a/pages/dashboard.tsx b/pages/dashboard.tsx
index 7146d29..6a04047 100644
--- a/pages/dashboard.tsx
+++ b/pages/dashboard.tsx
@@ -1,5 +1,8 @@
 import useCollectionStore from "@/store/collections";
-import { faArrowRight, faChartSimple } from "@fortawesome/free-solid-svg-icons";
+import {
+  faChartSimple,
+  faChevronDown,
+} from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import MainLayout from "@/layouts/MainLayout";
 import useLinkStore from "@/store/links";
@@ -7,6 +10,7 @@ import useTagStore from "@/store/tags";
 import LinkCard from "@/components/LinkCard";
 import Link from "next/link";
 import CollectionCard from "@/components/CollectionCard";
+import { Disclosure, Transition } from "@headlessui/react";
 import { useEffect, useState } from "react";
 
 export default function Dashboard() {
@@ -14,22 +18,42 @@ export default function Dashboard() {
   const { links } = useLinkStore();
   const { tags } = useTagStore();
 
-  const [sortedCollections, setSortedCollections] = useState([]);
+  const [tagPinDisclosure, setTagPinDisclosure] = useState<boolean>(() => {
+    const storedValue = localStorage.getItem("tagPinDisclosure");
+    return storedValue ? storedValue === "true" : true;
+  });
 
-  useEffect(() => {
-    const collectionsWithLinkCount = collections.map((collection) => {
-      const linkCount = links.filter(
-        (link) => link.collectionId === collection.id
-      ).length;
-      return { ...collection, linkCount };
+  const [collectionPinDisclosure, setCollectionPinDisclosure] =
+    useState<boolean>(() => {
+      const storedValue = localStorage.getItem("collectionPinDisclosure");
+      return storedValue ? storedValue === "true" : true;
     });
 
-    setSortedCollections(
-      collectionsWithLinkCount.sort((a, b) => b.linkCount - a.linkCount) as any
-    );
+  const [linkPinDisclosure, setLinkPinDisclosure] = useState<boolean>(() => {
+    const storedValue = localStorage.getItem("linkPinDisclosure");
+    return storedValue ? storedValue === "true" : true;
+  });
 
-    // console.log(links.length);
-  }, [collections, links]);
+  useEffect(() => {
+    localStorage.setItem(
+      "tagPinDisclosure",
+      tagPinDisclosure ? "true" : "false"
+    );
+  }, [tagPinDisclosure]);
+
+  useEffect(() => {
+    localStorage.setItem(
+      "collectionPinDisclosure",
+      collectionPinDisclosure ? "true" : "false"
+    );
+  }, [collectionPinDisclosure]);
+
+  useEffect(() => {
+    localStorage.setItem(
+      "linkPinDisclosure",
+      linkPinDisclosure ? "true" : "false"
+    );
+  }, [linkPinDisclosure]);
 
   return (
     // ml-80
@@ -47,9 +71,11 @@ export default function Dashboard() {
           </div>
         </div>
 
-        <div className="flex flex-col md:flex-row md:items-center justify-evenly gap-2 mb-10 bg-gradient-to-tr from-sky-500 to-slate-400 bg-clip-text text-transparent">
+        <div className="flex flex-col md:flex-row md:items-center justify-evenly gap-2 mb-10">
           <div className="flex items-baseline gap-2">
-            <p className="font-bold text-6xl">{links.length}</p>
+            <p className="font-bold text-6xl bg-gradient-to-tr from-sky-500 to-slate-400 bg-clip-text text-transparent">
+              {links.length}
+            </p>
             <p className="text-sky-900 text-xl">
               Links
               {/* {links.length == 1 ? "Links" : "Link"} */}
@@ -57,73 +83,141 @@ export default function Dashboard() {
           </div>
 
           <div className="flex items-baseline gap-2">
-            <p className="font-bold text-6xl">{collections.length}</p>
+            <p className="font-bold text-6xl bg-gradient-to-tr from-sky-500 to-slate-400 bg-clip-text text-transparent">
+              {collections.length}
+            </p>
             <p className="text-sky-900 text-xl">Collections</p>
           </div>
 
           <div className="flex items-baseline gap-2">
-            <p className="font-bold text-6xl">{tags.length}</p>
+            <p className="font-bold text-6xl bg-gradient-to-tr from-sky-500 to-slate-400 bg-clip-text text-transparent">
+              {tags.length}
+            </p>
             <p className="text-sky-900 text-xl">Tags</p>
           </div>
         </div>
 
-        <div className="flex flex-col 2xl:flex-row items-start justify-evenly gap-5">
-          <div className="flex flex-col gap-5 p-2 w-full">
-            <div className="flex justify-between gap-2 items-baseline">
-              <p className="text-sky-600 text-xl mb-2">Recently added Links</p>
-              <Link href="/links">
-                <div className="text-sky-600 flex items-center gap-1 hover:border-b-sky-500 duration-100 hover:border-b">
-                  View All
+        {/* <hr className="my-5 border-sky-100" /> */}
+        <br />
+
+        <div className="flex flex-col 2xl:flex-row items-start justify-evenly 2xl:gap-2">
+          <Disclosure defaultOpen={linkPinDisclosure}>
+            <div className="flex flex-col gap-5 p-2 w-full">
+              <Disclosure.Button
+                onClick={() => {
+                  setLinkPinDisclosure(!linkPinDisclosure);
+                }}
+                className="flex justify-between gap-2 items-baseline shadow active:shadow-inner duration-100 py-2 px-4 rounded-full"
+              >
+                <p className="text-sky-600 text-xl">Pinned Links</p>
+
+                <div className="text-sky-600 flex items-center gap-2">
+                  {linkPinDisclosure ? "Hide" : "Show"}
                   <FontAwesomeIcon
-                    icon={faArrowRight}
-                    className="w-4 h-4 text-sky-300"
+                    icon={faChevronDown}
+                    className={`w-4 h-4 text-sky-300 ${
+                      linkPinDisclosure ? "rotate-reverse" : "rotate"
+                    }`}
                   />
                 </div>
-              </Link>
-            </div>
-            {links
-              .sort(
-                (a, b) =>
-                  new Date(b.createdAt as string).getTime() -
-                  new Date(a.createdAt as string).getTime()
-              )
-              .slice(0, 5)
-              .map((e, i) => (
-                <LinkCard key={i} link={e} count={i} />
-              ))}
-          </div>
+              </Disclosure.Button>
 
-          <div className="flex flex-col gap-5 p-2 w-full">
-            <div className="flex justify-between gap-2 items-baseline">
-              <p className="text-sky-600 text-xl mb-2">Top Collections</p>
-              <Link href="/collections">
-                <div className="text-sky-600 flex items-center gap-1 hover:border-b-sky-500 duration-100 hover:border-b">
-                  View All
+              <Transition
+                enter="transition duration-100 ease-out"
+                enterFrom="transform opacity-0 -translate-y-3"
+                enterTo="transform opacity-100 translate-y-0"
+                leave="transition duration-100 ease-out"
+                leaveFrom="transform opacity-100 translate-y-0"
+                leaveTo="transform opacity-0 -translate-y-3"
+              >
+                <Disclosure.Panel className="flex flex-col gap-5 w-full">
+                  {links.slice(0, 5).map((e, i) => (
+                    <LinkCard key={i} link={e} count={i} />
+                  ))}
+                </Disclosure.Panel>
+              </Transition>
+            </div>
+          </Disclosure>
+
+          <Disclosure defaultOpen={collectionPinDisclosure}>
+            <div className="flex flex-col gap-5 p-2 w-full">
+              <Disclosure.Button
+                onClick={() => {
+                  setCollectionPinDisclosure(!collectionPinDisclosure);
+                }}
+                className="flex justify-between gap-2 items-baseline shadow active:shadow-inner duration-100 py-2 px-4 rounded-full"
+              >
+                <p className="text-sky-600 text-xl">Pinned Collections</p>
+
+                <div className="text-sky-600 flex items-center gap-2">
+                  {collectionPinDisclosure ? "Hide" : "Show"}
                   <FontAwesomeIcon
-                    icon={faArrowRight}
-                    className="w-4 h-4 text-sky-300"
+                    icon={faChevronDown}
+                    className={`w-4 h-4 text-sky-300 ${
+                      collectionPinDisclosure ? "rotate-reverse" : "rotate"
+                    }`}
                   />
                 </div>
-              </Link>
+              </Disclosure.Button>
+              <Transition
+                enter="transition duration-100 ease-out"
+                enterFrom="transform opacity-0 -translate-y-3"
+                enterTo="transform opacity-100 translate-y-0"
+                leave="transition duration-100 ease-out"
+                leaveFrom="transform opacity-100 translate-y-0"
+                leaveTo="transform opacity-0 -translate-y-3"
+              >
+                <Disclosure.Panel className="flex flex-col gap-5 w-full">
+                  {collections.slice(0, 5).map((e, i) => (
+                    <CollectionCard key={i} collection={e} />
+                  ))}
+                </Disclosure.Panel>
+              </Transition>
             </div>
-            {sortedCollections.map((e, i) => (
-              <CollectionCard key={i} collection={e} />
-            ))}
-          </div>
+          </Disclosure>
 
-          <div className="flex flex-col gap-5 p-2 w-full">
-            <div className="flex gap-2 flex-wrap">
-              {tags.slice(0, 19).map((e, i) => (
-                <Link
-                  href={`/tags/${e.id}`}
-                  key={i}
-                  className="px-2 py-1 bg-sky-200 rounded-full hover:bg-sky-100 duration-100 text-sky-700"
-                >
-                  # {e.name}
-                </Link>
-              ))}
+          <Disclosure defaultOpen={tagPinDisclosure}>
+            <div className="flex flex-col gap-5 p-2 w-full">
+              <Disclosure.Button
+                onClick={() => {
+                  setTagPinDisclosure(!tagPinDisclosure);
+                }}
+                className="flex justify-between gap-2 items-baseline shadow active:shadow-inner duration-100 py-2 px-4 rounded-full"
+              >
+                <p className="text-sky-600 text-xl">Pinned Tags</p>
+
+                <div className="text-sky-600 flex items-center gap-2">
+                  {tagPinDisclosure ? "Hide" : "Show"}
+                  <FontAwesomeIcon
+                    icon={faChevronDown}
+                    className={`w-4 h-4 text-sky-300 ${
+                      tagPinDisclosure ? "rotate-reverse" : "rotate"
+                    }`}
+                  />
+                </div>
+              </Disclosure.Button>
+              <Transition
+                enter="transition duration-100 ease-out"
+                enterFrom="transform opacity-0 -translate-y-3"
+                enterTo="transform opacity-100 translate-y-0"
+                leave="transition duration-100 ease-out"
+                leaveFrom="transform opacity-100 translate-y-0"
+                leaveTo="transform opacity-0 -translate-y-3"
+              >
+                <Disclosure.Panel className="flex gap-2 flex-wrap">
+                  {tags.slice(0, 19).map((e, i) => (
+                    <Link
+                      href={`/tags/${e.id}`}
+                      key={i}
+                      className="px-2 py-1 bg-sky-200 rounded-full hover:opacity-60 duration-100 text-sky-700"
+                    >
+                      {e.name}
+                    </Link>
+                  ))}
+                </Disclosure.Panel>
+              </Transition>
             </div>
-          </div>
+          </Disclosure>
         </div>
       </div>
     </MainLayout>
diff --git a/prisma/migrations/20230605090235_init/migration.sql b/prisma/migrations/20230612181740_init/migration.sql
similarity index 66%
rename from prisma/migrations/20230605090235_init/migration.sql
rename to prisma/migrations/20230612181740_init/migration.sql
index 4c5fa84..602ce21 100644
--- a/prisma/migrations/20230605090235_init/migration.sql
+++ b/prisma/migrations/20230612181740_init/migration.sql
@@ -24,6 +24,33 @@ CREATE TABLE "Collection" (
     CONSTRAINT "Collection_pkey" PRIMARY KEY ("id")
 );
 
+-- CreateTable
+CREATE TABLE "PinnedCollections" (
+    "id" SERIAL NOT NULL,
+    "userId" INTEGER NOT NULL,
+    "collectionId" INTEGER NOT NULL,
+
+    CONSTRAINT "PinnedCollections_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "PinnedLinks" (
+    "id" SERIAL NOT NULL,
+    "userId" INTEGER NOT NULL,
+    "linkId" INTEGER NOT NULL,
+
+    CONSTRAINT "PinnedLinks_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "PinnedTags" (
+    "id" SERIAL NOT NULL,
+    "userId" INTEGER NOT NULL,
+    "tagId" INTEGER NOT NULL,
+
+    CONSTRAINT "PinnedTags_pkey" PRIMARY KEY ("id")
+);
+
 -- CreateTable
 CREATE TABLE "UsersAndCollections" (
     "userId" INTEGER NOT NULL,
@@ -82,6 +109,24 @@ CREATE INDEX "_LinkToTag_B_index" ON "_LinkToTag"("B");
 -- AddForeignKey
 ALTER TABLE "Collection" ADD CONSTRAINT "Collection_ownerId_fkey" FOREIGN KEY ("ownerId") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
 
+-- AddForeignKey
+ALTER TABLE "PinnedCollections" ADD CONSTRAINT "PinnedCollections_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "PinnedCollections" ADD CONSTRAINT "PinnedCollections_collectionId_fkey" FOREIGN KEY ("collectionId") REFERENCES "Collection"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "PinnedLinks" ADD CONSTRAINT "PinnedLinks_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "PinnedLinks" ADD CONSTRAINT "PinnedLinks_linkId_fkey" FOREIGN KEY ("linkId") REFERENCES "Link"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "PinnedTags" ADD CONSTRAINT "PinnedTags_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "PinnedTags" ADD CONSTRAINT "PinnedTags_tagId_fkey" FOREIGN KEY ("tagId") REFERENCES "Tag"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
 -- AddForeignKey
 ALTER TABLE "UsersAndCollections" ADD CONSTRAINT "UsersAndCollections_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
 
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 2fc9cfd..b3bf3b6 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -14,6 +14,9 @@ model User {
   password String
   collections Collection[]
   tags Tag[]
+  pinnedCollections PinnedCollections[]
+  pinnedLinks PinnedLinks[]
+  pinnedTags PinnedTags[]
   collectionsJoined UsersAndCollections[]
   isPrivate Boolean @default(false)
   whitelistedUsers String[] @default([])
@@ -26,6 +29,7 @@ model Collection {
   description String @default("")
   color String @default("#0ea5e9")
   isPublic Boolean @default(false)
+  pins PinnedCollections[]
   owner User @relation(fields: [ownerId], references: [id])
   ownerId Int
   members UsersAndCollections[]
@@ -35,6 +39,37 @@ model Collection {
   @@unique([name, ownerId])
 }
 
+model PinnedCollections {
+  id Int @id @default(autoincrement())
+
+  user User @relation(fields: [userId], references: [id])
+  userId Int
+
+  collection Collection @relation(fields: [collectionId], references: [id])
+  collectionId Int
+}
+
+model PinnedLinks {
+  id Int @id @default(autoincrement())
+
+  user User @relation(fields: [userId], references: [id])
+  userId Int
+  
+  link Link @relation(fields: [linkId], references: [id])
+  linkId Int
+}
+
+model PinnedTags {
+  id Int @id @default(autoincrement())
+
+  user User @relation(fields: [userId], references: [id])
+  userId Int
+
+  tag Tag @relation(fields: [tagId], references: [id])
+  tagId Int
+}
+
+
 model UsersAndCollections {
   user User @relation(fields: [userId], references: [id])
   userId Int
@@ -57,6 +92,7 @@ model Link {
   collection Collection @relation(fields: [collectionId], references: [id])
   collectionId Int
   tags Tag[]
+  pins PinnedLinks[]
   screenshotPath String
   pdfPath String
   createdAt DateTime @default(now())
@@ -66,6 +102,7 @@ model Tag {
   id Int @id @default(autoincrement())
   name String
   links Link[]
+  pins PinnedTags[]
   owner User @relation(fields: [ownerId], references: [id])
   ownerId Int
 
diff --git a/yarn.lock b/yarn.lock
index 3ebd95e..d4d1c00 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2,6 +2,11 @@
 # yarn lockfile v1
 
 
+"@alloc/quick-lru@^5.2.0":
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/@alloc/quick-lru/-/quick-lru-5.2.0.tgz#7bf68b20c0a350f936915fcae06f58e32007ce30"
+  integrity sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==
+
 "@babel/code-frame@^7.0.0":
   version "7.18.6"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.18.6.tgz#3b25d38c89600baa2dcc219edfa88a74eb2c427a"
@@ -274,6 +279,43 @@
   resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45"
   integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==
 
+"@jridgewell/gen-mapping@^0.3.2":
+  version "0.3.3"
+  resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz#7e02e6eb5df901aaedb08514203b096614024098"
+  integrity sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==
+  dependencies:
+    "@jridgewell/set-array" "^1.0.1"
+    "@jridgewell/sourcemap-codec" "^1.4.10"
+    "@jridgewell/trace-mapping" "^0.3.9"
+
+"@jridgewell/resolve-uri@3.1.0":
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz#2203b118c157721addfe69d47b70465463066d78"
+  integrity sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w==
+
+"@jridgewell/set-array@^1.0.1":
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.1.2.tgz#7c6cf998d6d20b914c0a55a91ae928ff25965e72"
+  integrity sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==
+
+"@jridgewell/sourcemap-codec@1.4.14":
+  version "1.4.14"
+  resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz#add4c98d341472a289190b424efbdb096991bb24"
+  integrity sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==
+
+"@jridgewell/sourcemap-codec@^1.4.10":
+  version "1.4.15"
+  resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz#d7c6e6755c78567a951e04ab52ef0fd26de59f32"
+  integrity sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==
+
+"@jridgewell/trace-mapping@^0.3.9":
+  version "0.3.18"
+  resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.18.tgz#25783b2086daf6ff1dcb53c9249ae480e4dd4cd6"
+  integrity sha512-w+niJYzMHdd7USdiH2U6869nqhD2nbfZXND5Yp93qIbEmnDNk7PD48o+YchRVpzMU7M6jVCbenTR7PA1FLQ9pA==
+  dependencies:
+    "@jridgewell/resolve-uri" "3.1.0"
+    "@jridgewell/sourcemap-codec" "1.4.14"
+
 "@mapbox/node-pre-gyp@^1.0.10":
   version "1.0.10"
   resolved "https://registry.yarnpkg.com/@mapbox/node-pre-gyp/-/node-pre-gyp-1.0.10.tgz#8e6735ccebbb1581e5a7e652244cadc8a844d03c"
@@ -719,25 +761,6 @@ acorn-jsx@^5.3.2:
   resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937"
   integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
 
-acorn-node@^1.8.2:
-  version "1.8.2"
-  resolved "https://registry.yarnpkg.com/acorn-node/-/acorn-node-1.8.2.tgz#114c95d64539e53dede23de8b9d96df7c7ae2af8"
-  integrity sha512-8mt+fslDufLYntIoPAaIMUe/lrbrehIiwmR3t2k9LljIzoigEPF27eLk2hy8zSGzmR/ogr7zbRKINMo1u0yh5A==
-  dependencies:
-    acorn "^7.0.0"
-    acorn-walk "^7.0.0"
-    xtend "^4.0.2"
-
-acorn-walk@^7.0.0:
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-7.2.0.tgz#0de889a601203909b0fbe07b8938dc21d2e967bc"
-  integrity sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==
-
-acorn@^7.0.0:
-  version "7.4.1"
-  resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa"
-  integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==
-
 acorn@^8.8.0:
   version "8.8.2"
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.8.2.tgz#1b2f25db02af965399b9776b0c2c391276d37c4a"
@@ -779,6 +802,11 @@ ansi-styles@^4.1.0:
   dependencies:
     color-convert "^2.0.1"
 
+any-promise@^1.0.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/any-promise/-/any-promise-1.3.0.tgz#abc6afeedcea52e809cdc0376aed3ce39635d17f"
+  integrity sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==
+
 anymatch@~3.1.2:
   version "3.1.3"
   resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.3.tgz#790c58b19ba1720a84205b57c618d5ad8524973e"
@@ -879,13 +907,13 @@ ast-types-flow@^0.0.7:
   resolved "https://registry.yarnpkg.com/ast-types-flow/-/ast-types-flow-0.0.7.tgz#f70b735c6bca1a5c9c22d982c3e39e7feba3bdad"
   integrity sha512-eBvWn1lvIApYMhzQMsu9ciLfkBY499mFZlNqG+/9WR7PVlroQw0vG30cOQQbaKz3sCEc44TAOu2ykzqXSNnwag==
 
-autoprefixer@^10.4.13:
-  version "10.4.13"
-  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-10.4.13.tgz#b5136b59930209a321e9fa3dca2e7c4d223e83a8"
-  integrity sha512-49vKpMqcZYsJjwotvt4+h/BCjJVnhGwcLpDt5xkcaOG3eLrG/HUYLagrihYsQ+qrIBgIzX1Rw7a6L8I/ZA1Atg==
+autoprefixer@^10.4.14:
+  version "10.4.14"
+  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-10.4.14.tgz#e28d49902f8e759dd25b153264e862df2705f79d"
+  integrity sha512-FQzyfOsTlwVzjHxKEqRIAdJx9niO6VCBCoEwax/VLSoQF29ggECcPuBqUMZ+u8jCZOPSy8b8/8KnuFbp0SaFZQ==
   dependencies:
-    browserslist "^4.21.4"
-    caniuse-lite "^1.0.30001426"
+    browserslist "^4.21.5"
+    caniuse-lite "^1.0.30001464"
     fraction.js "^4.2.0"
     normalize-range "^0.1.2"
     picocolors "^1.0.0"
@@ -964,15 +992,15 @@ braces@^3.0.2, braces@~3.0.2:
   dependencies:
     fill-range "^7.0.1"
 
-browserslist@^4.21.4:
-  version "4.21.4"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.4.tgz#e7496bbc67b9e39dd0f98565feccdcb0d4ff6987"
-  integrity sha512-CBHJJdDmgjl3daYjN5Cp5kbTf1mUhZoS+beLklHIvkOWscs83YAhLlF3Wsh/lciQYAcbBJgTOD44VtG31ZM4Hw==
+browserslist@^4.21.5:
+  version "4.21.7"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.7.tgz#e2b420947e5fb0a58e8f4668ae6e23488127e551"
+  integrity sha512-BauCXrQ7I2ftSqd2mvKHGo85XR0u7Ru3C/Hxsy/0TkfCtjrmAbPdzLGasmoiBxplpDXlPvdjX9u7srIMfgasNA==
   dependencies:
-    caniuse-lite "^1.0.30001400"
-    electron-to-chromium "^1.4.251"
-    node-releases "^2.0.6"
-    update-browserslist-db "^1.0.9"
+    caniuse-lite "^1.0.30001489"
+    electron-to-chromium "^1.4.411"
+    node-releases "^2.0.12"
+    update-browserslist-db "^1.0.11"
 
 buffer-crc32@~0.2.3:
   version "0.2.13"
@@ -1017,11 +1045,16 @@ camelcase-css@^2.0.1:
   resolved "https://registry.yarnpkg.com/camelcase-css/-/camelcase-css-2.0.1.tgz#ee978f6947914cc30c6b44741b6ed1df7f043fd5"
   integrity sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==
 
-caniuse-lite@^1.0.30001400, caniuse-lite@^1.0.30001406, caniuse-lite@^1.0.30001426:
+caniuse-lite@^1.0.30001406:
   version "1.0.30001449"
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001449.tgz#a8d11f6a814c75c9ce9d851dc53eb1d1dfbcd657"
   integrity sha512-CPB+UL9XMT/Av+pJxCKGhdx+yg1hzplvFJQlJ2n68PyQGMz9L/E2zCyLdOL8uasbouTUgnPl+y0tccI/se+BEw==
 
+caniuse-lite@^1.0.30001464, caniuse-lite@^1.0.30001489:
+  version "1.0.30001502"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001502.tgz#f7e4a76eb1d2d585340f773767be1fefc118dca8"
+  integrity sha512-AZ+9tFXw1sS0o0jcpJQIXvFTOB/xGiQ4OQ2t98QX3NDn2EZTSRBC801gxrsGgViuq2ak/NLkNgSNEPtCr5lfKg==
+
 chalk@^2.0.0:
   version "2.4.2"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
@@ -1106,7 +1139,7 @@ color-name@1.1.3:
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
   integrity sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==
 
-color-name@^1.1.4, color-name@~1.1.4:
+color-name@~1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
   integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
@@ -1116,6 +1149,11 @@ color-support@^1.1.2:
   resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
   integrity sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg==
 
+commander@^4.0.0:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-4.1.1.tgz#9fd602bd936294e9e9ef46a3f4d6964044b18068"
+  integrity sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==
+
 concat-map@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
@@ -1268,11 +1306,6 @@ define-properties@^1.1.3, define-properties@^1.1.4:
     has-property-descriptors "^1.0.0"
     object-keys "^1.1.1"
 
-defined@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/defined/-/defined-1.0.1.tgz#c0b9db27bfaffd95d6f61399419b893df0f91ebf"
-  integrity sha512-hsBd2qSVCRE+5PmNdHt1uzyrFu5d3RwmFDKzyNZMFq/EwDNJF7Ee5+D5oEKF0hU6LhtoUF1macFvOe4AskQC1Q==
-
 delegates@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/delegates/-/delegates-1.0.0.tgz#84c6e159b81904fdca59a0ef44cd870d31250f9a"
@@ -1283,15 +1316,6 @@ detect-libc@^2.0.0:
   resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-2.0.1.tgz#e1897aa88fa6ad197862937fbc0441ef352ee0cd"
   integrity sha512-463v3ZeIrcWtdgIg6vI6XUncguvr2TnGl4SzDXinkt9mSLpBJKXT3mW6xT3VQdDN11+WVs29pgvivTc4Lp8v+w==
 
-detective@^5.2.1:
-  version "5.2.1"
-  resolved "https://registry.yarnpkg.com/detective/-/detective-5.2.1.tgz#6af01eeda11015acb0e73f933242b70f24f91034"
-  integrity sha512-v9XE1zRnz1wRtgurGu0Bs8uHKFSTdteYZNbIPFVhUZ39L/S79ppMpdmVOZAnoz1jfEFodc48n6MX483Xo3t1yw==
-  dependencies:
-    acorn-node "^1.8.2"
-    defined "^1.0.0"
-    minimist "^1.2.6"
-
 devtools-protocol@0.0.1107588:
   version "0.0.1107588"
   resolved "https://registry.yarnpkg.com/devtools-protocol/-/devtools-protocol-0.0.1107588.tgz#f8cac707840b97cc30b029359341bcbbb0ad8ffa"
@@ -1336,10 +1360,10 @@ dom-helpers@^5.0.1:
     "@babel/runtime" "^7.8.7"
     csstype "^3.0.2"
 
-electron-to-chromium@^1.4.251:
-  version "1.4.284"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.284.tgz#61046d1e4cab3a25238f6bf7413795270f125592"
-  integrity sha512-M8WEXFuKXMYMVr45fo8mq0wUrrJHheiKZf6BArTKk9ZBYCKJEOU5H8cdWgDT+qCVZf7Na4lVUaZsA+h6uA9+PA==
+electron-to-chromium@^1.4.411:
+  version "1.4.427"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.427.tgz#67e8069f7a864fc092fe2e09f196e68af5cb88a1"
+  integrity sha512-HK3r9l+Jm8dYAm1ctXEWIC+hV60zfcjS9UA5BDlYvnI5S7PU/yytjpvSrTNrSSRRkuu3tDyZhdkwIczh+0DWaw==
 
 emoji-regex@^8.0.0:
   version "8.0.0"
@@ -1912,6 +1936,18 @@ glob-parent@^6.0.2:
   dependencies:
     is-glob "^4.0.3"
 
+glob@7.1.6:
+  version "7.1.6"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.6.tgz#141f33b81a7c2492e125594307480c46679278a6"
+  integrity sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==
+  dependencies:
+    fs.realpath "^1.0.0"
+    inflight "^1.0.4"
+    inherits "2"
+    minimatch "^3.0.4"
+    once "^1.3.0"
+    path-is-absolute "^1.0.0"
+
 glob@7.1.7:
   version "7.1.7"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.7.tgz#3b193e9233f01d42d0b3f78294bbeeb418f94a90"
@@ -2337,6 +2373,11 @@ isobject@^3.0.1:
   resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
   integrity sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==
 
+jiti@^1.18.2:
+  version "1.18.2"
+  resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.18.2.tgz#80c3ef3d486ebf2450d9335122b32d121f2a83cd"
+  integrity sha512-QAdOptna2NYiSSpv0O/BwoHBSmz4YhpzJHyi+fnMRTXFjp7B8i/YG5Z8IfusxB1ufjcD2Sre1F3R+nX3fvy7gg==
+
 jose@^4.11.4, jose@^4.14.1:
   version "4.14.4"
   resolved "https://registry.yarnpkg.com/jose/-/jose-4.14.4.tgz#59e09204e2670c3164ee24cbfe7115c6f8bff9ca"
@@ -2442,11 +2483,16 @@ levn@^0.4.1:
     prelude-ls "^1.2.1"
     type-check "~0.4.0"
 
-lilconfig@^2.0.5, lilconfig@^2.0.6:
+lilconfig@^2.0.5:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.0.6.tgz#32a384558bd58af3d4c6e077dd1ad1d397bc69d4"
   integrity sha512-9JROoBW7pobfsx+Sq2JsASvCo6Pfo6WWoUW79HuB1BCoBXD4PLWJPqDF6fNj67pqBYTbAHkE57M1kS/+L1neOg==
 
+lilconfig@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.1.0.tgz#78e23ac89ebb7e1bfbf25b18043de756548e7f52"
+  integrity sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==
+
 lines-and-columns@^1.1.6:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
@@ -2614,11 +2660,25 @@ multer@^1.4.5-lts.1:
     type-is "^1.6.4"
     xtend "^4.0.0"
 
+mz@^2.7.0:
+  version "2.7.0"
+  resolved "https://registry.yarnpkg.com/mz/-/mz-2.7.0.tgz#95008057a56cafadc2bc63dde7f9ff6955948e32"
+  integrity sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==
+  dependencies:
+    any-promise "^1.0.0"
+    object-assign "^4.0.1"
+    thenify-all "^1.0.0"
+
 nanoid@^3.3.4:
   version "3.3.4"
   resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.4.tgz#730b67e3cd09e2deacf03c027c81c9d9dbc5e8ab"
   integrity sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==
 
+nanoid@^3.3.6:
+  version "3.3.6"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.6.tgz#443380c856d6e9f9824267d960b4236ad583ea4c"
+  integrity sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==
+
 natural-compare@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7"
@@ -2683,10 +2743,10 @@ node-fetch@^2.6.0, node-fetch@^2.6.7:
   dependencies:
     whatwg-url "^5.0.0"
 
-node-releases@^2.0.6:
-  version "2.0.8"
-  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.8.tgz#0f349cdc8fcfa39a92ac0be9bc48b7706292b9ae"
-  integrity sha512-dFSmB8fFHEH/s81Xi+Y/15DQY6VHW81nXRj86EMSL3lmuTmK1e+aT4wrFCkTbm+gSwkw4KpX+rT/pMM2c1mF+A==
+node-releases@^2.0.12:
+  version "2.0.12"
+  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.12.tgz#35627cc224a23bfb06fb3380f2b3afaaa7eb1039"
+  integrity sha512-QzsYKWhXTWx8h1kIvqfnC++o0pEmpRQA/aenALsL2F4pqNVr7YzcdMlDij5WBnwftRbJCNJL/O7zdKaxKPHqgQ==
 
 nopt@^5.0.0:
   version "5.0.0"
@@ -2720,7 +2780,7 @@ oauth@^0.9.15:
   resolved "https://registry.yarnpkg.com/oauth/-/oauth-0.9.15.tgz#bd1fefaf686c96b75475aed5196412ff60cfb9c1"
   integrity sha512-a5ERWK1kh38ExDEfoO6qUHJb32rd7aYmPHuyCu3Fta/cnICvYmgd2uhuKXvPD+PXB+gCEYYEaQdIRAjCOwAKNA==
 
-object-assign@^4.1.1:
+object-assign@^4.0.1, object-assign@^4.1.1:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
   integrity sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==
@@ -2917,41 +2977,46 @@ pify@^2.3.0:
   resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c"
   integrity sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==
 
-postcss-import@^14.1.0:
-  version "14.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-import/-/postcss-import-14.1.0.tgz#a7333ffe32f0b8795303ee9e40215dac922781f0"
-  integrity sha512-flwI+Vgm4SElObFVPpTIT7SU7R3qk2L7PyduMcokiaVKuWv9d/U+Gm/QAd8NDLuykTWTkcrjOeD2Pp1rMeBTGw==
+pirates@^4.0.1:
+  version "4.0.5"
+  resolved "https://registry.yarnpkg.com/pirates/-/pirates-4.0.5.tgz#feec352ea5c3268fb23a37c702ab1699f35a5f3b"
+  integrity sha512-8V9+HQPupnaXMA23c5hvl69zXvTwTzyAYasnkb0Tts4XvO4CliqONMOnvlq26rkhLC3nWDFBJf73LU1e1VZLaQ==
+
+postcss-import@^15.1.0:
+  version "15.1.0"
+  resolved "https://registry.yarnpkg.com/postcss-import/-/postcss-import-15.1.0.tgz#41c64ed8cc0e23735a9698b3249ffdbf704adc70"
+  integrity sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==
   dependencies:
     postcss-value-parser "^4.0.0"
     read-cache "^1.0.0"
     resolve "^1.1.7"
 
-postcss-js@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/postcss-js/-/postcss-js-4.0.0.tgz#31db79889531b80dc7bc9b0ad283e418dce0ac00"
-  integrity sha512-77QESFBwgX4irogGVPgQ5s07vLvFqWr228qZY+w6lW599cRlK/HmnlivnnVUxkjHnCu4J16PDMHcH+e+2HbvTQ==
+postcss-js@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/postcss-js/-/postcss-js-4.0.1.tgz#61598186f3703bab052f1c4f7d805f3991bee9d2"
+  integrity sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==
   dependencies:
     camelcase-css "^2.0.1"
 
-postcss-load-config@^3.1.4:
-  version "3.1.4"
-  resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-3.1.4.tgz#1ab2571faf84bb078877e1d07905eabe9ebda855"
-  integrity sha512-6DiM4E7v4coTE4uzA8U//WhtPwyhiim3eyjEMFCnUpzbrkK9wJHgKDT2mR+HbtSrd/NubVaYTOpSpjUl8NQeRg==
+postcss-load-config@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-4.0.1.tgz#152383f481c2758274404e4962743191d73875bd"
+  integrity sha512-vEJIc8RdiBRu3oRAI0ymerOn+7rPuMvRXslTvZUKZonDHFIczxztIyJ1urxM1x9JXEikvpWWTUUqal5j/8QgvA==
   dependencies:
     lilconfig "^2.0.5"
-    yaml "^1.10.2"
+    yaml "^2.1.1"
 
-postcss-nested@6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/postcss-nested/-/postcss-nested-6.0.0.tgz#1572f1984736578f360cffc7eb7dca69e30d1735"
-  integrity sha512-0DkamqrPcmkBDsLn+vQDIrtkSbNkv5AD/M322ySo9kqFkCIYklym2xEmWkwo+Y3/qZo34tzEPNUw4y7yMCdv5w==
+postcss-nested@^6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/postcss-nested/-/postcss-nested-6.0.1.tgz#f83dc9846ca16d2f4fa864f16e9d9f7d0961662c"
+  integrity sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==
   dependencies:
-    postcss-selector-parser "^6.0.10"
+    postcss-selector-parser "^6.0.11"
 
-postcss-selector-parser@^6.0.10:
-  version "6.0.11"
-  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz#2e41dc39b7ad74046e1615185185cd0b17d0c8dc"
-  integrity sha512-zbARubNdogI9j7WY4nQJBiNqQf3sLS3wCP4WfOidu+p28LofJqDH1tcXypGrcmMHhDk2t9wGhCsYe/+szLTy1g==
+postcss-selector-parser@^6.0.11:
+  version "6.0.13"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz#d05d8d76b1e8e173257ef9d60b706a8e5e99bf1b"
+  integrity sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==
   dependencies:
     cssesc "^3.0.0"
     util-deprecate "^1.0.2"
@@ -2970,12 +3035,12 @@ postcss@8.4.14:
     picocolors "^1.0.0"
     source-map-js "^1.0.2"
 
-postcss@^8.4.18, postcss@^8.4.21:
-  version "8.4.21"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.21.tgz#c639b719a57efc3187b13a1d765675485f4134f4"
-  integrity sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==
+postcss@^8.4.23, postcss@^8.4.24:
+  version "8.4.24"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.24.tgz#f714dba9b2284be3cc07dbd2fc57ee4dc972d2df"
+  integrity sha512-M0RzbcI0sO/XJNucsGjvWU9ERWxb/ytp1w6dKtxTKgixdtQDq4rmx/g8W1hnaheq9jgwL/oyEdH5Bc4WwJKMqg==
   dependencies:
-    nanoid "^3.3.4"
+    nanoid "^3.3.6"
     picocolors "^1.0.0"
     source-map-js "^1.0.2"
 
@@ -3134,11 +3199,6 @@ queue-microtask@^1.2.2:
   resolved "https://registry.yarnpkg.com/queue-microtask/-/queue-microtask-1.2.3.tgz#4929228bbc724dfac43e0efb058caf7b6cfb6243"
   integrity sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==
 
-quick-lru@^5.1.1:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/quick-lru/-/quick-lru-5.1.1.tgz#366493e6b3e42a3a6885e2e99d18f80fb7a8c932"
-  integrity sha512-WuyALRjWPDGtt/wzJiadO5AXY+8hZ80hVpe6MyivgraREW751X3SbhRvG3eLKOYN+8VEvqLcf3wdnt44Z4S4SA==
-
 react-colorful@^5.6.1:
   version "5.6.1"
   resolved "https://registry.yarnpkg.com/react-colorful/-/react-colorful-5.6.1.tgz#7dc2aed2d7c72fac89694e834d179e32f3da563b"
@@ -3272,6 +3332,15 @@ resolve@^1.1.7, resolve@^1.19.0, resolve@^1.22.1:
     path-parse "^1.0.7"
     supports-preserve-symlinks-flag "^1.0.0"
 
+resolve@^1.22.2:
+  version "1.22.2"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.2.tgz#0ed0943d4e301867955766c9f3e1ae6d01c6845f"
+  integrity sha512-Sb+mjNHOULsBv818T40qSPeRiuWLyaGMa5ewydRLFimneixmVy2zdivRl+AF6jaYPC8ERxGDmFSiqui6SfPd+g==
+  dependencies:
+    is-core-module "^2.11.0"
+    path-parse "^1.0.7"
+    supports-preserve-symlinks-flag "^1.0.0"
+
 resolve@^2.0.0-next.4:
   version "2.0.0-next.4"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-2.0.0-next.4.tgz#3d37a113d6429f496ec4752d2a2e58efb1fd4660"
@@ -3495,6 +3564,19 @@ stylis@4.1.3:
   resolved "https://registry.yarnpkg.com/stylis/-/stylis-4.1.3.tgz#fd2fbe79f5fed17c55269e16ed8da14c84d069f7"
   integrity sha512-GP6WDNWf+o403jrEp9c5jibKavrtLW+/qYGhFxFrG8maXhwTBI7gLLhiBb0o7uFccWN+EOS9aMO6cGHWAO07OA==
 
+sucrase@^3.32.0:
+  version "3.32.0"
+  resolved "https://registry.yarnpkg.com/sucrase/-/sucrase-3.32.0.tgz#c4a95e0f1e18b6847127258a75cf360bc568d4a7"
+  integrity sha512-ydQOU34rpSyj2TGyz4D2p8rbktIOZ8QY9s+DGLvFU1i5pWJE8vkpruCjGCMHsdXwnD7JDcS+noSwM/a7zyNFDQ==
+  dependencies:
+    "@jridgewell/gen-mapping" "^0.3.2"
+    commander "^4.0.0"
+    glob "7.1.6"
+    lines-and-columns "^1.1.6"
+    mz "^2.7.0"
+    pirates "^4.0.1"
+    ts-interface-checker "^0.1.9"
+
 supports-color@^5.3.0:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
@@ -3522,34 +3604,34 @@ synckit@^0.8.4:
     "@pkgr/utils" "^2.3.1"
     tslib "^2.5.0"
 
-tailwindcss@^3.2.4:
-  version "3.2.4"
-  resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.2.4.tgz#afe3477e7a19f3ceafb48e4b083e292ce0dc0250"
-  integrity sha512-AhwtHCKMtR71JgeYDaswmZXhPcW9iuI9Sp2LvZPo9upDZ7231ZJ7eA9RaURbhpXGVlrjX4cFNlB4ieTetEb7hQ==
+tailwindcss@^3.3.2:
+  version "3.3.2"
+  resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.3.2.tgz#2f9e35d715fdf0bbf674d90147a0684d7054a2d3"
+  integrity sha512-9jPkMiIBXvPc2KywkraqsUfbfj+dHDb+JPWtSJa9MLFdrPyazI7q6WX2sUrm7R9eVR7qqv3Pas7EvQFzxKnI6w==
   dependencies:
+    "@alloc/quick-lru" "^5.2.0"
     arg "^5.0.2"
     chokidar "^3.5.3"
-    color-name "^1.1.4"
-    detective "^5.2.1"
     didyoumean "^1.2.2"
     dlv "^1.1.3"
     fast-glob "^3.2.12"
     glob-parent "^6.0.2"
     is-glob "^4.0.3"
-    lilconfig "^2.0.6"
+    jiti "^1.18.2"
+    lilconfig "^2.1.0"
     micromatch "^4.0.5"
     normalize-path "^3.0.0"
     object-hash "^3.0.0"
     picocolors "^1.0.0"
-    postcss "^8.4.18"
-    postcss-import "^14.1.0"
-    postcss-js "^4.0.0"
-    postcss-load-config "^3.1.4"
-    postcss-nested "6.0.0"
-    postcss-selector-parser "^6.0.10"
+    postcss "^8.4.23"
+    postcss-import "^15.1.0"
+    postcss-js "^4.0.1"
+    postcss-load-config "^4.0.1"
+    postcss-nested "^6.0.1"
+    postcss-selector-parser "^6.0.11"
     postcss-value-parser "^4.2.0"
-    quick-lru "^5.1.1"
-    resolve "^1.22.1"
+    resolve "^1.22.2"
+    sucrase "^3.32.0"
 
 tapable@^2.2.0:
   version "2.2.1"
@@ -3594,6 +3676,20 @@ text-table@^0.2.0:
   resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
   integrity sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==
 
+thenify-all@^1.0.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/thenify-all/-/thenify-all-1.6.0.tgz#1a1918d402d8fc3f98fbf234db0bcc8cc10e9726"
+  integrity sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==
+  dependencies:
+    thenify ">= 3.1.0 < 4"
+
+"thenify@>= 3.1.0 < 4":
+  version "3.3.1"
+  resolved "https://registry.yarnpkg.com/thenify/-/thenify-3.3.1.tgz#8932e686a4066038a016dd9e2ca46add9838a95f"
+  integrity sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==
+  dependencies:
+    any-promise "^1.0.0"
+
 through@^2.3.8:
   version "2.3.8"
   resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5"
@@ -3636,6 +3732,11 @@ tr46@~0.0.3:
   resolved "https://registry.yarnpkg.com/tr46/-/tr46-0.0.3.tgz#8184fd347dac9cdc185992f3a6622e14b9d9ab6a"
   integrity sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==
 
+ts-interface-checker@^0.1.9:
+  version "0.1.13"
+  resolved "https://registry.yarnpkg.com/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz#784fd3d679722bc103b1b4b8030bcddb5db2a699"
+  integrity sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==
+
 tsconfig-paths@^3.14.1:
   version "3.14.1"
   resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.14.1.tgz#ba0734599e8ea36c862798e920bcf163277b137a"
@@ -3725,10 +3826,10 @@ universalify@^2.0.0:
   resolved "https://registry.yarnpkg.com/universalify/-/universalify-2.0.0.tgz#75a4984efedc4b08975c5aeb73f530d02df25717"
   integrity sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==
 
-update-browserslist-db@^1.0.9:
-  version "1.0.10"
-  resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.10.tgz#0f54b876545726f17d00cd9a2561e6dade943ff3"
-  integrity sha512-OztqDenkfFkbSG+tRxBeAnCVPckDBcvibKd35yDONx6OU8N7sqgwc7rCbkJ/WcYtVRZ4ba68d6byhC21GFh7sQ==
+update-browserslist-db@^1.0.11:
+  version "1.0.11"
+  resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.11.tgz#9a2a641ad2907ae7b3616506f4b977851db5b940"
+  integrity sha512-dCwEFf0/oT85M1fHBg4F0jtLwJrutGoHSQXCh7u4o2t1drG+c0a9Flnqww6XUKSfQMPpJBRjU8d4RXB09qtvaA==
   dependencies:
     escalade "^3.1.1"
     picocolors "^1.0.0"
@@ -3835,7 +3936,7 @@ ws@8.13.0:
   resolved "https://registry.yarnpkg.com/ws/-/ws-8.13.0.tgz#9a9fb92f93cf41512a0735c8f4dd09b8a1211cd0"
   integrity sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==
 
-xtend@^4.0.0, xtend@^4.0.2:
+xtend@^4.0.0:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"
   integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==
@@ -3845,11 +3946,16 @@ yallist@^4.0.0:
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
   integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==
 
-yaml@^1.10.0, yaml@^1.10.2:
+yaml@^1.10.0:
   version "1.10.2"
   resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b"
   integrity sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==
 
+yaml@^2.1.1:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/yaml/-/yaml-2.3.1.tgz#02fe0975d23cd441242aa7204e09fc28ac2ac33b"
+  integrity sha512-2eHWfjaoXgTBC2jNM1LRef62VQa0umtvRiDSk6HSzW7RvS5YtkabJrwYLLEKWBc8a5U2PTSCs+dJjUTJdlHsWQ==
+
 yauzl@^2.10.0:
   version "2.10.0"
   resolved "https://registry.yarnpkg.com/yauzl/-/yauzl-2.10.0.tgz#c7eb17c93e112cb1086fa6d8e51fb0667b79a5f9"