feat: Ajusta alguns espaçamentos errados

This commit is contained in:
Nicolly Vieira Santos Costa 2023-02-07 12:03:49 -03:00
parent be2f16112f
commit 736e881975
6 changed files with 68 additions and 10 deletions

View File

@ -32,7 +32,7 @@
[class*="html--product-name"] { [class*="html--product-name"] {
text-align: end; text-align: end;
margin-bottom: 24px; margin-bottom: 16px;
} }
[class*="html--buy-container"] { [class*="html--buy-container"] {
@ -264,7 +264,6 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
} }
[class*="html--product-item"] :global(.vtex-product-price-1-x-listPrice) { [class*="html--product-item"] :global(.vtex-product-price-1-x-listPrice) {
@ -273,6 +272,7 @@
line-height: 19px; line-height: 19px;
text-align: center; text-align: center;
color: #bababa; color: #bababa;
margin: 8px 0;
} }
[class*="html--product-item"] :global(.vtex-product-price-1-x-sellingPrice) { [class*="html--product-item"] :global(.vtex-product-price-1-x-sellingPrice) {
font-weight: 700; font-weight: 700;
@ -360,6 +360,11 @@
:global(.vtex-slider-layout-0-x-paginationDotsContainer) { :global(.vtex-slider-layout-0-x-paginationDotsContainer) {
margin-top: 24px; margin-top: 24px;
} }
[class*="html--related-product"] :global(.vtex-rich-text-0-x-heading) {
margin-bottom: 24px;
margin-top: 16px;
}
} }
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {

View File

@ -91,6 +91,13 @@
] ]
}, },
"product-list-price": {
"props": {
"message": "de {listPriceValue} por"
}
},
"product-summary.shelf#related-product": { "product-summary.shelf#related-product": {
"children": [ "children": [
"html#product-item" "html#product-item"
@ -358,7 +365,7 @@
"props": { "props": {
"markers": ["discount"], "markers": ["discount"],
"blockClass": "installments", "blockClass": "installments",
"message": "ou <discount>{installmentsNumber}x</discount> de <discount>R${installmentValue}</discount> sem juros", "message": "ou <discount>{installmentsNumber}x</discount> de <discount>{installmentValue}</discount> sem juros",
"installmentsCriteria": "max-quantity-without-interest" "installmentsCriteria": "max-quantity-without-interest"
} }
}, },

View File

@ -44,10 +44,6 @@
display: flex; display: flex;
flex-direction: column-reverse; flex-direction: column-reverse;
} }
.skuSelectorContainer .skuSelectorSubcontainer--cor,
.skuSelectorContainer .skuSelectorSubcontainer--tamanho {
margin-bottom: 16px;
}
.skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorNameContainer, .skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorNameContainer,
.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorNameContainer { .skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorNameContainer {
margin: 0; margin: 0;
@ -101,6 +97,9 @@
.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorOptionsList .skuSelectorItem .skuSelectorInternalBox .skuSelectorItem--selected .skuSelectorInternalBox .diagonalCross::after { .skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorOptionsList .skuSelectorItem .skuSelectorInternalBox .skuSelectorItem--selected .skuSelectorInternalBox .diagonalCross::after {
background-color: #000; background-color: #000;
} }
.skuSelectorContainer .skuSelectorSubcontainer--cor {
margin-bottom: 16px;
}
.skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorName::after { .skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorName::after {
content: "Outras Cores:"; content: "Outras Cores:";
font-style: normal; font-style: normal;
@ -138,6 +137,9 @@
.skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorOptionsList .skuSelectorItem--selected .skuSelectorInternalBox .diagonalCross::after { .skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorOptionsList .skuSelectorItem--selected .skuSelectorInternalBox .diagonalCross::after {
background-color: #000; background-color: #000;
} }
.skuSelectorContainer .skuSelectorSubcontainer--tamanho {
margin-bottom: 10px;
}
.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorName::after { .skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorName::after {
content: "OUTROS TAMANHOS:"; content: "OUTROS TAMANHOS:";
font-style: normal; font-style: normal;
@ -341,6 +343,11 @@
.shippingTableRow { .shippingTableRow {
display: flex; display: flex;
gap: 32px; gap: 32px;
padding-bottom: 15px;
}
.shippingTableBody .shippingTableRow:last-child {
padding-bottom: 0;
} }
.shippingTableCell { .shippingTableCell {

View File

@ -55,10 +55,11 @@
text-transform: capitalize; text-transform: capitalize;
border: none; border: none;
padding: 0 16px; padding: 0 16px;
width: 100%;
} }
@media screen and (min-width: 1920px) { @media screen and (min-width: 1920px) {
.container .listItem :global(.vtex-button) { .container .listItem :global(.vtex-button) {
font-size: 18px; font-size: 24px;
line-height: 38px; line-height: 38px;
} }
} }
@ -69,6 +70,8 @@
} }
.container .listItem :global(.vtex-button__label) { .container .listItem :global(.vtex-button__label) {
padding: 0 !important; padding: 0 !important;
text-align: start;
display: block;
} }
.container .listItemActive :global(.vtex-button__label) { .container .listItemActive :global(.vtex-button__label) {
color: #000; color: #000;
@ -121,6 +124,12 @@
color: #575757; color: #575757;
margin-bottom: 8px; margin-bottom: 8px;
} }
@media screen and (min-width: 1920px) {
.container .contentContainer .contentItem :global(.vtex-store-components-3-x-productDescriptionTitle) {
font-size: 32px;
margin-bottom: 16px;
}
}
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
.container .contentContainer .contentItem :global(.vtex-store-components-3-x-productDescriptionTitle) { .container .contentContainer .contentItem :global(.vtex-store-components-3-x-productDescriptionTitle) {
font-size: 20px; font-size: 20px;
@ -141,6 +150,12 @@
line-height: 22px; line-height: 22px;
color: #929292; color: #929292;
} }
@media screen and (min-width: 1920px) {
.container .contentContainer .contentItem :global(.vtex-store-components-3-x-content) {
font-size: 18px;
line-height: 25px;
}
}
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
.container .contentContainer .contentItem :global(.vtex-store-components-3-x-content) { .container .contentContainer .contentItem :global(.vtex-store-components-3-x-content) {
font-size: 14px; font-size: 14px;

View File

@ -38,7 +38,6 @@
flex-direction: column-reverse; flex-direction: column-reverse;
.skuSelectorSubcontainer--cor, .skuSelectorSubcontainer--cor,
.skuSelectorSubcontainer--tamanho { .skuSelectorSubcontainer--tamanho {
margin-bottom: 16px;
.skuSelectorNameContainer { .skuSelectorNameContainer {
margin: 0; margin: 0;
.skuSelectorTextContainer { .skuSelectorTextContainer {
@ -100,6 +99,8 @@
} }
.skuSelectorSubcontainer--cor { .skuSelectorSubcontainer--cor {
margin-bottom: 16px;
.skuSelectorName { .skuSelectorName {
&::after { &::after {
content: "Outras Cores:"; content: "Outras Cores:";
@ -156,6 +157,7 @@
} }
.skuSelectorSubcontainer--tamanho { .skuSelectorSubcontainer--tamanho {
margin-bottom: 10px;
.skuSelectorName { .skuSelectorName {
&::after { &::after {
content: "OUTROS TAMANHOS:"; content: "OUTROS TAMANHOS:";
@ -382,6 +384,15 @@
.shippingTableRow { .shippingTableRow {
display: flex; display: flex;
gap: 32px; gap: 32px;
padding-bottom: 15px;
}
.shippingTableBody {
.shippingTableRow {
&:last-child {
padding-bottom: 0;
}
}
} }
.shippingTableCell { .shippingTableCell {

View File

@ -44,9 +44,10 @@
text-transform: capitalize; text-transform: capitalize;
border: none; border: none;
padding: 0 16px; padding: 0 16px;
width: 100%;
@media screen and (min-width: 1920px) { @media screen and (min-width: 1920px) {
font-size: 18px; font-size: 24px;
line-height: 38px; line-height: 38px;
} }
@ -57,6 +58,8 @@
.listItem :global(.vtex-button__label) { .listItem :global(.vtex-button__label) {
padding: 0 !important; padding: 0 !important;
text-align: start;
display: block;
} }
.listItemActive :global(.vtex-button__label) { .listItemActive :global(.vtex-button__label) {
color: $black; color: $black;
@ -110,6 +113,11 @@
color: #575757; color: #575757;
margin-bottom: 8px; margin-bottom: 8px;
@media screen and (min-width: 1920px) {
font-size: 32px;
margin-bottom: 16px;
}
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
font-size: 20px; font-size: 20px;
line-height: 32px; line-height: 32px;
@ -132,6 +140,11 @@
color: #929292; color: #929292;
@media screen and (min-width: 1920px) {
font-size: 18px;
line-height: 25px;
}
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
font-size: 14px; font-size: 14px;
line-height: 19px; line-height: 19px;