search

src/components/SearchProduct/SearchProduct.jsx

@@ -94,10 +94,23 @@ const SearchProduct = ({onClose}) => {
             >
                 {searchedProducts.length > 0 ? (
                     searchedProducts.map((product) => (
-                        <Grid className="animate__animated animate__fadeIn" item size={{ xs: 12, sm: 12, md: 6 }} sx={{p:1}}>
+                        <Grid className="animate__animated animate__fadeIn" item size={12}>
                             <Card
                                 key={product.id}
-                                sx={{ display: 'flex', alignItems: 'center', p: 2, cursor:"pointer" }}
+                                sx={{
+                                    display: 'flex',
+                                    alignItems: 'center',
+                                    py: 2,
+                                    px: 12.5,
+                                    cursor: "pointer",
+                                    backgroundColor: "rgba(255,255,255,0.2)",
+                                    boxShadow: "none",
+                                    borderBottom: "1px solid rgba(0,0,0,0.2)",
+                                    transition: "all 0.3s ease-in-out",
+                                    ":hover": {
+                                      backgroundColor: "#95AAC5"
+                                    }
+                                  }}
                                 onClick={() => {
                                     window.location.href = `/products/${product?.handle}`
                                 }}