feat: estiliza o bloco product-quantity e cria um bloco html pra unir os blocos do product-quantity e do botão de adicionar ao carrinho

This commit is contained in:
Sabrina Miranda 2023-02-01 21:52:20 -03:00
parent 59f1c1aa4d
commit 7334a77bf7
6 changed files with 90 additions and 7 deletions

View File

@ -4,9 +4,35 @@
[class*="html--add-to-cart-button"] button {
background-color: #000000;
background-color: #000000 !important;
border: none;
width: 526px;
height: 49px;
padding: 12px 64px;
}
[class*="html--product-quantity-cart-button"] {
display: flex;
flex-direction: row;
gap: 10px;
margin-bottom: 16px;
}
[class*="html--product-quantity-cart-button"] input{
height: 49px;
font-weight: 400;
font-size: 16px;
line-height: 22px;
color: #929292;
}
[class*="html--product-quantity-cart-button"] button{
height: 49px;
background-color: #FFFFFF;
font-weight: 400;
font-size: 16px;
line-height: 22px;
color: #000000;
}

View File

@ -10,6 +10,7 @@
"product-questions-and-answers"
]
},
"html#breadcrumb": {
"props": {
"tag": "section",
@ -18,20 +19,24 @@
},
"children": ["breadcrumb"]
},
"flex-layout.row#specifications-title": {
"children": ["rich-text#specifications"]
},
"rich-text#specifications": {
"props": {
"text": "##### Product Specifications"
}
},
"flex-layout.row#description": {
"props": {
"marginBottom": 7
},
"children": ["product-description"]
},
"condition-layout.product#availability": {
"props": {
"conditions": [
@ -43,6 +48,7 @@
"Else": "flex-layout.row#product-availability"
}
},
"flex-layout.row#product-main": {
"props": {
"colGap": 7,
@ -81,6 +87,7 @@
"rowGap": 0
}
},
"html#product-image": {
"props":{
"tag": "div",
@ -89,6 +96,7 @@
},
"children": ["product-images"]
},
"product-images": {
"props": {
"aspectRatio": "1:1",
@ -99,6 +107,27 @@
"thumbnailAspectRatio": "1:1"
}
},
"html#product-quantity": {
"props": {
"tag": "div",
"testId": "product-quantity",
"blockClass": "product-quantity"
},
"children": ["product-quantity"]
},
"html#product-quantity-cart-button": {
"props": {
"tag": "div",
"blockClass": "product-quantity-cart-button"
},
"children": [
"html#product-quantity",
"flex-layout.row#buy-button"
]
},
"flex-layout.col#right-col": {
"props": {
"preventVerticalStretch": true,
@ -112,10 +141,11 @@
"flex-layout.row#selling-price",
"product-installments#m3",
"html#sku-selector-m3",
"product-quantity",
"html#product-quantity-cart-button",
/*"html#product-quantity",*/
"product-assembly-options",
"product-gifts",
"flex-layout.row#buy-button",
/*"flex-layout.row#buy-button",*/
"availability-subscriber",
"shipping-simulator",
"share#default"
@ -176,6 +206,7 @@
"flex-layout.col#right-col-availability"
]
},
"flex-layout.col#right-col-availability": {
"props": {
"preventVerticalStretch": true,
@ -189,6 +220,7 @@
"flex-layout.row#availability"
]
},
"flex-layout.row#availability": {
"props": {
"blockClass": "message-availability"

View File

@ -9,6 +9,7 @@
/* Grid breakpoints */
.buttonText {
font-weight: 400;
font-size: 18px;
line-height: 25px;
font-size: 18px !important;
line-height: 25px !important;
color: #FFFFFF !important;
}

View File

@ -0,0 +1,16 @@
/*
0 - 600PX: Phone
600 - 900px: Table portrait
900 - 1200px: Tablet landscape
[1200 - 1800] is where our nortal styles apply
1800px + : Big desktop
*/
/* Media Query M3 */
/* Grid breakpoints */
.quantitySelectorTitle {
display: none;
}
.quantitySelectorContainer {
margin: 0;
}

View File

@ -1,5 +1,6 @@
.buttonText {
font-weight: 400;
font-size: 18px;
line-height: 25px;
font-size: 18px !important;
line-height: 25px !important;
color: #FFFFFF !important;
}

View File

@ -0,0 +1,7 @@
.quantitySelectorTitle {
display: none;
}
.quantitySelectorContainer {
margin: 0;
}