瀏覽代碼

add collection hover style

master
azri 3 月之前
父節點
當前提交
2255da57cb
共有 1 個文件被更改,包括 16 次插入9 次删除
  1. 16
    9
      src/components/Navbar/Navbar.jsx

+ 16
- 9
src/components/Navbar/Navbar.jsx 查看文件

200
             height: "100%",
200
             height: "100%",
201
             paddingTop: "85%",
201
             paddingTop: "85%",
202
             position: "relative",
202
             position: "relative",
203
-            cursor: "pointer"
203
+            cursor: "pointer",
204
+            transition: "transform 0.3s ease",
205
+            ":hover": {
206
+              transform: "scale(1.1)"
207
+            }
204
           }}
208
           }}
205
           onClick={() => {
209
           onClick={() => {
206
             sessionStorage.setItem('amber-select-collection', title)
210
             sessionStorage.setItem('amber-select-collection', title)
240
   };
244
   };
241
 
245
 
242
   const displayCollectionList = (collection, productType) => {
246
   const displayCollectionList = (collection, productType) => {
243
-    setDisplayCollection({
244
-      productType,
245
-      list: collection
246
-    })
247
+    setDisplayCollection([])
248
+    setTimeout(() => {
249
+      setDisplayCollection({
250
+        productType,
251
+        list: collection
252
+      })
253
+    }, 200);
247
   }
254
   }
248
 
255
 
249
   const hideCollectionList = () => {
256
   const hideCollectionList = () => {
261
           ":hover": {
268
           ":hover": {
262
             backgroundColor: "rgba(255,255,255,1) !important",
269
             backgroundColor: "rgba(255,255,255,1) !important",
263
             backdropFilter: "none !important",
270
             backdropFilter: "none !important",
264
-            '& .navItem':{
265
-              color:"black !important"
271
+            '& .navItem': {
272
+              color: "black !important"
266
             },
273
             },
267
-            '& .navItem:hover':{
268
-              color:"#95AAC5 !important"
274
+            '& .navItem:hover': {
275
+              color: "#95AAC5 !important"
269
             },
276
             },
270
           }
277
           }
271
         }}
278
         }}

Loading…
取消
儲存