diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc index 28dc2c7..e613ae0 100644 --- a/store/blocks/pdp/product.jsonc +++ b/store/blocks/pdp/product.jsonc @@ -395,7 +395,8 @@ "colGap": 7, "marginTop": 4, "marginBottom": 7, - "paddingTop": 7 + "paddingTop": 7, + "blockClass": "conteudo-principal" }, "children": [ "flex-layout.col#stack", diff --git a/styles/css/vtex.flex-layout.css b/styles/css/vtex.flex-layout.css index 82fe0d7..8145ee4 100644 --- a/styles/css/vtex.flex-layout.css +++ b/styles/css/vtex.flex-layout.css @@ -21,6 +21,9 @@ .flexRowContent--container-compra .stretchChildrenWidth { height: 49px; } +.flexRowContent--container-compra .stretchChildrenWidth :global(.vtex-button) { + height: 49px; +} .flexRowContent--preco { margin: 0; diff --git a/styles/css/vtex.product-identifier.css b/styles/css/vtex.product-identifier.css index d32ad6f..2a4d494 100644 --- a/styles/css/vtex.product-identifier.css +++ b/styles/css/vtex.product-identifier.css @@ -10,7 +10,7 @@ @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap"); .product-identifier { position: absolute; - top: 29px; + top: 37px; right: 0; font-weight: 400; font-size: 14px; diff --git a/styles/css/vtex.rich-text.css b/styles/css/vtex.rich-text.css index cc3f142..ae62805 100644 --- a/styles/css/vtex.rich-text.css +++ b/styles/css/vtex.rich-text.css @@ -22,5 +22,11 @@ @media only screen and (max-width: 768px) { .heading--shelf-title { font-size: 20px; + margin-bottom: 16px; + } +} +@media only screen and (max-width: 1024px) { + .heading--shelf-title { + margin-bottom: 24px; } } \ No newline at end of file diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css index 3dfe87a..41f8a09 100644 --- a/styles/css/vtex.store-components.css +++ b/styles/css/vtex.store-components.css @@ -256,6 +256,11 @@ .subscriberContainer { padding-top: 77px; } +@media only screen and (max-width: 1024px) { + .subscriberContainer { + padding: 0; + } +} .subscriberContainer .title { font-size: 0; margin: 0; @@ -287,11 +292,32 @@ max-width: 399px; margin-top: 16px; gap: 8px; + display: flex; +} +@media only screen and (max-width: 1024px) { + .subscriberContainer .form .content { + max-width: 375px; + } +} +@media only screen and (max-width: 768px) { + .subscriberContainer .form .content { + max-width: 295px; + } +} +@media only screen and (min-width: 1440px) { + .subscriberContainer .form .content { + max-width: 100%; + } } .subscriberContainer .form .content .input { margin: 0; width: 195.5px; } +@media only screen and (min-width: 1440px) { + .subscriberContainer .form .content .input { + width: 50%; + } +} .subscriberContainer .form .content .submit { position: absolute; top: 55px; diff --git a/styles/sass/pages/product/vtex.flex-layout.scss b/styles/sass/pages/product/vtex.flex-layout.scss index 3b1f4f4..10cf74c 100644 --- a/styles/sass/pages/product/vtex.flex-layout.scss +++ b/styles/sass/pages/product/vtex.flex-layout.scss @@ -10,6 +10,10 @@ .stretchChildrenWidth { height: 49px; + + :global(.vtex-button) { + height: 49px; + } } } .flexRowContent--preco { diff --git a/styles/sass/pages/product/vtex.product-identifier.scss b/styles/sass/pages/product/vtex.product-identifier.scss index ffc41e6..b2bd7c0 100644 --- a/styles/sass/pages/product/vtex.product-identifier.scss +++ b/styles/sass/pages/product/vtex.product-identifier.scss @@ -1,6 +1,6 @@ .product-identifier { position: absolute; - top: 29px; + top: 37px; right: 0; font-weight: 400; font-size: 14px; diff --git a/styles/sass/pages/product/vtex.rich-text.scss b/styles/sass/pages/product/vtex.rich-text.scss index 067def9..bcefe0e 100644 --- a/styles/sass/pages/product/vtex.rich-text.scss +++ b/styles/sass/pages/product/vtex.rich-text.scss @@ -11,5 +11,10 @@ @include mq(sm, max) { font-size: 20px; + margin-bottom: 16px; + } + + @include mq(md, max) { + margin-bottom: 24px; } } diff --git a/styles/sass/pages/product/vtex.store-components.scss b/styles/sass/pages/product/vtex.store-components.scss index 3491a6b..b3349a7 100644 --- a/styles/sass/pages/product/vtex.store-components.scss +++ b/styles/sass/pages/product/vtex.store-components.scss @@ -300,6 +300,10 @@ .subscriberContainer { padding-top: 77px; + + @include mq(md, max) { + padding: 0; + } .title { font-size: 0; margin: 0; @@ -337,10 +341,27 @@ max-width: 399px; margin-top: 16px; gap: 8px; + display: flex; + + @include mq(md, max) { + max-width: 375px; + } + + @include mq(sm, max) { + max-width: 295px; + } + + @include mq(lg, min) { + max-width: 100%; + } .input { margin: 0; width: 195.5px; + + @include mq(lg, min) { + width: 50%; + } } .submit {