feat(pdp): Adiciona layout ultrawide
This commit is contained in:
parent
8ee093fd3c
commit
1e22e81ab8
@ -61,3 +61,7 @@
|
|||||||
padding: 0 64px;
|
padding: 0 64px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
[class*="html--containerbotao"] {
|
||||||
|
display: contents;
|
||||||
|
}
|
||||||
|
@ -2,9 +2,9 @@
|
|||||||
"store.home": {
|
"store.home": {
|
||||||
"blocks": [
|
"blocks": [
|
||||||
"list-context.image-list#demo",
|
"list-context.image-list#demo",
|
||||||
"example-component", /* You can make references to blocks defined in other files.
|
"example-component",
|
||||||
* For example, `flex-layout.row#deals` is defined in the `deals.json` file. */
|
/* You can make references to blocks defined in other files.
|
||||||
"flex-layout.row#deals",
|
* For example, `flex-layout.row#deals` is defined in the `deals.json` file. */ "flex-layout.row#deals",
|
||||||
"__fold__",
|
"__fold__",
|
||||||
"rich-text#shelf-title",
|
"rich-text#shelf-title",
|
||||||
"flex-layout.row#shelf",
|
"flex-layout.row#shelf",
|
||||||
|
@ -1,18 +1,10 @@
|
|||||||
{
|
{
|
||||||
"store.product": {
|
"store.product": {
|
||||||
"children": [
|
"children": [
|
||||||
/*"html#breadcrumb",*/
|
|
||||||
"breadcrumb#pdp",
|
"breadcrumb#pdp",
|
||||||
"condition-layout.product#availability",
|
"condition-layout.product#availability",
|
||||||
"tab-layout#details",
|
"tab-layout#details",
|
||||||
/*"html#description",*/
|
|
||||||
/*"flex-layout.row#description",*/
|
|
||||||
/*"flex-layout.row#specifications-title",*/
|
|
||||||
/*"product-specification-group#table",*/
|
|
||||||
|
|
||||||
"list-context.product-list#prateleira",
|
"list-context.product-list#prateleira",
|
||||||
/*"shelf.relatedProducts",*/
|
|
||||||
/*"product-questions-and-answers",*/
|
|
||||||
"newsletter"
|
"newsletter"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
@ -27,7 +19,7 @@
|
|||||||
|
|
||||||
"list-context.product-list#prateleira": {
|
"list-context.product-list#prateleira": {
|
||||||
"blocks": ["product-summary.shelf"],
|
"blocks": ["product-summary.shelf"],
|
||||||
"children": ["rich-text#prateleira", "slider-layout#prateleira"]
|
"children": ["rich-text#prateleira", "html#slidercontainer"]
|
||||||
},
|
},
|
||||||
"rich-text#prateleira": {
|
"rich-text#prateleira": {
|
||||||
"props": {
|
"props": {
|
||||||
@ -49,10 +41,18 @@
|
|||||||
"blockClass": "prateleira"
|
"blockClass": "prateleira"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"html#slidercontainer": {
|
||||||
|
"props": {
|
||||||
|
"testId": "product-summary-list",
|
||||||
|
"tag": "div"
|
||||||
|
},
|
||||||
|
"children": ["slider-layout#prateleira"]
|
||||||
|
},
|
||||||
|
|
||||||
"breadcrumb#pdp": {
|
"breadcrumb#pdp": {
|
||||||
"props": {
|
"props": {
|
||||||
"blockClass": "testebread",
|
"testId": "breadcrumbs",
|
||||||
|
"blockClass": "breadcrumb",
|
||||||
"showOnMobile": true
|
"showOnMobile": true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -86,11 +86,6 @@
|
|||||||
|
|
||||||
"flex-layout.row#product-main": {
|
"flex-layout.row#product-main": {
|
||||||
"props": {
|
"props": {
|
||||||
/*"colGap": 7,*/
|
|
||||||
/*"rowGap": 7,
|
|
||||||
"marginTop": 5,
|
|
||||||
"marginBottom": 7,
|
|
||||||
"paddingBottom": 7,*/
|
|
||||||
"blockClass": "container-produto"
|
"blockClass": "container-produto"
|
||||||
},
|
},
|
||||||
"children": ["flex-layout.col#stack", "flex-layout.col#right-col"]
|
"children": ["flex-layout.col#stack", "flex-layout.col#right-col"]
|
||||||
@ -125,8 +120,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"flex-layout.row#product-image": {
|
"flex-layout.row#product-image": {
|
||||||
"children": ["product-images"]
|
"children": ["html#imagens"]
|
||||||
},
|
},
|
||||||
|
|
||||||
"product-images": {
|
"product-images": {
|
||||||
"props": {
|
"props": {
|
||||||
"showNavigationArrows": false,
|
"showNavigationArrows": false,
|
||||||
@ -141,6 +137,11 @@
|
|||||||
"blockClass": "images-container"
|
"blockClass": "images-container"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"html#imagens": {
|
||||||
|
"props": { "testId": "product-images" },
|
||||||
|
"children": ["product-images"]
|
||||||
|
},
|
||||||
|
|
||||||
"flex-layout.col#right-col": {
|
"flex-layout.col#right-col": {
|
||||||
"props": {
|
"props": {
|
||||||
"preventVerticalStretch": true,
|
"preventVerticalStretch": true,
|
||||||
@ -150,20 +151,13 @@
|
|||||||
"flex-layout.row#product-name",
|
"flex-layout.row#product-name",
|
||||||
"html#codigo",
|
"html#codigo",
|
||||||
"product-rating-summary",
|
"product-rating-summary",
|
||||||
/*"flex-layout.row#list-price-savings", desconto*/
|
|
||||||
"flex-layout.row#selling-price",
|
"flex-layout.row#selling-price",
|
||||||
"product-installments",
|
"product-installments",
|
||||||
"Pix",
|
"html#pix",
|
||||||
/*"product-separator",*/
|
"html#skus",
|
||||||
"sku-selector",
|
|
||||||
/*"product-quantity",*/
|
|
||||||
/*"product-assembly-options",*/
|
|
||||||
/*"product-gifts",*/
|
|
||||||
/*"flex-layout.row#buy-button",*/
|
|
||||||
"html#qtd-btn",
|
"html#qtd-btn",
|
||||||
"availability-subscriber",
|
"availability-subscriber",
|
||||||
"shipping-simulator"
|
"shipping-simulator"
|
||||||
/*"share#default"*/
|
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -190,6 +184,14 @@
|
|||||||
"children": ["product-identifier.product"]
|
"children": ["product-identifier.product"]
|
||||||
},
|
},
|
||||||
|
|
||||||
|
"html#pix": {
|
||||||
|
"props": {
|
||||||
|
"testId": "pix-price",
|
||||||
|
"blockClass": "pix"
|
||||||
|
},
|
||||||
|
"children": ["Pix"]
|
||||||
|
},
|
||||||
|
|
||||||
"sku-selector": {
|
"sku-selector": {
|
||||||
"props": {
|
"props": {
|
||||||
"variationsSpacing": 3,
|
"variationsSpacing": 3,
|
||||||
@ -197,6 +199,10 @@
|
|||||||
"blockClass": "skus"
|
"blockClass": "skus"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"html#skus": {
|
||||||
|
"props": { "testId": "sku-selector" },
|
||||||
|
"children": ["sku-selector"]
|
||||||
|
},
|
||||||
|
|
||||||
"flex-layout.row#buy-button": {
|
"flex-layout.row#buy-button": {
|
||||||
"props": {
|
"props": {
|
||||||
@ -213,7 +219,15 @@
|
|||||||
"testId": "qtd-btn",
|
"testId": "qtd-btn",
|
||||||
"blockClass": "qtd-btn"
|
"blockClass": "qtd-btn"
|
||||||
},
|
},
|
||||||
"children": ["product-quantity", "add-to-cart-button"]
|
"children": ["html#quantidade", "html#botao"]
|
||||||
|
},
|
||||||
|
"html#botao": {
|
||||||
|
"props": {
|
||||||
|
"tag": "div",
|
||||||
|
"testId": "add-to-cart-button",
|
||||||
|
"blockClass": "containerbotao"
|
||||||
|
},
|
||||||
|
"children": ["add-to-cart-button"]
|
||||||
},
|
},
|
||||||
|
|
||||||
"product-quantity": {
|
"product-quantity": {
|
||||||
@ -221,14 +235,17 @@
|
|||||||
"blockClass": "quantidade"
|
"blockClass": "quantidade"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"html#quantidade": {
|
||||||
|
"props": {
|
||||||
|
"tag": "div",
|
||||||
|
"testId": "product-quantity",
|
||||||
|
"blockClass": "containerquantidade"
|
||||||
|
},
|
||||||
|
"children": ["product-quantity"]
|
||||||
|
},
|
||||||
|
|
||||||
"flex-layout.row#product-availability": {
|
"flex-layout.row#product-availability": {
|
||||||
"props": {
|
"props": {
|
||||||
/*"colGap": 7,*/
|
|
||||||
/*"rowGap": 7,
|
|
||||||
"marginTop": 5,
|
|
||||||
"marginBottom": 7,
|
|
||||||
"paddingBottom": 7,*/
|
|
||||||
"blockClass": "container-produto"
|
"blockClass": "container-produto"
|
||||||
},
|
},
|
||||||
"children": [
|
"children": [
|
||||||
|
@ -1,5 +1,9 @@
|
|||||||
{
|
{
|
||||||
"product-summary.shelf": {
|
"html#prateleira": {
|
||||||
|
"props": {
|
||||||
|
"testId": "vtex-product-summary",
|
||||||
|
"blockClass": "item-prateleira"
|
||||||
|
},
|
||||||
"children": [
|
"children": [
|
||||||
"stack-layout#prodsum",
|
"stack-layout#prodsum",
|
||||||
"product-summary-name",
|
"product-summary-name",
|
||||||
@ -7,10 +11,11 @@
|
|||||||
"product-summary-space",
|
"product-summary-space",
|
||||||
"product-list-price#summary",
|
"product-list-price#summary",
|
||||||
"flex-layout.row#selling-price-savings"
|
"flex-layout.row#selling-price-savings"
|
||||||
/*"product-installments#summary",
|
|
||||||
"add-to-cart-button"*/
|
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
"product-summary.shelf": {
|
||||||
|
"children": ["html#prateleira"]
|
||||||
|
},
|
||||||
"flex-layout.col#productRating": {
|
"flex-layout.col#productRating": {
|
||||||
"props": {
|
"props": {
|
||||||
"blockClass": "productRating"
|
"blockClass": "productRating"
|
||||||
|
@ -7,7 +7,7 @@
|
|||||||
*/
|
*/
|
||||||
/* Media Query M3 */
|
/* Media Query M3 */
|
||||||
/* Grid breakpoints */
|
/* Grid breakpoints */
|
||||||
.container--testebread {
|
.container--breadcrumb {
|
||||||
margin-left: 40px;
|
margin-left: 40px;
|
||||||
margin-right: 40px;
|
margin-right: 40px;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@ -16,29 +16,35 @@
|
|||||||
line-height: 19px;
|
line-height: 19px;
|
||||||
color: #929292;
|
color: #929292;
|
||||||
}
|
}
|
||||||
.container--testebread .homeIcon--testebread {
|
@media screen and (min-width: 1921px) {
|
||||||
|
.container--breadcrumb {
|
||||||
|
margin-left: 360px;
|
||||||
|
margin-right: 360px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.container--breadcrumb .homeIcon--breadcrumb {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.container--testebread .homeLink--testebread {
|
.container--breadcrumb .homeLink--breadcrumb {
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
.container--testebread .homeLink--testebread::after {
|
.container--breadcrumb .homeLink--breadcrumb::after {
|
||||||
content: "Home";
|
content: "Home";
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 19px;
|
line-height: 19px;
|
||||||
}
|
}
|
||||||
.container--testebread .link--testebread--1 {
|
.container--breadcrumb .link--breadcrumb--1 {
|
||||||
font-size: 0;
|
font-size: 0;
|
||||||
}
|
}
|
||||||
.container--testebread .link--testebread--1::after {
|
.container--breadcrumb .link--breadcrumb--1::after {
|
||||||
content: "Sapatos";
|
content: "Sapatos";
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 19px;
|
line-height: 19px;
|
||||||
}
|
}
|
||||||
.container--testebread .termArrow--testebread,
|
.container--breadcrumb .termArrow--breadcrumb,
|
||||||
.container--testebread .term--testebread {
|
.container--breadcrumb .term--breadcrumb {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
@ -30,6 +30,15 @@
|
|||||||
padding-left: 40px;
|
padding-left: 40px;
|
||||||
padding-right: 40px;
|
padding-right: 40px;
|
||||||
}
|
}
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
.flexRow--container-produto {
|
||||||
|
padding-left: 360px;
|
||||||
|
padding-right: 360px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.flexRow--container-produto :global(.vtex-store-components-3-x-container) {
|
||||||
|
display: contents;
|
||||||
|
}
|
||||||
|
|
||||||
.flexRowContent--container-produto {
|
.flexRowContent--container-produto {
|
||||||
gap: 32px;
|
gap: 32px;
|
||||||
|
@ -17,11 +17,6 @@
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*.vtex-numeric-stepper__input {
|
|
||||||
border-left: none;
|
|
||||||
border-right: none;
|
|
||||||
height: 50px;
|
|
||||||
}*/
|
|
||||||
.hideDecorators {
|
.hideDecorators {
|
||||||
border: 1px solid red;
|
border: 1px solid red;
|
||||||
border-left: none;
|
border-left: none;
|
||||||
@ -29,24 +24,11 @@
|
|||||||
height: 49px;
|
height: 49px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*.numeric-stepper__plus-button {
|
|
||||||
border: none;
|
|
||||||
height: 50px;
|
|
||||||
}*/
|
|
||||||
/*.quantitySelectorInputContainer {
|
|
||||||
height: 50px;
|
|
||||||
}*/
|
|
||||||
/*.availableQuantityContainer {
|
|
||||||
border: 1px solid yellow;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
.quantitySelectorContainer--quantidade {
|
.quantitySelectorContainer--quantidade {
|
||||||
margin-right: 5px;
|
margin-right: 10px;
|
||||||
|
margin-bottom: 16px;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
/*height: 49px;*/
|
|
||||||
}
|
}
|
||||||
@media screen and (max-width: 768px) {
|
@media screen and (max-width: 768px) {
|
||||||
.quantitySelectorContainer--quantidade {
|
.quantitySelectorContainer--quantidade {
|
||||||
@ -54,14 +36,9 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/*.summaryContainer {
|
|
||||||
background-color: blue;
|
|
||||||
border: 1px solid orange;
|
|
||||||
height: 49px;
|
|
||||||
}*/
|
|
||||||
:global(.vtex-numeric-stepper__input) {
|
:global(.vtex-numeric-stepper__input) {
|
||||||
height: 49px;
|
height: 49px;
|
||||||
width: 30px;
|
width: 32px;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
|
@ -12,9 +12,20 @@
|
|||||||
padding-right: 40px;
|
padding-right: 40px;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
.sliderLayoutContainer--prateleira {
|
||||||
|
padding-left: 360px;
|
||||||
|
padding-right: 360px;
|
||||||
|
}
|
||||||
|
}
|
||||||
.sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira {
|
.sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira {
|
||||||
width: 97.1773%;
|
width: 97.1773%;
|
||||||
}
|
}
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
.sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira {
|
||||||
|
width: 97.914%;
|
||||||
|
}
|
||||||
|
}
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
.sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira {
|
.sliderLayoutContainer--prateleira .sliderTrackContainer--prateleira {
|
||||||
width: 97.63%;
|
width: 97.63%;
|
||||||
@ -54,14 +65,38 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.sliderArrows--prateleira {
|
.sliderArrows--prateleira {
|
||||||
margin: 14px;
|
margin: 30px;
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
.sliderArrows--prateleira {
|
||||||
|
margin: 350px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
.sliderArrows--prateleira {
|
.sliderArrows--prateleira {
|
||||||
margin: 28px;
|
margin: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (max-width: 768px) {
|
||||||
|
.sliderArrows--prateleira {
|
||||||
|
margin: 34px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.sliderLayoutContainer :global(.vtex-slider-layout-0-x-sliderRightArrow) {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
.sliderLayoutContainer :global(.vtex-slider-layout-0-x-sliderRightArrow)::after {
|
||||||
|
visibility: visible;
|
||||||
|
content: url(https://agenciamagma.vtexassets.com/arquivos/arrow-right-caina.png);
|
||||||
|
}
|
||||||
|
.sliderLayoutContainer :global(.vtex-slider-layout-0-x-sliderLeftArrow) {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
.sliderLayoutContainer :global(.vtex-slider-layout-0-x-sliderLeftArrow)::before {
|
||||||
|
visibility: visible;
|
||||||
|
content: url(https://agenciamagma.vtexassets.com/arquivos/arrow-left-caina.png);
|
||||||
|
}
|
||||||
.sliderLayoutContainer :global(.vtex-product-summary-2-x-containerNormal) {
|
.sliderLayoutContainer :global(.vtex-product-summary-2-x-containerNormal) {
|
||||||
max-width: unset !important;
|
max-width: unset !important;
|
||||||
}
|
}
|
||||||
|
@ -348,8 +348,9 @@
|
|||||||
.container--descricao {
|
.container--descricao {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
.container--descricao {
|
.productDescriptionContainer--descricao {
|
||||||
border-bottom: 1px solid #bfbfbf;
|
border-bottom: 1px solid #bfbfbf;
|
||||||
padding-bottom: 16px;
|
padding-bottom: 16px;
|
||||||
}
|
}
|
||||||
@ -362,32 +363,41 @@
|
|||||||
color: #575757;
|
color: #575757;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
}
|
}
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
.productDescriptionTitle--descricao {
|
||||||
|
font-size: 32px;
|
||||||
|
}
|
||||||
|
}
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
.productDescriptionTitle--descricao {
|
.productDescriptionTitle--descricao {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.content--descricao {
|
/*.content--descricao {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
color: #929292;
|
color: $color-gray6;
|
||||||
}
|
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
.content--descricao {
|
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 19px;
|
line-height: 19px;
|
||||||
}
|
}
|
||||||
}
|
}*/
|
||||||
|
|
||||||
.productDescriptionText--descricao {
|
.productDescriptionText--descricao {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
color: #929292;
|
color: #929292;
|
||||||
}
|
}
|
||||||
@media screen and (max-width: 768px) {
|
@media screen and (min-width: 1921px) {
|
||||||
|
.productDescriptionText--descricao {
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (max-width: 1024px) {
|
||||||
.productDescriptionText--descricao {
|
.productDescriptionText--descricao {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 19px;
|
line-height: 19px;
|
||||||
@ -615,4 +625,12 @@
|
|||||||
line-height: 19px;
|
line-height: 19px;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(.vtex-store-footer-2-x-socialNetworksContainer) {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(.vtex-store-footer-2-x-acceptedPaymentMethodContainer) {
|
||||||
|
margin: 0;
|
||||||
}
|
}
|
@ -11,6 +11,12 @@
|
|||||||
padding-left: 40px;
|
padding-left: 40px;
|
||||||
padding-right: 40px;
|
padding-right: 40px;
|
||||||
}
|
}
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
.container--details {
|
||||||
|
padding-left: 360px;
|
||||||
|
padding-right: 360px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.listContainer {
|
.listContainer {
|
||||||
border-bottom: 1px solid #bfbfbf;
|
border-bottom: 1px solid #bfbfbf;
|
||||||
@ -47,6 +53,12 @@
|
|||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
@media screen and (max-width: 1024px) {
|
||||||
|
.listItem :global(.vtex-button) {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
.listItem :global(.vtex-button) {
|
.listItem :global(.vtex-button) {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border: none;
|
border: none;
|
||||||
@ -60,9 +72,14 @@
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
.listItem :global(.vtex-button__label) {
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.listItemActive {
|
.listItemActive {
|
||||||
border-bottom: 2px solid #000000;
|
/*border-bottom: 2px solid $color-black-100;*/
|
||||||
}
|
}
|
||||||
.listItemActive :global(.vtex-button__label) {
|
.listItemActive :global(.vtex-button__label) {
|
||||||
color: #000000;
|
color: #000000;
|
||||||
@ -77,10 +94,18 @@
|
|||||||
|
|
||||||
.listItemActive--descricao {
|
.listItemActive--descricao {
|
||||||
border-bottom: 2px solid #000000;
|
border-bottom: 2px solid #000000;
|
||||||
|
padding-left: 14px;
|
||||||
|
padding-right: 14px;
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
.listItemActive--descricao {
|
||||||
|
border-bottom: 3px solid #000000;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
.listItemActive--descricao {
|
.listItemActive--descricao {
|
||||||
border: none;
|
border: none;
|
||||||
|
padding: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.listItemActive--descricao :global(.vtex-button) {
|
.listItemActive--descricao :global(.vtex-button) {
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
.container--testebread {
|
.container--breadcrumb {
|
||||||
margin-left: 40px;
|
margin-left: 40px;
|
||||||
margin-right: 40px;
|
margin-right: 40px;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@ -6,12 +6,16 @@
|
|||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 19px;
|
line-height: 19px;
|
||||||
color: $color-gray6;
|
color: $color-gray6;
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
margin-left: 360px;
|
||||||
|
margin-right: 360px;
|
||||||
|
}
|
||||||
|
|
||||||
.homeIcon--testebread {
|
.homeIcon--breadcrumb {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.homeLink--testebread {
|
.homeLink--breadcrumb {
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
&::after {
|
&::after {
|
||||||
content: "Home";
|
content: "Home";
|
||||||
@ -22,7 +26,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.link--testebread--1 {
|
.link--breadcrumb--1 {
|
||||||
font-size: 0;
|
font-size: 0;
|
||||||
|
|
||||||
&::after {
|
&::after {
|
||||||
@ -33,8 +37,8 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.termArrow--testebread,
|
.termArrow--breadcrumb,
|
||||||
.term--testebread {
|
.term--breadcrumb {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -18,6 +18,13 @@
|
|||||||
.flexRow--container-produto {
|
.flexRow--container-produto {
|
||||||
padding-left: 40px;
|
padding-left: 40px;
|
||||||
padding-right: 40px;
|
padding-right: 40px;
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
padding-left: 360px;
|
||||||
|
padding-right: 360px;
|
||||||
|
}
|
||||||
|
:global(.vtex-store-components-3-x-container) {
|
||||||
|
display: contents;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.flexRowContent--container-produto {
|
.flexRowContent--container-produto {
|
||||||
|
@ -8,12 +8,6 @@
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*.vtex-numeric-stepper__input {
|
|
||||||
border-left: none;
|
|
||||||
border-right: none;
|
|
||||||
height: 50px;
|
|
||||||
}*/
|
|
||||||
|
|
||||||
.hideDecorators {
|
.hideDecorators {
|
||||||
border: 1px solid red;
|
border: 1px solid red;
|
||||||
border-left: none;
|
border-left: none;
|
||||||
@ -21,39 +15,19 @@
|
|||||||
height: 49px;
|
height: 49px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*.numeric-stepper__plus-button {
|
|
||||||
border: none;
|
|
||||||
height: 50px;
|
|
||||||
}*/
|
|
||||||
|
|
||||||
/*.quantitySelectorInputContainer {
|
|
||||||
height: 50px;
|
|
||||||
}*/
|
|
||||||
|
|
||||||
/*.availableQuantityContainer {
|
|
||||||
border: 1px solid yellow;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
.quantitySelectorContainer--quantidade {
|
.quantitySelectorContainer--quantidade {
|
||||||
margin-right: 5px;
|
margin-right: 10px;
|
||||||
|
margin-bottom: 16px;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
/*height: 49px;*/
|
|
||||||
@media screen and (max-width: 768px) {
|
@media screen and (max-width: 768px) {
|
||||||
margin: 0 0 10px 0;
|
margin: 0 0 10px 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/*.summaryContainer {
|
|
||||||
background-color: blue;
|
|
||||||
border: 1px solid orange;
|
|
||||||
height: 49px;
|
|
||||||
}*/
|
|
||||||
:global(.vtex-numeric-stepper__input) {
|
:global(.vtex-numeric-stepper__input) {
|
||||||
height: 49px;
|
height: 49px;
|
||||||
width: 30px;
|
width: 32px;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
|
@ -2,9 +2,16 @@
|
|||||||
padding-left: 40px;
|
padding-left: 40px;
|
||||||
padding-right: 40px;
|
padding-right: 40px;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
padding-left: 360px;
|
||||||
|
padding-right: 360px;
|
||||||
|
}
|
||||||
|
|
||||||
.sliderTrackContainer--prateleira {
|
.sliderTrackContainer--prateleira {
|
||||||
width: 97.1773%;
|
width: 97.1773%;
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
width: 97.914%;
|
||||||
|
}
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
width: 97.63%;
|
width: 97.63%;
|
||||||
}
|
}
|
||||||
@ -46,14 +53,35 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.sliderArrows--prateleira {
|
.sliderArrows--prateleira {
|
||||||
margin: 14px;
|
margin: 30px;
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
margin: 350px;
|
||||||
|
}
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
margin: 28px;
|
margin: 30px;
|
||||||
|
}
|
||||||
|
@media screen and (max-width: 768px) {
|
||||||
|
margin: 34px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.sliderLayoutContainer {
|
.sliderLayoutContainer {
|
||||||
|
//ARROWS CUSTOM
|
||||||
|
:global(.vtex-slider-layout-0-x-sliderRightArrow) {
|
||||||
|
visibility: hidden;
|
||||||
|
&::after {
|
||||||
|
visibility: visible;
|
||||||
|
content: url(https://agenciamagma.vtexassets.com/arquivos/arrow-right-caina.png);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
:global(.vtex-slider-layout-0-x-sliderLeftArrow) {
|
||||||
|
visibility: hidden;
|
||||||
|
&::before {
|
||||||
|
visibility: visible;
|
||||||
|
content: url(https://agenciamagma.vtexassets.com/arquivos/arrow-left-caina.png);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
:global(.vtex-product-summary-2-x-containerNormal) {
|
:global(.vtex-product-summary-2-x-containerNormal) {
|
||||||
max-width: unset !important;
|
max-width: unset !important;
|
||||||
}
|
}
|
||||||
|
@ -389,6 +389,9 @@
|
|||||||
|
|
||||||
.container--descricao {
|
.container--descricao {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productDescriptionContainer--descricao {
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
border-bottom: 1px solid $color-gray9;
|
border-bottom: 1px solid $color-gray9;
|
||||||
padding-bottom: 16px;
|
padding-bottom: 16px;
|
||||||
@ -400,26 +403,34 @@
|
|||||||
line-height: 32px;
|
line-height: 32px;
|
||||||
color: $color-gray8;
|
color: $color-gray8;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
font-size: 32px;
|
||||||
|
}
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.content--descricao {
|
/*.content--descricao {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
color: $color-gray6;
|
color: $color-gray6;
|
||||||
|
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 19px;
|
line-height: 19px;
|
||||||
}
|
}
|
||||||
}
|
}*/
|
||||||
.productDescriptionText--descricao {
|
.productDescriptionText--descricao {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
color: $color-gray6;
|
color: $color-gray6;
|
||||||
@media screen and (max-width: 768px) {
|
@media screen and (min-width: 1921px) {
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 25px;
|
||||||
|
}
|
||||||
|
@media screen and (max-width: 1024px) {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 19px;
|
line-height: 19px;
|
||||||
}
|
}
|
||||||
@ -650,3 +661,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
//BUG SCROLL
|
||||||
|
:global(.vtex-store-footer-2-x-socialNetworksContainer) {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
:global(.vtex-store-footer-2-x-acceptedPaymentMethodContainer) {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
@ -1,6 +1,10 @@
|
|||||||
.container--details {
|
.container--details {
|
||||||
padding-left: 40px;
|
padding-left: 40px;
|
||||||
padding-right: 40px;
|
padding-right: 40px;
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
padding-left: 360px;
|
||||||
|
padding-right: 360px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.listContainer {
|
.listContainer {
|
||||||
@ -34,6 +38,10 @@
|
|||||||
:global(.vtex-button) {
|
:global(.vtex-button) {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
@media screen and (max-width: 1024px) {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
:global(.vtex-button) {
|
:global(.vtex-button) {
|
||||||
@ -49,11 +57,15 @@
|
|||||||
text-transform: capitalize;
|
text-transform: capitalize;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.listItemActive {
|
.listItemActive {
|
||||||
border-bottom: 2px solid $color-black-100;
|
/*border-bottom: 2px solid $color-black-100;*/
|
||||||
|
|
||||||
:global(.vtex-button__label) {
|
:global(.vtex-button__label) {
|
||||||
color: $color-black-100;
|
color: $color-black-100;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@ -66,8 +78,14 @@
|
|||||||
|
|
||||||
.listItemActive--descricao {
|
.listItemActive--descricao {
|
||||||
border-bottom: 2px solid $color-black-100;
|
border-bottom: 2px solid $color-black-100;
|
||||||
|
padding-left: 14px;
|
||||||
|
padding-right: 14px;
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
border-bottom: 3px solid $color-black-100;
|
||||||
|
}
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
border: none;
|
border: none;
|
||||||
|
padding: 0;
|
||||||
}
|
}
|
||||||
:global(.vtex-button) {
|
:global(.vtex-button) {
|
||||||
border: none;
|
border: none;
|
||||||
|
Loading…
Reference in New Issue
Block a user