From a961b43253281f402b8ccdd219f1da51d4e14c0f Mon Sep 17 00:00:00 2001
From: ThiagoDuutra <thiagoduutra01@gmail.com>
Date: Wed, 14 Dec 2022 16:03:35 -0300
Subject: [PATCH] feat: cria responsidade reader

---
 checkout/src/arquivos/js/components/Header.js |  3 +-
 .../src/arquivos/sass/partials/_header.scss   | 57 ++++++++++++++++++-
 2 files changed, 56 insertions(+), 4 deletions(-)

diff --git a/checkout/src/arquivos/js/components/Header.js b/checkout/src/arquivos/js/components/Header.js
index fc1b377..9d0ff04 100644
--- a/checkout/src/arquivos/js/components/Header.js
+++ b/checkout/src/arquivos/js/components/Header.js
@@ -10,6 +10,7 @@ export default class Header {
         await this.selectors();
         this.progressBarDesktop();
         await this.stepBarProcess();
+        this.containerMain();
     }
 
     async selectors() {
@@ -58,7 +59,7 @@ export default class Header {
         </ul>
         `;
         }
-        if (this.progressBar && window.innerWidth < 1024) {
+        if (this.progressBar && window.innerWidth <= 1024) {
             this.progressBar.innerHTML = "";
         }
     }
diff --git a/checkout/src/arquivos/sass/partials/_header.scss b/checkout/src/arquivos/sass/partials/_header.scss
index 1061d5e..3ee4977 100644
--- a/checkout/src/arquivos/sass/partials/_header.scss
+++ b/checkout/src/arquivos/sass/partials/_header.scss
@@ -3,14 +3,26 @@
     max-width: 100%;
     width: 100%;
     border-bottom: 1px solid $color-black;
+
     .container {
-        width: 80% !important;
+        width: 80%;
         padding: 29px 0;
+
+        @media (min-width: 275px) and (max-width: 1024px) {
+            width: 100%;
+            margin: 16px 0;
+            padding: 0;
+        }
     }
+
     &__wrapper {
         display: flex;
         align-items: center;
         justify-content: space-between;
+
+        @media (max-width: 1024px) {
+            margin: 0 16px;
+        }
     }
 
     &__logo {
@@ -18,6 +30,10 @@
             height: 37px;
             width: auto;
         }
+
+        @media (max-width: 375px) {
+            width: 100%;
+        }
     }
 
     &__safeBuy {
@@ -42,6 +58,10 @@
             height: 15px;
             margin-right: 8px;
         }
+
+        @media (max-width: 375px) {
+            width: 100%;
+        }
     }
     #progressBar {
         width: 43%;
@@ -100,7 +120,7 @@
                 &__line {
                     position: absolute;
                     left: 27%;
-                    width: calc(100% + 25px);
+                    width: calc(100% + 50px);
                     bottom: 5px;
                     transform: translateY(-50%);
                     height: 1px;
@@ -110,7 +130,7 @@
                 &__line2 {
                     position: absolute;
                     right: 21%;
-                    width: calc(100% + 30px);
+                    width: calc(100% + 60px);
                     bottom: 5px;
                     transform: translateY(-50%);
                     height: 1px;
@@ -126,3 +146,34 @@
         }
     }
 }
+
+.container-main {
+    // background-color: burlywood;
+    #cart-title {
+        // display: none !important;
+    }
+
+    .empty-cart-content {
+        .empty-cart-title {
+            font-size: 24px;
+            font-family: $font-family;
+        }
+        .empty-cart-message {
+            display: none;
+        }
+        .empty-cart-links {
+            .btn {
+                width: 327px;
+                background-color: transparent;
+                border: 1px solid $color-black;
+                border-radius: 0;
+                color: $color-black;
+            }
+
+            // .btn::after {
+            //     content: "continuar comprando";
+            //     color: $color-black;
+            // }
+        }
+    }
+}
-- 
2.34.1