From 8365bff72b6f575fa10786d0b1670367748ef3ab Mon Sep 17 00:00:00 2001
From: Sabrina Miranda <sabrina.miranda1@bol.com.br>
Date: Wed, 14 Dec 2022 15:39:49 -0300
Subject: [PATCH] feat(header): Aplica css no header desktop para telas a
 partir de 2500px

---
 .../src/arquivos/sass/partials/_header.scss   | 47 +++++++++++++++++--
 .../src/arquivos/sass/utils/_variaveis.scss   |  3 +-
 2 files changed, 46 insertions(+), 4 deletions(-)

diff --git a/checkout/src/arquivos/sass/partials/_header.scss b/checkout/src/arquivos/sass/partials/_header.scss
index 3c46fd9..2f0e98e 100644
--- a/checkout/src/arquivos/sass/partials/_header.scss
+++ b/checkout/src/arquivos/sass/partials/_header.scss
@@ -5,7 +5,11 @@
         padding: 29px 0;
 
         #progressBar {
-            width: 439px;
+            width: 440px;
+
+            @include mq(xg, min) {
+                width: 1081px;
+            }
 
             ul {
                 list-style-type: none;
@@ -20,7 +24,7 @@
                 flex-direction: column;
                 align-items: center;
                 justify-content: center;
-                width: 39.40%;
+                width: 100%;
             }
 
             li .container-li {
@@ -63,6 +67,12 @@
                 font-weight: 400;
                 color: $color-black2;
                 margin-bottom: 9px;
+
+                @include mq(xg, min) {
+                    line-height: 28px;
+                    font-size: 24px;
+                    margin-bottom: 15px;
+                }
             }
 
             #progress-bar-circle-1,
@@ -74,6 +84,11 @@
                 background-color: $color-white;
                 border-radius: 50%;
                 z-index: map-get($z-index, level2 );
+
+                @include mq(xg, min) {
+                    width: 24px;
+                    height: 24px;
+                }
             }
 
             #progress-bar-circle-1.active,
@@ -86,18 +101,31 @@
             .progress-bar-line-1,
             .progress-bar-line-2 {
                 position: absolute;
-                width: 177px;
+                width: 176px;
                 height: 1px;
                 border-top: 1px solid $color-black2;
                 bottom: 5px;
+
+                @include mq(xg, min) {
+                    width: 449px;
+                    bottom: 10px;
+                }
             }
 
             .progress-bar-line-1 {
                 left: 25%;
+
+                @include mq(xg, min) {
+                    left: 21.5%;
+                }
             }
 
             .progress-bar-line-2 {
                 right: 25%;
+
+                @include mq(xg, min) {
+                    right: 21.5%;
+                }
             }
         }
     }
@@ -112,6 +140,10 @@
         display: block;
         width: 53.741%;
 
+        @include mq(xg, min) {
+            width: 382px;
+        }
+
         img {
             width: 100%;
             height: auto;
@@ -134,10 +166,19 @@
             font-size: 12px;
             line-height: 16px;
             color: $color-black;
+
+            @include mq(xg, min) {
+                line-height: 33px;
+                font-size: 24px;
+            }
         }
 
         img {
             width: 12px;
+
+            @include mq(xg, min) {
+                width: 29px;
+            }
         }
     }
 }
diff --git a/checkout/src/arquivos/sass/utils/_variaveis.scss b/checkout/src/arquivos/sass/utils/_variaveis.scss
index 02599ac..0dfa0b5 100644
--- a/checkout/src/arquivos/sass/utils/_variaveis.scss
+++ b/checkout/src/arquivos/sass/utils/_variaveis.scss
@@ -27,7 +27,8 @@ $grid-breakpoints: (
 	sm: 576px,
 	md: 768px,
 	lg: 992px,
-	xl: 1200px
+	xl: 1200px,
+    xg : 2500px
 ) !default;
 
 $z-index: (