forked from M3-Academy/challenge-vtex-io
feat: faz o site para telas de 1024px
This commit is contained in:
parent
741b36d69d
commit
8c81925dca
@ -1,14 +1,27 @@
|
||||
[class*="productImageTag--main"] {
|
||||
object-fit: none;
|
||||
object-fit: none !important;
|
||||
width: 98.225% !important;
|
||||
height: 100% !important;
|
||||
max-height: 664px !important;
|
||||
}
|
||||
|
||||
[class*="flexRow--button-cart"] :global(.vtex-button) {
|
||||
background-color: black;
|
||||
border-color: black;
|
||||
width: 97.952%;
|
||||
height: 49px;
|
||||
}
|
||||
|
||||
[class*="flexRow--button-cart"] {
|
||||
background-color: black;
|
||||
border-color: black;
|
||||
width: 73.464%;
|
||||
height: 49px;
|
||||
position: relative;
|
||||
bottom: 72px;
|
||||
left: 148px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
[class*="numeric-stepper__minus-button__text"] {
|
||||
position: absolute !important;
|
||||
left: 50%;
|
||||
@ -62,6 +75,11 @@
|
||||
height: 46px;
|
||||
}
|
||||
|
||||
[class*="skuSelectorContainer"] {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
|
||||
[class*="skuSelectorSubcontainer--cor"]
|
||||
:global(.vtex-store-components-3-x-skuSelectorName) {
|
||||
font-size: 0;
|
||||
@ -179,6 +197,20 @@
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
[class*="vtex-address-form__postalCode"] :global(.vtex-input__label) {
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
[class*="vtex-address-form__postalCode"] :global(.vtex-input__label)::after {
|
||||
font-family: "Open Sans";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 19px;
|
||||
color: #929292;
|
||||
content: "CALCULAR FRETE:";
|
||||
}
|
||||
|
||||
[class*="vtex-address-form__postalCode-forgottenURL"] :global(.pointer) {
|
||||
color: black;
|
||||
text-decoration: underline;
|
||||
@ -208,7 +240,7 @@
|
||||
}
|
||||
|
||||
[class*="listContainer"] {
|
||||
justify-content: space-between;
|
||||
justify-content: space-around;
|
||||
color: black;
|
||||
background-color: transparent;
|
||||
border-bottom: 1px solid #bfbfbf;
|
||||
@ -331,7 +363,7 @@
|
||||
content: "ENTREGA";
|
||||
position: relative;
|
||||
right: 500%;
|
||||
top: -30px;
|
||||
top: -23px;
|
||||
font-family: "Open Sans";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
@ -344,7 +376,7 @@
|
||||
content: "FRETE";
|
||||
position: relative;
|
||||
right: 329%;
|
||||
top: -52px;
|
||||
top: -45px;
|
||||
font-family: "Open Sans";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
@ -357,7 +389,7 @@
|
||||
content: "PRAZO";
|
||||
position: relative;
|
||||
right: 108%;
|
||||
top: -72px;
|
||||
top: -67px;
|
||||
font-family: "Open Sans";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
@ -476,7 +508,115 @@
|
||||
}
|
||||
|
||||
[class*="container--home"] {
|
||||
width: 94.44%;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
margin: 0 40px;
|
||||
}
|
||||
|
||||
[class*="agenciamagma-store-theme-5-x-html--shipping"] {
|
||||
position: relative;
|
||||
bottom: 77px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
[class*="thumbImg--product-images"] {
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
gap: 16px;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
[class*="productDescriptionText"]
|
||||
:global(.vtex-store-components-3-x-container) {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
[class*="vtex-store-components-3-x-container"] {
|
||||
margin: 0 40px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
[class*="listContainer"] {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
[class*="vtex-store-components-3-x-container"]
|
||||
:global(.vtex-flex-layout-0-x-flexRowContent) {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
[class*="vtex-flex-layout-0-x-stretchChildrenWidth"] {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
[class*="productNameContainer"] {
|
||||
text-align: start !important;
|
||||
}
|
||||
|
||||
[class*="product-identifier__value"] {
|
||||
text-align: start !important;
|
||||
position: unset !important;
|
||||
}
|
||||
|
||||
[class*="productImageTag"] {
|
||||
max-height: none !important;
|
||||
width: 100% !important;
|
||||
margin: auto !important;
|
||||
}
|
||||
|
||||
[class*="ph5-m"] {
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
[class*="vtex-store-components-3-x-container"] {
|
||||
margin: 0 40px;
|
||||
}
|
||||
|
||||
[class*="flexRow--button-cart"] {
|
||||
width: 85.382%;
|
||||
}
|
||||
|
||||
[class*="productDescriptionContainer"] {
|
||||
margin-left: 0px;
|
||||
}
|
||||
|
||||
[class*="agenciamagma-store-theme-5-x-html--shipping"] {
|
||||
position: relative !important;
|
||||
bottom: 75.5px !important;
|
||||
margin-top: 16px !important;
|
||||
}
|
||||
|
||||
[class*="agenciamagma-store-theme-5-x-html--shipping"] {
|
||||
position: relative !important;
|
||||
bottom: 75.5px !important;
|
||||
margin-top: 16px !important;
|
||||
}
|
||||
|
||||
[class*="productDescriptionText"]
|
||||
:global(.vtex-store-components-3-x-container) {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
[class*="listContainer"] {
|
||||
border-top: 1px solid #bfbfbf;
|
||||
}
|
||||
[class*="listItemActive"] :global(.vtex-button) {
|
||||
border-bottom: none;
|
||||
}
|
||||
[class*="imageNormal"] {
|
||||
width: 291.4px;
|
||||
height: 291.4px;
|
||||
}
|
||||
|
||||
[class*="listItem"] :global(.vtex-button):hover {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
[data-testid="product-description"] {
|
||||
position: relative;
|
||||
bottom: 125px;
|
||||
}
|
||||
|
||||
[class*="thumbImg--product-images"] {
|
||||
gap: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -66,7 +66,7 @@
|
||||
"itemsPerPage": {
|
||||
"desktop": 4,
|
||||
"tablet": 3,
|
||||
"phone": 1
|
||||
"phone": 2
|
||||
},
|
||||
"infinite": true,
|
||||
"fullWidth": false,
|
||||
|
||||
@ -3,9 +3,9 @@
|
||||
"children": [
|
||||
"html#breadcrumb",
|
||||
"condition-layout.product#availability",
|
||||
"tab-layout#home",
|
||||
"html#product-description",
|
||||
"rich-text#textproducts",
|
||||
"list-context.product-list#demo1",
|
||||
"list-context.product-list#produtos",
|
||||
"rich-text#textnewsletter",
|
||||
"newsletter",
|
||||
"product-questions-and-answers"
|
||||
@ -47,8 +47,13 @@
|
||||
"product-summary-price"
|
||||
]
|
||||
},
|
||||
"list-context.product-list#demo1": {
|
||||
"list-context.product-list#produtos": {
|
||||
"blocks": ["product-summary.shelf#demo1"],
|
||||
"children": ["html#slider"]
|
||||
},
|
||||
|
||||
"html#slider": {
|
||||
"props": { "testId": "product-summary-list" },
|
||||
"children": ["slider-layout#demo-products"]
|
||||
},
|
||||
|
||||
@ -70,12 +75,17 @@
|
||||
},
|
||||
"flex-layout.row#description": {
|
||||
"props": {
|
||||
"width": {
|
||||
"tablet": "100%"
|
||||
},
|
||||
"marginBottom": 7
|
||||
},
|
||||
"children": ["image#tab", "product-description"]
|
||||
},
|
||||
"condition-layout.product#availability": {
|
||||
"props": {
|
||||
"blockClass": "produtoHome",
|
||||
"id": "produtoHome",
|
||||
"conditions": [
|
||||
{
|
||||
"subject": "isProductAvailable"
|
||||
@ -122,11 +132,12 @@
|
||||
}
|
||||
},
|
||||
"flex-layout.row#product-image": {
|
||||
"props": {},
|
||||
"props": { "blockClass": "product-images" },
|
||||
"children": ["html#product-images"]
|
||||
},
|
||||
"product-images": {
|
||||
"props": {
|
||||
"blockClass": "product-images",
|
||||
"contentType": "images",
|
||||
"showNavigationArrows": false,
|
||||
"showPaginationDots": false,
|
||||
@ -139,13 +150,17 @@
|
||||
}
|
||||
},
|
||||
|
||||
"html#shipping-simulator": {
|
||||
"props": {
|
||||
"blockClass": "shipping",
|
||||
"testId": "shipping-simulator"
|
||||
},
|
||||
"children": ["shipping-simulator"]
|
||||
},
|
||||
|
||||
"html#product-images": {
|
||||
"props": {
|
||||
"thumbnailsOrientation": "horizontal",
|
||||
"tag": "section",
|
||||
"infinite": "true",
|
||||
"preventHorizontalStretch": "true",
|
||||
"verticalAlign": "bottom",
|
||||
"blockClass": "product-images",
|
||||
"testId": "product-images"
|
||||
},
|
||||
"children": ["product-images"]
|
||||
@ -158,33 +173,55 @@
|
||||
},
|
||||
"children": [
|
||||
"flex-layout.row#product-name",
|
||||
"product-identifier.product",
|
||||
"html#codigo",
|
||||
"product-rating-summary",
|
||||
"flex-layout.row#list-price-savings",
|
||||
"flex-layout.row#selling-price",
|
||||
"product-installments#m3-academy",
|
||||
"ProductContext",
|
||||
"sku-selector",
|
||||
"html#product-installments",
|
||||
"html#pix",
|
||||
"html#sku-selector",
|
||||
"html#product-quantity",
|
||||
"product-gifts",
|
||||
"flex-layout.row#buy-button",
|
||||
"availability-subscriber",
|
||||
"shipping-simulator"
|
||||
"html#shipping-simulator"
|
||||
]
|
||||
},
|
||||
|
||||
"html#sku-selector": {
|
||||
"props": { "testId": "sku-selector" },
|
||||
"children": ["sku-selector"]
|
||||
},
|
||||
|
||||
"html#pix": {
|
||||
"props": { "testId": "pix-price", "blockClass": "pix" },
|
||||
"children": ["ProductContext"]
|
||||
},
|
||||
|
||||
"html#product-installments": {
|
||||
"props": { "testId": "product-installments" },
|
||||
"children": ["product-installments"]
|
||||
},
|
||||
|
||||
"image#tab": {
|
||||
"props": {
|
||||
"src": "assets/img-sapato.png"
|
||||
}
|
||||
},
|
||||
|
||||
"tab-layout#home": {
|
||||
"tab-layout": {
|
||||
"children": ["tab-list#home", "tab-content#home"],
|
||||
"props": {
|
||||
"blockClass": "home",
|
||||
"defaultActiveTabId": "home1"
|
||||
}
|
||||
},
|
||||
|
||||
"html#product-description": {
|
||||
"props": { "testId": "product-description" },
|
||||
"children": ["tab-layout"]
|
||||
},
|
||||
|
||||
"tab-list#home": {
|
||||
"children": [
|
||||
"tab-list.item#home1",
|
||||
@ -270,7 +307,7 @@
|
||||
}
|
||||
},
|
||||
|
||||
"product-installments#m3-academy": {
|
||||
"product-installments": {
|
||||
"props": {
|
||||
"installmentsCriteria": "max-quantity-without-interest",
|
||||
"markers": ["discount", "vezes"],
|
||||
@ -283,6 +320,11 @@
|
||||
"props": {
|
||||
"marginBottom": 3
|
||||
},
|
||||
"children": ["html#product-name"]
|
||||
},
|
||||
|
||||
"html#product-name": {
|
||||
"props": { "testId": "product-name" },
|
||||
"children": ["vtex.store-components:product-name"]
|
||||
},
|
||||
|
||||
@ -300,11 +342,15 @@
|
||||
"marginBottom": 7,
|
||||
"blockClass": "button-cart"
|
||||
},
|
||||
"children": ["product-quantity", "html#add-to-cart-button"]
|
||||
"children": ["html#add-to-cart-button"]
|
||||
},
|
||||
|
||||
"product-quantity": {
|
||||
"props": { "width": "25%" }
|
||||
"props": {}
|
||||
},
|
||||
"html#product-quantity": {
|
||||
"props": { "testId": "product-quantity" },
|
||||
"children": ["product-quantity"]
|
||||
},
|
||||
|
||||
"html#add-to-cart-button": {
|
||||
@ -334,11 +380,17 @@
|
||||
},
|
||||
"children": [
|
||||
"flex-layout.row#product-name",
|
||||
"product-identifier.product",
|
||||
"sku-selector",
|
||||
"flex-layout.row#availability"
|
||||
"html#codigo",
|
||||
"flex-layout.row#availability",
|
||||
"sku-selector"
|
||||
]
|
||||
},
|
||||
|
||||
"html#codigo": {
|
||||
"props": { "blockClass": "codigo", "testId": "product-code" },
|
||||
"children": ["product-identifier.product"]
|
||||
},
|
||||
|
||||
"flex-layout.row#availability": {
|
||||
"props": {
|
||||
"blockClass": "message-availability"
|
||||
|
||||
@ -1,52 +1,8 @@
|
||||
.homeIcon {
|
||||
visibility: hidden;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.arrow--1 {
|
||||
visibility: hidden;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.arrow--1::after {
|
||||
visibility: visible;
|
||||
.homeLink::after {
|
||||
content: "Home";
|
||||
font-family: "Open Sans";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 19px;
|
||||
color: #929292;
|
||||
}
|
||||
|
||||
.link--2 {
|
||||
visibility: hidden;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.link--2::after {
|
||||
visibility: visible;
|
||||
font-family: "Open Sans";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 19px;
|
||||
color: #929292;
|
||||
content: "Sapatos";
|
||||
}
|
||||
|
||||
.term {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.term::after {
|
||||
visibility: visible;
|
||||
content: "Sandálias";
|
||||
font-family: "Open Sans";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 19px;
|
||||
color: #929292;
|
||||
position: relative;
|
||||
right: 230px;
|
||||
bottom: 2px;
|
||||
}
|
||||
|
||||
@ -1,11 +1,2 @@
|
||||
@media screen and (max-width: 1024px) {
|
||||
.flexRowContent {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
.flexRowContent {
|
||||
margin-right: 40px;
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
|
||||
@ -3,12 +3,6 @@
|
||||
padding: 0 0.5rem;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
.flexRowContent {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 40em) {
|
||||
.flexRowContent--menu-link,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user