diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css index 548eabb..d2d5868 100644 --- a/styles/css/vtex.store-components.css +++ b/styles/css/vtex.store-components.css @@ -216,4 +216,59 @@ margin: 0 auto; width: 48px; height: 48px; +} + +.shippingContainer { + display: flex; + align-items: center; +} +.shippingContainer :global(.vtex-address-form__postalCode) { + padding-bottom: 0; +} +.shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-input)::before { + content: "CALCULAR FRETE:"; + font-weight: 400; + font-size: 14px; + line-height: 19px; + color: #929292; +} +.shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-input) :global(.vtex-input__label) { + display: none; +} +.shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-input) :global(.vtex-input-prefix__group) { + margin-top: 8px; + height: 49px; + border-radius: 0; +} +.shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-address-form__postalCode-forgottenURL) :last-child { + text-decoration-line: underline; + color: #000000; + font-weight: 400; + font-size: 12px; + line-height: 16px; + padding-top: 0; + position: relative; + left: 312px; + bottom: 45px; +} +.shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-address-form__postalCode-forgottenURL) :last-child :last-child { + display: none; +} +.shippingContainer :global(.vtex-button) { + width: 49px; + height: 49px; + background: #000000; + border-radius: 0; + border: none; + bottom: 1px; +} +.shippingContainer :global(.vtex-button) :global(.vtex-button__label) { + display: none; +} +.shippingContainer :global(.vtex-button)::after { + content: "OK"; + color: #ffffff; + font-weight: 600; + font-size: 14px; + line-height: 19px; } \ No newline at end of file diff --git a/styles/sass/pages/product/store-components/vtex.store-components.scss b/styles/sass/pages/product/store-components/vtex.store-components.scss index 1b1fa29..3e69e9a 100644 --- a/styles/sass/pages/product/store-components/vtex.store-components.scss +++ b/styles/sass/pages/product/store-components/vtex.store-components.scss @@ -217,3 +217,64 @@ } } } + +// Calculadora de Frete + +.shippingContainer { + display: flex; + align-items: center; + :global(.vtex-address-form__postalCode) { + padding-bottom: 0; + :global(.vtex-input)::before { + content: "CALCULAR FRETE:"; + font-weight: 400; + font-size: 14px; + line-height: 19px; + color: #929292; + } + :global(.vtex-input) { + :global(.vtex-input__label) { + display: none; + } + :global(.vtex-input-prefix__group) { + margin-top: 8px; + height: 49px; + border-radius: 0; + } + } + :global(.vtex-address-form__postalCode-forgottenURL) { + :last-child { + text-decoration-line: underline; + color: #000000; + font-weight: 400; + font-size: 12px; + line-height: 16px; + padding-top: 0; + position: relative; + left: 312px; + bottom: 45px; + :last-child { + display: none; + } + } + } + } + :global(.vtex-button) { + width: 49px; + height: 49px; + background: #000000; + border-radius: 0; + border: none; + bottom: 1px; + :global(.vtex-button__label) { + display: none; + } + } + :global(.vtex-button)::after { + content: "OK"; + color: #ffffff; + font-weight: 600; + font-size: 14px; + line-height: 19px; + } +}