diff --git a/styles/css/vtex.flex-layout.css b/styles/css/vtex.flex-layout.css index ce378da..64a2c4c 100644 --- a/styles/css/vtex.flex-layout.css +++ b/styles/css/vtex.flex-layout.css @@ -172,7 +172,7 @@ width: 100%; } .flexRowContent--productActions :global(.vtex-button) :global(.vtex-add-to-cart-button-0-x-buttonText) { - width: 99%; + width: 96%; } .flexRow--productSpecifications { @@ -199,6 +199,11 @@ border: none; } } +@media screen and (min-width: 1921px) { + .flexRowContent--productSpecificationItemContainer { + margin-top: 64px; + } +} .flexRow--productShelf { padding: 0 40px; diff --git a/styles/css/vtex.product-summary.css b/styles/css/vtex.product-summary.css index 2871a5b..b9927e0 100644 --- a/styles/css/vtex.product-summary.css +++ b/styles/css/vtex.product-summary.css @@ -49,6 +49,23 @@ .container { text-align: center; + max-width: none !important; + margin: 0 4px; +} +@media screen and (min-width: 769px) { + .container { + max-width: 291.2px !important; + } +} +@media screen and (min-width: 1025px) { + .container { + max-width: 314.4px !important; + } +} +@media screen and (min-width: 1921px) { + .container { + max-width: 434.4px !important; + } } .priceContainer { diff --git a/styles/css/vtex.slider-layout.css b/styles/css/vtex.slider-layout.css index 7e0e8e8..95e9eaa 100644 --- a/styles/css/vtex.slider-layout.css +++ b/styles/css/vtex.slider-layout.css @@ -41,6 +41,17 @@ .sliderLayoutContainer--productShelf { width: 100%; + padding: 0 19.2px; +} +@media screen and (min-width: 769px) { + .sliderLayoutContainer--productShelf { + padding: 23.2px; + } +} +@media screen and (min-width: 1025px) { + .sliderLayoutContainer--productShelf { + padding: 0 27.2px; + } } .sliderArrows--productShelf { diff --git a/styles/css/vtex.tab-layout.css b/styles/css/vtex.tab-layout.css index bef2964..236b36e 100644 --- a/styles/css/vtex.tab-layout.css +++ b/styles/css/vtex.tab-layout.css @@ -8,7 +8,7 @@ /* Media Query M3 */ /* Grid breakpoints */ .listContainer--ProductSpecificationTabList { - justify-content: space-around; + justify-content: space-between; border-bottom: 1px solid #b9b9b9; } @media screen and (max-width: 1024px) { @@ -16,6 +16,11 @@ border-top: 1px solid #b9b9b9; } } +@media screen and (min-width: 1025px) { + .listContainer--ProductSpecificationTabList { + padding: 0 64px; + } +} .listContainer--ProductSpecificationTabList .listItem { position: relative; padding: 0; diff --git a/styles/sass/pages/product/vtex.flex-layout.scss b/styles/sass/pages/product/vtex.flex-layout.scss index f2c70ad..2cb2706 100644 --- a/styles/sass/pages/product/vtex.flex-layout.scss +++ b/styles/sass/pages/product/vtex.flex-layout.scss @@ -165,7 +165,7 @@ } :global(.vtex-add-to-cart-button-0-x-buttonText) { - width: 99%; + width: 96%; } } } @@ -191,6 +191,10 @@ @media screen and (min-width: 1025px) { border: none; } + + @media screen and (min-width: 1921px) { + margin-top: 64px; + } } .flexRow--productShelf { diff --git a/styles/sass/pages/product/vtex.product-summary.scss b/styles/sass/pages/product/vtex.product-summary.scss index b9c17a8..b183d03 100644 --- a/styles/sass/pages/product/vtex.product-summary.scss +++ b/styles/sass/pages/product/vtex.product-summary.scss @@ -41,6 +41,22 @@ .container { text-align: center; + + max-width: none !important; + + margin: 0 4px; + + @media screen and (min-width: 769px) { + max-width: 291.2px !important; + } + + @media screen and (min-width: 1025px) { + max-width: 314.4px !important; + } + + @media screen and (min-width: 1921px) { + max-width: 434.4px !important; + } } .priceContainer { diff --git a/styles/sass/pages/product/vtex.slider-layout.scss b/styles/sass/pages/product/vtex.slider-layout.scss index af0000a..7eec2b1 100644 --- a/styles/sass/pages/product/vtex.slider-layout.scss +++ b/styles/sass/pages/product/vtex.slider-layout.scss @@ -32,6 +32,16 @@ .sliderLayoutContainer--productShelf { width: 100%; + + padding: 0 19.2px; + + @media screen and (min-width: 769px) { + padding: 23.2px; + } + + @media screen and (min-width: 1025px) { + padding: 0 27.2px; + } } .sliderArrows--productShelf { diff --git a/styles/sass/pages/product/vtex.tab-layout.scss b/styles/sass/pages/product/vtex.tab-layout.scss index ea58149..f6b2ad0 100644 --- a/styles/sass/pages/product/vtex.tab-layout.scss +++ b/styles/sass/pages/product/vtex.tab-layout.scss @@ -1,11 +1,15 @@ .listContainer--ProductSpecificationTabList { - justify-content: space-around; + justify-content: space-between; border-bottom: 1px solid #b9b9b9; @media screen and (max-width: 1024px) { border-top: 1px solid #b9b9b9; } + @media screen and (min-width: 1025px) { + padding: 0 64px; + } + .listItem { position: relative; padding: 0;