Thiago.bronisio/challenge-vtex-io-thiago-bronisio
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request 'fix: correção geral de responsividade e elementos da pagina de produto' (#8) from bug-fix/pagina-product into master

Browse Source 
Reviewed-on: #8
This commit is contained in:
Thiago Bronisio Damascena 2023-02-10 02:52:15 +00:00
commit 7b87044b73
19 changed files with 267 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
react/components/Html/styles.css
View File

@ -1,7 +1,6 @@
/*
CONTEUDO DO CONTADOR E BOTÃO DE ADD PRODUTO
*/
[class*="html--buy-button"] :global(.vtex-button) {
min-height: 49px;
padding: 12px 64px;
@ -33,11 +32,6 @@
}
}
[class*="html--product-quantity"] {
width: 128px;
margin-right: 10px;
}
/*
DESCRIÇÃO DO PRODUTO SELECIONADO
*/

7
react/components/PixDiscount/styles.module.css
View File

@ -1,12 +1,13 @@
.wrapper {
display: flex;
align-items: center;
margin: 8px 0 16px 0;
height: 39px;
}
.container-img{
margin-right: 26px;
display: flex;
align-items: center;
width: 66px;
margin-right: 26px;
height: 24px;
}
.figure-pix{
margin: 0;

2
store/blocks/pdp/product.jsonc
View File

@ -412,7 +412,7 @@
"flex-layout.row#product-name": {
"props": {
"marginBottom": 3
"blockClass": "product-name"
},
"children": ["vtex.store-components:product-name"]
},

2
styles/configs/font-faces.scss
View File

@ -1,4 +1,4 @@
@font-face {
font-family: "Open Sans", "sans-serif";
src: url("https://fonts.googleapis.com/css2?family=Open+Sans&display=swap");
src: url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700;800&display=swap");
}

11
styles/css/vtex.breadcrumb.css
View File

@ -9,7 +9,16 @@
/* Media Query M3 */
/* Grid breakpoints */
.container {
padding: 16px 40px;
padding: 0;
margin: 0 40px 16px 40px;
height: 20.12px;
display: flex;
align-items: center;
}
@media only screen and (min-width: 1921px) {
.container {
margin: 0 360px 16px 360px;
}
}
.container .homeLink {
display: none;

52
styles/css/vtex.flex-layout.css
View File

@ -14,42 +14,63 @@
}
/* EMBRULHO DA IMAGEM E INFORMAÇÕES DE PREÇOS, VALORES, PARCELAMENTO ETC..*/
.flexRow--main {
padding: 0 40px;
}
@media only screen and (min-width: 1921px) {
.flexRow--main {
padding: 0 360px;
}
}
@media only screen and (max-width: 1024px) {
.flexRowContent--main {
.flexRow--main .flexRowContent--main {
display: block;
}
}
@media only screen and (max-width: 1024px) {
.flexRowContent--main .stretchChildrenWidth {
.flexRow--main .flexRowContent--main .stretchChildrenWidth {
width: 100% !important;
}
}
.flexRowContent--main .stretchChildrenWidth .flexCol--stack {
padding-left: 40px;
}
@media only screen and (max-width: 1024px) {
.flexRowContent--main .stretchChildrenWidth .flexCol--stack {
padding: 0 40px;
.flexRow--main .flexRowContent--main .stretchChildrenWidth .flexCol--stack {
width: 100%;
}
}
.flexRowContent--main .stretchChildrenWidth .flexCol--right-col {
padding-right: 40px;
.flexRow--main .flexRowContent--main .stretchChildrenWidth .flexCol--stack .flexColChild--stack {
margin-right: 16px;
}
@media only screen and (max-width: 1024px) {
.flexRow--main .flexRowContent--main .stretchChildrenWidth .flexCol--stack .flexColChild--stack {
margin: 0;
}
}
.flexRow--main .flexRowContent--main .stretchChildrenWidth .flexCol--right-col {
margin-left: 16px;
}
@media only screen and (max-width: 1024px) {
.flexRowContent--main .stretchChildrenWidth .flexCol--right-col {
padding: 0 40px;
margin-left: 0;
.flexRow--main .flexRowContent--main .stretchChildrenWidth .flexCol--right-col {
margin: 0;
}
}
.flexRow--product-name {
width: 100%;
min-height: 34px;
margin-bottom: 8px;
}
/* ASSINANTE DE PRODUTO INDISPONIVEL */
.flexRowContent--product-availability {
padding: 0;
margin: 0;
padding: 0 40px;
}
@media only screen and (min-width: 1921px) {
.flexRowContent--product-availability {
padding: 0 360px;
}
}
@media only screen and (max-width: 1024px) {
.flexRowContent--product-availability {
display: block;
@ -103,7 +124,12 @@
}
@media only screen and (max-width: 1024px) {
.flexRow--newsletter-container {
margin-top: 34px;
margin-top: 64px;
}
}
@media only screen and (max-width: 768px) {
.flexRow--newsletter-container {
margin-top: 32px;
}
}
.flexRow--newsletter-container .flexRowContent--newsletter-container {

24
styles/css/vtex.product-quantity.css
View File

@ -10,7 +10,7 @@
/* INPUT CONTADOR DE PRODUTO */
.quantitySelectorContainer {
height: 49px;
width: 100%;
width: 128px;
margin: 0 10px 0 0;
}
@media only screen and (max-width: 768px) {
@ -21,9 +21,6 @@
.quantitySelectorContainer .quantitySelectorTitle {
display: none;
}
.quantitySelectorContainer .quantitySelectorStepper {
height: 49px;
}
.quantitySelectorContainer .quantitySelectorStepper :global(.vtex-numeric-stepper__input) {
width: 31.6px;
height: 49px;
@ -39,20 +36,33 @@
border-bottom: 1px solid #cccccc;
border-top: 1px solid #cccccc;
background: #fff;
font-weight: 400;
font-size: 16px;
line-height: 22px;
color: #000000;
}
.quantitySelectorContainer .quantitySelectorStepper :global(.vtex-numeric-stepper__plus-button) :global(.vtex-numeric-stepper__plus-button__text) {
font-weight: 400;
width: 10px;
height: 12px;
align-items: center;
display: flex;
justify-content: space-evenly;
}
.quantitySelectorContainer .quantitySelectorStepper :global(.vtex-numeric-stepper__minus-button) {
height: 49px;
width: 10px;
border-left: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
border-top: 1px solid #cccccc;
background: #fff;
font-weight: 400;
font-size: 16px;
line-height: 22px;
color: #000000;
}
.quantitySelectorContainer .quantitySelectorStepper :global(.vtex-numeric-stepper__minus-button) :global(.vtex-numeric-stepper__minus-button__text) {
font-weight: 400;
width: 10px;
height: 12px;
align-items: center;
display: flex;
justify-content: space-evenly;
}

2
styles/css/vtex.product-summary.css
View File

@ -32,7 +32,7 @@
}
@media only screen and (max-width: 768px) {
.containerNormal .element .imageContainer--image-prateleira {
height: 124.81px;
height: 124.82px;
}
}
.containerNormal .element .imageContainer--image-prateleira .imageNormal {

23
styles/css/vtex.slider-layout.css
View File

@ -11,6 +11,12 @@
padding-left: 40px !important;
padding-right: 40px !important;
}
@media only screen and (min-width: 1921px) {
.sliderLayoutContainer--prateleira {
padding-left: 360px !important;
padding-right: 360px !important;
}
}
.sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira {
padding: 0 19.2px 49px 19.2px;
}
@ -21,7 +27,7 @@
}
@media only screen and (max-width: 768px) {
.sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira {
padding: 0 14.7px 33px 14.7px;
padding: 0 14.7px 32px 14.7px;
}
}
.sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira .slide--prateleira {
@ -35,6 +41,7 @@
@media only screen and (max-width: 768px) {
.sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira .slide--prateleira {
margin: 0 4px;
width: 7.1111% !important;
}
}
@media only screen and (max-width: 768px) {
@ -60,10 +67,17 @@
visibility: hidden;
margin: 0 0 0 40px;
padding: 0;
height: 29.6px;
height: 29.61px;
width: 11.21px;
}
@media only screen and (min-width: 1921px) {
.sliderLayoutContainer--prateleira .sliderLeftArrow--prateleira {
margin: 0 0 0 360px;
}
}
.sliderLayoutContainer--prateleira .sliderLeftArrow--prateleira::before {
width: 11.21px;
height: 29.61px;
visibility: visible;
content: url("https://agenciamagma.vtexassets.com/arquivos/arrow-left-thiagoBronisio.png");
}
@ -74,6 +88,11 @@
height: 29.6px;
width: 11.21px;
}
@media only screen and (min-width: 1921px) {
.sliderLayoutContainer--prateleira .sliderRightArrow--prateleira {
margin: 0 360px 0 0;
}
}
.sliderLayoutContainer--prateleira .sliderRightArrow--prateleira::after {
visibility: visible;
content: url("https://agenciamagma.vtexassets.com/arquivos/arrow-right-thiagoBronisio.png");

2
styles/css/vtex.stack-layout.css
View File

@ -1,6 +1,6 @@
.stackItem--product {
width: 100%;
min-height: 257px
min-height: 100%
}
.stackItem--quickview {

53
styles/css/vtex.store-components.css
View File

@ -21,25 +21,18 @@
margin: 0;
}
}
.productImagesGallerySlide .productImage {
margin-right: 16px;
}
@media only screen and (max-width: 1024px) {
.productImagesGallerySlide .productImage {
margin: 0;
}
}
.productImagesGallerySlide .productImage .productImageTag--main {
.productImagesGallerySlide .productImageTag--main {
max-height: 100% !important;
}
/*CARROUSEL GALERIA DE IMAGENS DO PRODUTO */
.carouselGaleryThumbs {
margin: 16px 0;
margin: 16px 16px 0 0;
}
@media only screen and (max-width: 768px) {
@media only screen and (max-width: 1024px) {
.carouselGaleryThumbs {
display: block;
margin: 16px 0 32px 0;
}
}
.carouselGaleryThumbs .thumbImg {
@ -58,7 +51,7 @@
/* TITULO (NOME DO PRODUTO PRINCIPAL)*/
.productNameContainer--quickview {
text-align: end;
text-align: right;
font-weight: 300;
font-size: 20px;
line-height: 34px;
@ -117,26 +110,30 @@
.skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorNameContainer .skuSelectorOptionsList .skuSelectorItem--selected .frameAround--sku-selector {
border: 2px solid #000000;
}
.skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorNameContainer .skuSelectorOptionsList .skuSelectorItem--selected .diagonalCross {
margin: 6px;
width: 36px;
background-image: linear-gradient(to top right, transparent 44%, #000000 48%, currentColor 48%, currentColor 0, transparent 0%);
}
.skuSelectorContainer .skuSelectorSubcontainer--tamanho {
margin-bottom: 10px;
}
.skuSelectorContainer .skuSelectorSubcontainer--tamanho::before {
content: "OUTROS TAMANHOS:";
font-family: "Open Sans", sans-serif;
font-weight: 400;
line-height: 19px;
font-size: 14px;
color: #929292;
}
.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorNameContainer {
margin: 8px 0 0 0;
height: 40px;
min-height: 40px;
margin: 0;
}
.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorNameContainer .skuSelectorOptionsList {
margin: 0;
}
.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorNameContainer .skuSelectorOptionsList .skuSelectorItem--sku-selector {
margin: 0 16px 0 0;
margin: 8px 16px 0 0;
width: 40px;
height: 40px;
}
@ -173,6 +170,11 @@
.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorNameContainer .skuSelectorOptionsList .skuSelectorItem--selected .skuSelectorItemTextValue {
color: #000000 !important;
}
.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorNameContainer .skuSelectorOptionsList .skuSelectorItem--selected .diagonalCross {
margin: 6px;
width: 30px;
background-image: linear-gradient(to top right, transparent 44%, #000000 48%, currentColor 48%, currentColor 0, transparent 0%);
}
.skuSelectorContainer .skuSelectorTextContainer {
display: none;
}
@ -316,6 +318,7 @@ FORMULARIO DE PRODUTO INDISPONIVEL */
.shippingContainer {
display: block;
max-width: 296px;
width: 100%;
}
}
.shippingContainer :global(.vtex-address-form__postalCode) {
@ -455,14 +458,18 @@ FORMULARIO DE PRODUTO INDISPONIVEL */
flex-direction: row;
}
.shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryName {
margin-right: 39px;
min-width: 80px;
height: 19px;
margin-right: 32px;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: #202020;
text-align: start;
}
@media only screen and (max-width: 768px) {
.shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryName {
min-width: 69px;
margin-right: 32px;
}
}
@ -476,7 +483,8 @@ FORMULARIO DE PRODUTO INDISPONIVEL */
}
.shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryPrice {
font-size: 0;
margin-right: 30px;
min-width: 50px;
margin-right: 32px;
}
@media only screen and (max-width: 768px) {
.shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryPrice {
@ -495,8 +503,9 @@ FORMULARIO DE PRODUTO INDISPONIVEL */
flex-direction: row;
}
.shippingTable .shippingTableBody .shippingTableRow .shippingTableCellDeliveryName {
width: 82px;
margin-right: 28px;
min-width: 82px;
text-transform: capitalize;
margin-right: 32px;
font-weight: 400;
font-size: 12px;
line-height: 16px;
@ -516,8 +525,8 @@ FORMULARIO DE PRODUTO INDISPONIVEL */
color: #afafaf;
}
.shippingTable .shippingTableBody .shippingTableRow .shippingTableCellDeliveryPrice {
width: 50px;
margin-right: 28px;
min-width: 50px;
margin-right: 32px;
font-weight: 400;
font-size: 12px;
line-height: 16px;

10
styles/css/vtex.tab-layout.css
View File

@ -11,6 +11,11 @@
padding: 0 40px;
margin: 16px 0;
}
@media only screen and (min-width: 1921px) {
.container--description {
padding: 0 360px;
}
}
.container--description .listContainer {
display: flex;
padding: 0 64px;
@ -64,6 +69,11 @@
text-transform: capitalize;
border-bottom: 2px solid transparent;
}
@media only screen and (max-width: 1024px) {
.container--description .listContainer .listItem :global(.vtex-button) :global(.vtex-button__label) {
border-bottom: none;
}
}
@media only screen and (min-width: 1921px) {
.container--description .listContainer .listItem :global(.vtex-button) :global(.vtex-button__label) {
font-size: 24px;

9
styles/sass/pages/product/vtex.breadcrumb.scss
View File

@ -1,5 +1,12 @@
.container {
padding: 16px 40px;
padding: 0;
margin: 0 40px 16px 40px;
height: 20.12px;
display: flex;
align-items: center;
@include mq(xl, min) {
margin: 0 360px 16px 360px;
}
.homeLink {
display: none;

54
styles/sass/pages/product/vtex.flex-layout.scss
View File

@ -4,37 +4,54 @@
}
/* EMBRULHO DA IMAGEM E INFORMAÇÕES DE PREÇOS, VALORES, PARCELAMENTO ETC..*/
.flexRowContent--main {
@include mq(md, max) {
display: block;
.flexRow--main {
padding: 0 40px;
@include mq(xl, min) {
padding: 0 360px;
}
.stretchChildrenWidth {
.flexRowContent--main {
@include mq(md, max) {
width: 100% !important;
display: block;
}
.flexCol--stack {
padding-left: 40px;
.stretchChildrenWidth {
@include mq(md, max) {
padding: 0 40px;
width: 100%;
width: 100% !important;
}
}
.flexCol--right-col {
padding-right: 40px;
margin-left: 16px;
@include mq(md, max) {
padding: 0 40px;
margin-left: 0;
.flexCol--stack {
@include mq(md, max) {
width: 100%;
}
.flexColChild--stack {
margin-right: 16px;
@include mq(md, max) {
margin: 0;
}
}
}
.flexCol--right-col {
margin-left: 16px;
@include mq(md, max) {
margin: 0;
}
}
}
}
}
.flexRow--product-name {
width: 100%;
min-height: 34px;
margin-bottom: 8px;
}
/* ASSINANTE DE PRODUTO INDISPONIVEL */
.flexRowContent--product-availability {
padding: 0;
margin: 0;
padding: 0 40px;
@include mq(xl, min) {
padding: 0 360px;
}
@include mq(md, max) {
display: block;
}
@ -80,7 +97,10 @@
background-color: $color-black-padrao;
margin-top: 64px;
@include mq(md, max) {
margin-top: 34px;
margin-top: 64px;
}
@include mq(sm, max) {
margin-top: 32px;
}
.flexRowContent--newsletter-container {
display: flex;

22
styles/sass/pages/product/vtex.product-quantity.scss
View File

@ -1,7 +1,7 @@
/* INPUT CONTADOR DE PRODUTO */
.quantitySelectorContainer {
height: 49px;
width: 100%;
width: 128px;
margin: 0 10px 0 0;
@include mq(sm, max) {
margin: 0 0 10px 0;
@ -10,7 +10,6 @@
display: none;
}
.quantitySelectorStepper {
height: 49px;
:global(.vtex-numeric-stepper__input) {
width: 31.6px;
height: 49px;
@ -26,22 +25,35 @@
border-bottom: 1px solid #cccccc;
border-top: 1px solid #cccccc;
background: $color-white;
font-weight: 400;
font-size: 16px;
line-height: 22px;
color: $color-black-padrao;
:global(.vtex-numeric-stepper__plus-button__text) {
font-weight: 400;
width: 10px;
height: 12px;
align-items: center;
display: flex;
justify-content: space-evenly;
}
}
:global(.vtex-numeric-stepper__minus-button) {
height: 49px;
width: 10px;
border-left: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
border-top: 1px solid #cccccc;
background: $color-white;
font-weight: 400;
font-size: 16px;
line-height: 22px;
color: $color-black-padrao;
:global(.vtex-numeric-stepper__minus-button__text) {
font-weight: 400;
width: 10px;
height: 12px;
align-items: center;
display: flex;
justify-content: space-evenly;
}
}
}
}

2
styles/sass/pages/product/vtex.product-summary.scss
View File

@ -16,7 +16,7 @@
height: 291.21px;
}
@include mq(sm, max) {
height: 124.81px;
height: 124.82px;
}
.imageNormal {
height: 100%;

17
styles/sass/pages/product/vtex.slider-layout.scss
View File

@ -1,13 +1,17 @@
.sliderLayoutContainer--prateleira {
padding-left: 40px !important;
padding-right: 40px !important;
@include mq(xl, min) {
padding-left: 360px !important;
padding-right: 360px !important;
}
.sliderTrackContainer--prateleira {
padding: 0 19.2px 49px 19.2px;
@include mq(md, max) {
padding: 0 17.2px 41px 17.2px;
}
@include mq(sm, max) {
padding: 0 14.7px 33px 14.7px;
padding: 0 14.7px 32px 14.7px;
}
.slide--prateleira {
margin: 0 8px;
@ -16,6 +20,7 @@
}
@include mq(sm, max) {
margin: 0 4px;
width: 7.1111% !important;
}
}
@ -44,9 +49,14 @@
visibility: hidden;
margin: 0 0 0 40px;
padding: 0;
height: 29.6px;
height: 29.61px;
width: 11.21px;
@include mq(xl, min) {
margin: 0 0 0 360px;
}
&::before {
width: 11.21px;
height: 29.61px;
visibility: visible;
content: url("https://agenciamagma.vtexassets.com/arquivos/arrow-left-thiagoBronisio.png");
}
@ -58,6 +68,9 @@
padding: 0;
height: 29.6px;
width: 11.21px;
@include mq(xl, min) {
margin: 0 360px 0 0;
}
&::after {
visibility: visible;
content: url("https://agenciamagma.vtexassets.com/arquivos/arrow-right-thiagoBronisio.png");

68
styles/sass/pages/product/vtex.store-components.scss
View File

@ -10,22 +10,18 @@
@include mq(md, max) {
margin: 0;
}
.productImage {
margin-right: 16px;
@include mq(md, max) {
margin: 0;
}
.productImageTag--main {
max-height: 100% !important;
}
.productImageTag--main {
max-height: 100% !important;
}
}
/*CARROUSEL GALERIA DE IMAGENS DO PRODUTO */
.carouselGaleryThumbs {
margin: 16px 0;
@include mq(sm, max) {
margin: 16px 16px 0 0;
@include mq(md, max) {
display: block;
margin: 16px 0 32px 0;
}
.thumbImg {
@ -46,7 +42,7 @@
/* TITULO (NOME DO PRODUTO PRINCIPAL)*/
.productNameContainer--quickview {
text-align: end;
text-align: right;
font-weight: 300;
font-size: 20px;
line-height: 34px;
@ -101,6 +97,18 @@
.frameAround--sku-selector {
border: 2px solid $color-black-padrao;
}
.diagonalCross {
margin: 6px;
width: 36px;
background-image: linear-gradient(
to top right,
transparent 44%,
$color-black-padrao 48%,
currentColor 48%,
currentColor 0,
transparent 0%
);
}
}
}
}
@ -111,20 +119,19 @@
margin-bottom: 10px;
&::before {
content: "OUTROS TAMANHOS:";
font-family: "Open Sans", sans-serif;
font-weight: 400;
line-height: 19px;
font-size: 14px;
color: $color-gray-6;
}
.skuSelectorNameContainer {
margin: 8px 0 0 0;
height: 40px;
min-height: 40px;
margin: 0;
.skuSelectorOptionsList {
margin: 0;
.skuSelectorItem--sku-selector {
margin: 0 16px 0 0;
margin: 8px 16px 0 0;
width: 40px;
height: 40px;
.frameAround--sku-selector {
@ -164,6 +171,18 @@
.skuSelectorItemTextValue {
color: $color-black-padrao !important;
}
.diagonalCross {
margin: 6px;
width: 30px;
background-image: linear-gradient(
to top right,
transparent 44%,
$color-black-padrao 48%,
currentColor 48%,
currentColor 0,
transparent 0%
);
}
}
}
}
@ -317,6 +336,7 @@ FORMULARIO DE PRODUTO INDISPONIVEL */
@include mq(sm, max) {
display: block;
max-width: 296px;
width: 100%;
}
:global(.vtex-address-form__postalCode) {
display: flex;
@ -445,12 +465,16 @@ FORMULARIO DE PRODUTO INDISPONIVEL */
display: flex;
flex-direction: row;
.shippingTableHeadDeliveryName {
margin-right: 39px;
min-width: 80px;
height: 19px;
margin-right: 32px;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: $color-black2;
text-align: start;
@include mq(sm, max) {
min-width: 69px;
margin-right: 32px;
}
}
@ -465,7 +489,8 @@ FORMULARIO DE PRODUTO INDISPONIVEL */
.shippingTableHeadDeliveryPrice {
font-size: 0;
margin-right: 30px;
min-width: 50px;
margin-right: 32px;
@include mq(sm, max) {
margin-right: 32px;
}
@ -485,8 +510,9 @@ FORMULARIO DE PRODUTO INDISPONIVEL */
display: flex;
flex-direction: row;
.shippingTableCellDeliveryName {
width: 82px;
margin-right: 28px;
min-width: 82px;
text-transform: capitalize;
margin-right: 32px;
font-weight: 400;
font-size: 12px;
line-height: 16px;
@ -506,8 +532,8 @@ FORMULARIO DE PRODUTO INDISPONIVEL */
}
.shippingTableCellDeliveryPrice {
width: 50px;
margin-right: 28px;
min-width: 50px;
margin-right: 32px;
font-weight: 400;
font-size: 12px;
line-height: 16px;

6
styles/sass/pages/product/vtex.tab-layout.scss
View File

@ -1,6 +1,9 @@
.container--description {
padding: 0 40px;
margin: 16px 0;
@include mq(xl, min) {
padding: 0 360px;
}
.listContainer {
display: flex;
padding: 0 64px;
@ -44,6 +47,9 @@
line-height: 38px;
text-transform: capitalize;
border-bottom: 2px solid transparent;
@include mq(md, max) {
border-bottom: none;
}
@include mq(xl, min) {
font-size: 24px;
line-height: 38px;