diff --git a/styles/css/vtex.product-price.css b/styles/css/vtex.product-price.css index cb5337e..ef0e0c8 100644 --- a/styles/css/vtex.product-price.css +++ b/styles/css/vtex.product-price.css @@ -20,6 +20,12 @@ color: #bababa; padding-bottom: 8px; } +@media only screen and (max-width: 1024px) { + .listPrice--summary { + font-size: 12px; + line-height: 16px; + } +} .listPrice--summary::before { content: "de "; text-decoration: line-through; @@ -33,6 +39,12 @@ font-size: 24px !important; line-height: 33px !important; } +@media only screen and (max-width: 1024px) { + .sellingPrice--summary { + font-size: 18px !important; + line-height: 25px !important; + } +} .sellingPrice { font-weight: 700; diff --git a/styles/css/vtex.product-summary.css b/styles/css/vtex.product-summary.css index dafe775..0c06940 100644 --- a/styles/css/vtex.product-summary.css +++ b/styles/css/vtex.product-summary.css @@ -26,6 +26,12 @@ line-height: 25px; color: #000000; } +@media only screen and (max-width: 1024px) { + .brandName { + font-size: 14px; + line-height: 19px; + } +} .nameContainer { padding: 16px 0 8px; diff --git a/styles/css/vtex.rich-text.css b/styles/css/vtex.rich-text.css index 930cb79..cc3f142 100644 --- a/styles/css/vtex.rich-text.css +++ b/styles/css/vtex.rich-text.css @@ -18,4 +18,9 @@ line-height: 38px; color: #575757; font-weight: 400; +} +@media only screen and (max-width: 768px) { + .heading--shelf-title { + font-size: 20px; + } } \ No newline at end of file diff --git a/styles/sass/pages/product/vtex.product-price.scss b/styles/sass/pages/product/vtex.product-price.scss index 387ec07..4dc62ec 100644 --- a/styles/sass/pages/product/vtex.product-price.scss +++ b/styles/sass/pages/product/vtex.product-price.scss @@ -10,6 +10,11 @@ color: $color-gray13; padding-bottom: 8px; + @include mq(md, max) { + font-size: 12px; + line-height: 16px; + } + &::before { content: 'de '; text-decoration: line-through; @@ -24,6 +29,11 @@ .sellingPrice--summary { font-size: 24px !important; line-height: 33px !important; + + @include mq(md, max) { + font-size: 18px !important; + line-height: 25px !important; + } } .sellingPrice { diff --git a/styles/sass/pages/product/vtex.product-summary.scss b/styles/sass/pages/product/vtex.product-summary.scss index 1c68ef4..d9be940 100644 --- a/styles/sass/pages/product/vtex.product-summary.scss +++ b/styles/sass/pages/product/vtex.product-summary.scss @@ -18,6 +18,11 @@ font-size: 18px; line-height: 25px; color: $color-black2; + + @include mq(md, max) { + font-size: 14px; + line-height: 19px; + } } .nameContainer { diff --git a/styles/sass/pages/product/vtex.rich-text.scss b/styles/sass/pages/product/vtex.rich-text.scss index eb6275f..067def9 100644 --- a/styles/sass/pages/product/vtex.rich-text.scss +++ b/styles/sass/pages/product/vtex.rich-text.scss @@ -8,4 +8,8 @@ line-height: 38px; color: $color-gray6; font-weight: 400; + + @include mq(sm, max) { + font-size: 20px; + } }