add collection hover style

src/components/Navbar/Navbar.jsx

@@ -200,7 +200,11 @@ const Navbar = () => {
             height: "100%",
             paddingTop: "85%",
             position: "relative",
-            cursor: "pointer"
+            cursor: "pointer",
+            transition: "transform 0.3s ease",
+            ":hover": {
+              transform: "scale(1.1)"
+            }
           }}
           onClick={() => {
             sessionStorage.setItem('amber-select-collection', title)
@@ -240,10 +244,13 @@ const Navbar = () => {
   };
 
   const displayCollectionList = (collection, productType) => {
-    setDisplayCollection({
-      productType,
-      list: collection
-    })
+    setDisplayCollection([])
+    setTimeout(() => {
+      setDisplayCollection({
+        productType,
+        list: collection
+      })
+    }, 200);
   }
 
   const hideCollectionList = () => {
@@ -261,11 +268,11 @@ const Navbar = () => {
           ":hover": {
             backgroundColor: "rgba(255,255,255,1) !important",
             backdropFilter: "none !important",
-            '& .navItem':{
-              color:"black !important"
+            '& .navItem': {
+              color: "black !important"
             },
-            '& .navItem:hover':{
-              color:"#95AAC5 !important"
+            '& .navItem:hover': {
+              color: "#95AAC5 !important"
             },
           }
         }}