diff --git a/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss b/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss index ed7b3cd..179f24e 100644 --- a/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss +++ b/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss @@ -165,6 +165,13 @@ .client-pre-email-h label { margin-top: 0; + + @media (max-width: 1024px) { + display: flex; + align-items: center; + justify-content: center; + flex-wrap: wrap; + } } .link-cart { @@ -182,6 +189,12 @@ line-height: 33px; } + @media (max-width: 1024px) { + font-size: 10px; + line-height: 12px; + padding-right: 16px; + } + &:hover { color: lighen($color-black, 10); } @@ -199,6 +212,10 @@ justify-content: center; margin-top: 65px; + @media (max-width: 1024px) { + padding: 0 16px; + } + h3 { margin-bottom: 16px; width: 825px; @@ -207,6 +224,10 @@ width: 1631px; } + @media (max-width: 860px) { + width: 100%; + } + span, small { font-family: $font-family-secundary; @@ -223,6 +244,17 @@ line-height: 47px; margin-bottom: 23px; } + + @media (max-width: 1024px) { + font-size: 14px; + line-height: 16px; + margin-bottom: 0; + } + + @media (max-width: 590px) { + font-size: 12px; + line-height: 14px; + } } } } @@ -235,6 +267,14 @@ width: 990px; } + @media (max-width: 1024px) { + width: 100%; + display: flex; + align-items: center; + justify-content: center; + flex-wrap: wrap; + } + input { box-shadow: none; color: $color-black2; @@ -242,7 +282,7 @@ padding: 15px 14px; border: 1px solid $color-black2; box-sizing: border-box; - border-radius: 5px; + border-radius: 5px 00 5px; width: 443px; height: 50px; font-style: normal; @@ -256,6 +296,23 @@ font-size: 24px; line-height: 33px; } + + @media (max-width: 1024px) { + width: 85%; + } + + @media (max-width: 860px) { + width: 82%; + } + + @media (max-width: 590px) { + width: 66.3% !important; + border-radius: 5px; + } + + @media (max-width: 490px) { + width: 100% !important; + } } button { @@ -286,12 +343,32 @@ padding: 12px 17px; } + @media (max-width: 1024px) { + width: 14.7%; + right: 2px; + padding: 12px 0; + } + + @media (max-width: 860px) { + width: 18%; + } + + @media (max-width: 590px) { + width: 33.7%; + } + @media (max-width: 490px) { - height: 48px; + height: 52px; margin: 0; position: absolute; + right: -2px; } + @media (max-width: 340px) { + font-size: 12px; + line-height: 16px; + } + &:hover { background-color: $color-blue3; } @@ -321,11 +398,19 @@ border: 1px solid $color-black2; border-radius: 5px; width: 400px; - height: 150px; + min-height: 150px; @include mq(xg, min) { width: 776px; - height: 238px; + min-height: 238px; + } + + @media (max-width: 1024px) { + width: 343px; + } + + @media (max-width: 375px) { + width: 91.47%; } h3 { @@ -519,7 +604,6 @@ font-size: 32px; line-height: 37px; } - } span { diff --git a/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss b/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss index 28841f8..6d1f729 100644 --- a/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss +++ b/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss @@ -630,9 +630,10 @@ .srp-container { padding: 0 0 0 10px; - @include mq(md, max) { + @media (max-width: 1024px) { padding: 0 16px; } + .srp-main-title { margin: 0 0 11px 0; font-style: normal; @@ -1250,7 +1251,7 @@ } .accordion-group { - @media (max-width: 767px) { + @media (max-width: 1024px) { width: 96.8%; margin: auto; padding: 0 4px; @@ -1336,9 +1337,6 @@ @media (max-width: 1024px) { width: 100%; - } - - @include mq(md, max) { padding: 0 16px; float: none; } diff --git a/checkout/src/arquivos/sass/checkout/_checkout.scss b/checkout/src/arquivos/sass/checkout/_checkout.scss index 1098283..ee5a2b6 100644 --- a/checkout/src/arquivos/sass/checkout/_checkout.scss +++ b/checkout/src/arquivos/sass/checkout/_checkout.scss @@ -60,6 +60,10 @@ body { .container-cart { width: 96.875%; + @media (max-width: 1024px) { + width: 100%; + } + @include mq(xm, min) { width: 80%; } @@ -108,10 +112,9 @@ body { margin: 17px 0 16px; } - @media (max-width: 767px) { + @media (max-width: 1024px) { padding: 0 16px; } - } #orderform-title {