🎨 styles: product in cart

:%s

src/components/common/CartDrawer/components/ProductCartItem/ProductCartItem.module.scss

@@ -5,7 +5,6 @@
     grid-template-columns: 2fr 1fr;
     padding-bottom: 1.6rem;
     padding-top: 1.6rem;
-    border-bottom: 1px solid var(--border-line);
     .info {
         @apply flex;
         .imgWrap {
@@ -18,6 +17,11 @@
         }
         .detail {
             min-height: 9rem;
+            .name {
+                &:hover {
+                    color: var(--primary);
+                }
+            }
             .price {
                 margin-top: 0.8rem;
                 .old {

src/components/common/CartDrawer/components/ProductsInCart/ProductsInCart.module.scss

@@ -1,5 +1,9 @@
-
 .productsInCart {
     padding: 1.6rem 1.6rem 0 1.6rem;
-    margin-bottom: -1px;
+    list-style: none;
-}
+    li {
+        &:not(:last-child) {
+            border-bottom: 1px solid var(--border-line);
+        }
+    }
+}

src/components/common/CartDrawer/components/ProductsInCart/ProductsInCart.tsx

@@ -8,20 +8,22 @@ interface Props {
 
 const ProductsInCart = ({ data }: Props) => {
   return (
-    <div className={s.productsInCart}>
+    <ul className={s.productsInCart}>
       {
-        data.map(item => <ProductCartItem
+        data.map(item => <li key={item.name}>
-          key={item.name}
+          <ProductCartItem
-          name={item.name}
+            name={item.name}
-          weight={item.weight}
+            slug={item.slug}
-          price={item.price}
+            weight={item.weight}
-          oldPrice={item.oldPrice}
+            price={item.price}
-          discount={item.discount}
+            oldPrice={item.oldPrice}
-          imageSrc={item.imageSrc}
+            discount={item.discount}
-          quantity={item.quantity}
+            imageSrc={item.imageSrc}
-        />)
+            quantity={item.quantity}
+          />
+        </li>)
       }
-    </div>
+    </ul>
   )
 }
 

src/utils/constanst.utils.ts

@@ -8,6 +8,7 @@ export const SOCIAL_LINKS = {
 export const ROUTE = {
     HOME: '/',
     PRODUCTS: '/products',
+    PRODUCT_DETAIL: '/product',
     ABOUT: '/about',
     ACCOUNT: '/account',
     RECIPES: '/recipes',