diff --git a/styles/css/vtex.flex-layout.css b/styles/css/vtex.flex-layout.css index 3877030..e892c41 100644 --- a/styles/css/vtex.flex-layout.css +++ b/styles/css/vtex.flex-layout.css @@ -119,12 +119,26 @@ padding-right: 16px; margin-right: 16px; } +@media (min-width: 769px) and (max-width: 1024px), (min-width: 280px) and (max-width: 768px) { + .flexRowContent--product__image .stretchChildrenWidth:first-child { + padding: 0; + margin: 0; + } +} @media (min-width: 769px) and (max-width: 1024px), (min-width: 280px) and (max-width: 768px) { .flexRowContent--product__image .stretchChildrenWidth { width: 100% !important; padding-right: 0; } } +@media (min-width: 769px) and (max-width: 1024px), (min-width: 280px) and (max-width: 768px) { + .flexRowContent--product__image .stretchChildrenWidth .flexCol--product-skus { + margin-top: 32px; + } +} +.flexRowContent--product__image .stretchChildrenWidth .flexColChild--product-skus .flexRow .flexRowContent { + margin: 0; +} .flexRow--product__name, .flexRowContent--product__name { height: 34px; diff --git a/styles/css/vtex.product-identifier.css b/styles/css/vtex.product-identifier.css index 7231ec2..ea97e52 100644 --- a/styles/css/vtex.product-identifier.css +++ b/styles/css/vtex.product-identifier.css @@ -17,7 +17,6 @@ @media (min-width: 769px) and (max-width: 1024px), (min-width: 280px) and (max-width: 768px) { .product-identifier--productReference { justify-content: flex-start; - padding-top: 8px; } } .product-identifier--productReference .product-identifier__label, .product-identifier--productReference .product-identifier__separator { diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css index 2490cc8..0dcf720 100644 --- a/styles/css/vtex.store-components.css +++ b/styles/css/vtex.store-components.css @@ -80,7 +80,6 @@ align-items: center; font-family: "Open Sans", sans-serif; padding: 0; - margin: 0 0 8px 0; font-style: normal; font-weight: 300; font-size: 20px; @@ -90,7 +89,6 @@ @media (min-width: 769px) and (max-width: 1024px), (min-width: 280px) and (max-width: 768px) { .productNameContainer--quickview { justify-content: flex-start; - margin-top: 32px; } } diff --git a/styles/sass/pages/product/vtexComponents/vtex.store-components.scss b/styles/sass/pages/product/vtexComponents/vtex.store-components.scss index 48c0119..255be79 100644 --- a/styles/sass/pages/product/vtexComponents/vtex.store-components.scss +++ b/styles/sass/pages/product/vtexComponents/vtex.store-components.scss @@ -66,7 +66,7 @@ align-items: center; font-family: $font-family; padding: 0; - margin: 0 0 8px 0; + // margin: 0 0 8px 0; font-style: normal; font-weight: 300; font-size: 20px; @@ -75,7 +75,7 @@ @media #{$mq-tablet}, #{$mq-mobile} { justify-content: flex-start; - margin-top: 32px; + // margin-top: 32px; } } diff --git a/styles/sass/pages/product/vtexFlexLayout/vtex.flex-layout.scss b/styles/sass/pages/product/vtexFlexLayout/vtex.flex-layout.scss index 6430972..6fe7f19 100644 --- a/styles/sass/pages/product/vtexFlexLayout/vtex.flex-layout.scss +++ b/styles/sass/pages/product/vtexFlexLayout/vtex.flex-layout.scss @@ -109,12 +109,31 @@ &:first-child { padding-right: 16px; margin-right: 16px; + + @media #{$mq-tablet}, #{$mq-mobile} { + padding: 0; + margin: 0; + } } @media #{$mq-tablet}, #{$mq-mobile}{ width: 100% !important; padding-right: 0; } + + .flexCol--product-skus { + @media #{$mq-tablet}, #{$mq-mobile} { + margin-top: 32px; + } + } + + .flexColChild--product-skus { + .flexRow { + .flexRowContent { + margin: 0; + } + } + } } } diff --git a/styles/sass/pages/product/vtexProduct/vtex.product-identifier.scss b/styles/sass/pages/product/vtexProduct/vtex.product-identifier.scss index 324ff1f..acaccdc 100644 --- a/styles/sass/pages/product/vtexProduct/vtex.product-identifier.scss +++ b/styles/sass/pages/product/vtexProduct/vtex.product-identifier.scss @@ -6,7 +6,6 @@ @media #{$mq-tablet}, #{$mq-mobile} { justify-content: flex-start; - padding-top: 8px; } .product-identifier {