checkout/src/arquivos/js/components/Footer.js

@@ -66,12 +66,21 @@ export default class Footer {
     async addCarrossel() {
         const elemento = document.querySelector(".sliderPratileira");
 
-        $(elemento).slick({
+        if (window.screen.width > 1024) {
-            slidesToShow: 4,
+            $(elemento).slick({
-            slidesToScroll: 1,
+                slidesToShow: 4,
-            infinite: true,
+                slidesToScroll: 1,
-            arrows: true,
+                infinite: true,
-        });
+                arrows: true,
+            });
+        } else {
+            $(elemento).slick({
+                slidesToShow: 3,
+                slidesToScroll: 1,
+                infinite: true,
+                arrows: true,
+            });
+        }
     }
 
     async api() {

checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss

@@ -19,11 +19,82 @@
         padding: 16px;
         margin-bottom: 48px;
 
-        @include mq(md, max) {
+        @media (max-width: 1024px) {
-            margin: 0px 0 25px 0;
+            .table.cart-items {
-            border-left: none;
+                thead {
-            border-right: none;
+                    display: none;
-            border-radius: 0;
+                }
+
+                tbody {
+                    .product-item {
+                        display: grid;
+                        grid-template-areas: "colunaOne colunaTwo colunaThree";
+                        grid-template-columns: 60px 1fr 1fr;
+                        justify-content: space-between;
+
+                        .product-image {
+                            grid-area: colunaOne;
+                        }
+
+                        .product-name {
+                            grid-area: colunaTwo;
+                            padding-left: 16px;
+                        }
+
+                        .quantity {
+                            grid-area: colunaTwo;
+                            margin-left: 16px;
+                            align-self: end;
+
+                            input {
+                                padding: 16px 0;
+                            }
+                        }
+
+                        .product-price {
+                            grid-area: colunaThree;
+                            align-self: end;
+                            display: flex;
+                            flex-direction: column;
+                            justify-content: flex-end;
+                            padding: 0;
+
+                            .list-price {
+                                display: flex;
+                                justify-content: flex-end;
+                            }
+
+                            .best-price {
+                                display: flex;
+                                justify-content: flex-end;
+                                gap: 0;
+
+                                .new-product-price {
+                                    padding-left: 5px;
+                                }
+                            }
+                        }
+
+                        .item-remove {
+                            grid-area: colunaThree;
+                            align-self: start;
+                            padding: 0;
+                            width: inherit;
+
+                            .item-link-remove {
+                                display: flex;
+                                padding: 0;
+                                justify-content: end;
+                            }
+                        }
+                    }
+                }
+            }
+
+            .shipping-date,
+            .quantity-price {
+                display: none;
+            }
         }
     }
 
@@ -496,6 +567,19 @@
     }
 
     .summary {
+        @media (max-width: 1024px) {
+            display: flex;
+            flex-direction: column;
+
+            .cart-more-options {
+                margin-bottom: 48px;
+            }
+
+            .summary-totalizers.cart-totalizers {
+                width: 100%;
+                margin: 0;
+            }
+        }
         .cart-more-options {
             margin: 0;
             width: max-content;
@@ -946,16 +1030,9 @@
         flex-direction: column;
         width: 354px;
 
-        @include mq(md, max) {
+        @media screen and (max-width: 1024px) {
-            padding: 0 16px;
+            width: 100%;
-            width: calc(100% - 32px);
+            padding-bottom: 43px;
-            float: none;
-            margin-bottom: 50px;
-        }
-
-        @include mq(md, min) {
-            margin: 0;
-            padding-bottom: 50px;
         }
 
         .link-choose-more-products-wrapper {

checkout/src/arquivos/sass/checkout/_checkout.scss

@@ -55,6 +55,11 @@ body {
     .container-order-form,
     .container-cart {
         width: 80%;
+
+        @media screen and (max-width: 1024px) {
+            width: 100%;
+            padding: 16px;
+        }
     }
 }
 

checkout/src/arquivos/sass/lib/_slick.scss

@@ -115,6 +115,15 @@
     z-index: 4;
     right: 20px;
 }
+
+@media (max-width: 1024px) {
+    .slick-next {
+        right: 27px;
+    }
+    .slick-prev {
+        left: 29px;
+    }
+}
 .slick-arrow.slick-hidden {
     display: none;
 }

checkout/src/arquivos/sass/partials/_footer.scss

@@ -241,6 +241,24 @@
                     font-size: 13px;
                 }
             }
+
+            @media (max-width: 1024px) {
+                width: 100%;
+                padding: 0 8px;
+
+                .slick-track {
+                    gap: 15px;
+                }
+
+                .card-list-pratileira {
+                    figure {
+                        .image-card-pratileira {
+                            width: 100%;
+                            height: 320px;
+                        }
+                    }
+                }
+            }
         }
         .slick-track {
             display: flex;

checkout/src/arquivos/sass/utils/_variaveis.scss

@@ -24,12 +24,10 @@ $color-green: #4caf50;
 
 /* Grid breakpoints */
 $grid-breakpoints: (
-    xs: 0,
+    sm: 375px,
-    cstm: 400,
+    md: 1024px,
-    sm: 576px,
+    // lg: 992px,
-    md: 768px,
+    // xl: 1200px,,
-    lg: 992px,
-    xl: 1200px,
 ) !default;
 
 $z-index: (