diff --git a/checkout/src/arquivos/js/components/Footer.js b/checkout/src/arquivos/js/components/Footer.js index b048ae0..d67b7f3 100644 --- a/checkout/src/arquivos/js/components/Footer.js +++ b/checkout/src/arquivos/js/components/Footer.js @@ -46,7 +46,6 @@ export default class Footer { tituloCheckoutVazio.style.display = "none"; } else if (changeAttrName.display == "none") { tituloCheckoutVazio.style.display = "block"; - this.criaPrateleira(); } @@ -56,8 +55,11 @@ export default class Footer { window.addEventListener("hashchange", () => { if (window.location.hash == "#/cart") { this.prateleira.style.display = "block"; + tituloCheckoutVazio.style.display = "block"; + } else { this.prateleira.style.display = "none"; + tituloCheckoutVazio.style.display = "none"; } }); @@ -126,6 +128,9 @@ export default class Footer { this.prateleira.innerHTML = ""; tituloCheckoutVazio.style.display = "none"; } + if(window.location.href !== "https://m3academy.myvtex.com/checkout/#/cart") { + tituloCheckoutVazio.style.display = "none"; + } } diff --git a/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss b/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss index b99c428..f4058f6 100644 --- a/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss +++ b/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss @@ -837,7 +837,7 @@ border-radius: 8px; background: none; padding: 15px 13px 14px 11px; - + &::before { content: ""; @@ -848,7 +848,7 @@ width: 20px; height: 20px; float: left; - margin: auto 8px auto 0; + margin: 8px 8px 0 0; @include mq(desktop4K, min) { width: 40px; @@ -865,6 +865,8 @@ font-size: 24px; line-height: 33px; } + + } a { font-family: "Open Sans"; @@ -978,18 +980,23 @@ } .form-step { + display: flex; .steps-view { - width: 55%; - float: left; - left: 12px; + flex: 1; + position: inherit; + height: fit-content; + margin-left: 40px; + @include mq(tablet, max) { width: auto; position: inherit; + margin-left: 0; } @include mq(desktop4K, min) { - left: 40.52px; + // left: 40.52px; + margin-left: 40.52px; li, label, diff --git a/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss b/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss index eb8abde..213974c 100644 --- a/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss +++ b/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss @@ -1,10 +1,7 @@ .row-fluid .full-cart.active { margin: 0 0 43.42px; - } - - .cart-template { .cart { border: 1px solid $gray-100; @@ -55,6 +52,7 @@ display: flex; grid-area: quantity; margin: 11px 0 0 16px; + input { margin: 0; } @@ -89,6 +87,13 @@ } .quantity { width: auto; + margin: 0 0 0 16px !important; + + } + } + + @include mq(cstm, max) { + .quantity { margin: 0 0 0 76px !important; } } @@ -114,6 +119,23 @@ padding: 0; text-align: start; + &.quantity { + text-align: start; + border: 1px solid #f0f0f0; + border-radius: 8px; + box-sizing: border-box; + display: flex; + align-items: center; + max-width: 99px; + padding: 9px 11px; + height: 34px; + margin-top: 13px; + + input { + flex: 1; + } + } + &.product-image { height: auto; padding: 0; @@ -548,18 +570,23 @@ a { padding: 12.09px 0 12.72px; - font-family: "Open Sans"; - font-weight: 700; - font-size: 14px; - line-height: 19px; - letter-spacing: 0.05em; - text-transform: uppercase; - - color: $black-500; width: 100%; background-color: $blue-500; border-radius: 8px; border: none; + font-size: 0; + + &::before { + content: "Finalizar compra"; + font-family: "Open Sans"; + font-weight: 700; + font-size: 14px; + line-height: 19px; + letter-spacing: 0.05em; + text-transform: uppercase; + + color: $black-500; + } @include mq(desktop4K, min) { font-size: 24px; @@ -598,9 +625,6 @@ } tr { - - - td { font-family: "Tenor Sans"; font-weight: 400; diff --git a/checkout/src/arquivos/sass/checkout/_checkout-pagamento.scss b/checkout/src/arquivos/sass/checkout/_checkout-pagamento.scss index 323bb09..66ba0f7 100644 --- a/checkout/src/arquivos/sass/checkout/_checkout-pagamento.scss +++ b/checkout/src/arquivos/sass/checkout/_checkout-pagamento.scss @@ -4,9 +4,6 @@ body .container-main.container-order-form .orderform-template.active { margin-left: unset; margin-right: 0; float: right; - border: 1px solid #e5e5e5; - padding: 24px 17px 0; - border-radius: 8px; @include mq(tablet, max) { margin: 17px 16px 0 16px; @@ -15,10 +12,11 @@ body .container-main.container-order-form .orderform-template.active { .cart-fixed { box-sizing: border-box; - max-width: 331px; + border: 1px solid #e5e5e5; + border-radius: 8px; width: auto; position: inherit; - height: auto !important; + max-height: 407px !important; @include mq(tablet, max) { max-width: none; @@ -39,14 +37,9 @@ body .container-main.container-order-form .orderform-template.active { line-height: 19px; color: $black-300; - margin-bottom: 34px; + margin: 24px 17px 34px 17px; border: none; - h2 { - font-size: 32px; - line-height: 37px; - } - @include mq(desktop4K, min) { font-size: 32px; line-height: 37px; @@ -59,7 +52,8 @@ body .container-main.container-order-form .orderform-template.active { margin: 0; li { - padding: 0; + box-sizing: border-box; + padding: 0 17px; margin: 0; border: none; display: flex; @@ -128,6 +122,7 @@ body .container-main.container-order-form .orderform-template.active { line-height: 16px; text-align: right; text-decoration-line: underline; + padding-right: 17px; color: $black-500; @@ -141,7 +136,8 @@ body .container-main.container-order-form .orderform-template.active { .summary-template-holder { border: none; background-color: transparent; - padding: 0; + padding: 0 17px; + box-sizing: border-box; .summary-totalizers { margin: 0; @@ -212,6 +208,7 @@ body .container-main.container-order-form .orderform-template.active { text-transform: uppercase; color: $white-500; border: none; + margin-top: 20px; @include mq(desktop4K, min) { font-size: 28px; diff --git a/checkout/src/arquivos/sass/utils/_variaveis.scss b/checkout/src/arquivos/sass/utils/_variaveis.scss index c3afddf..f5bd775 100644 --- a/checkout/src/arquivos/sass/utils/_variaveis.scss +++ b/checkout/src/arquivos/sass/utils/_variaveis.scss @@ -47,7 +47,7 @@ $gray-1000: #7d7d7d; /* Grid breakpoints */ $grid-breakpoints: ( xs: 0, - cstm: 400, + cstm: 491px, sm: 576px, md: 768px, lg: 992px,