feat(add-card-btn):estilizanod bot

ão de carrinho
This commit is contained in:
Gustavo Rallenson Gonçalves Da Silva 2023-02-02 03:40:09 -03:00
parent 5025125e07
commit feadf14905
6 changed files with 67 additions and 12 deletions

View File

@ -70,7 +70,7 @@
"flex-layout.col#stack": { "flex-layout.col#stack": {
"children": ["stack-layout"], "children": ["stack-layout"],
"props": { "props": {
"width": "60%", "width": "46%",
"rowGap": 10, "rowGap": 10,
"blockClass": "StackLayout" "blockClass": "StackLayout"
} }
@ -98,13 +98,12 @@
}, },
"children": [ "children": [
"flex-layout.row#product-name", "flex-layout.row#product-name",
"product-identifier.product",
"product-rating-summary", "product-rating-summary",
"flex-layout.row#list-price-savings", "flex-layout.row#list-price-savings",
"flex-layout.row#selling-price", "flex-layout.row#selling-price",
"product-installments", "product-installments",
"product-identifier.product",
"sku-selector", "sku-selector",
"product-quantity",
"product-assembly-options", "product-assembly-options",
"product-gifts", "product-gifts",
"flex-layout.row#buy-button", "flex-layout.row#buy-button",
@ -119,12 +118,9 @@
} }
}, },
"product-identifier.product": { "product-identifier.product": {
"props": { "props": {
"label": "hide", //'default' | 'custom' | 'hide' "label": "hide" //'default' | 'custom' | 'hide'
"customLabel": "teste", // text if label is custom
"idField": "skuReferenceId" //'itemId' | 'productId' | 'productReference' | 'skuEan' | 'skuReferenceId'
} }
}, },
@ -145,9 +141,16 @@
"flex-layout.row#buy-button": { "flex-layout.row#buy-button": {
"props": { "props": {
"marginTop": 4, "marginTop": 4,
"marginBottom": 7 "marginBottom": 7,
"blockClass":"buy-button"
}, },
"children": ["add-to-cart-button"] "children": ["product-quantity","add-to-cart-button"]
},
"add-to-cart-button": {
"props": {
"text": "ADICIONAR À SACOLA"
}
}, },
"flex-layout.row#product-availability": { "flex-layout.row#product-availability": {

View File

@ -12,6 +12,24 @@
padding: 0 0.5rem; padding: 0 0.5rem;
} }
.flexRowContent {
padding: 0;
margin: 0;
}
.flexRowContent--buy-button {
gap: 10px;
}
.flexRowContent--buy-button .stretchChildrenWidth {
padding: 0;
width: max-content !important;
}
.flexRowContent--buy-button .stretchChildrenWidth :global(.vtex-button) {
background: black;
height: 49px;
width: 100%;
min-width: 534px;
}
@media screen and (min-width: 40em) { @media screen and (min-width: 40em) {
.flexRowContent--menu-link, .flexRowContent--menu-link,
.flexRowContent--main-header { .flexRowContent--main-header {

View File

@ -0,0 +1,12 @@
/*
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;
}

View File

@ -2,7 +2,23 @@
.flexRowContent--main-header { .flexRowContent--main-header {
padding: 0 0.5rem; padding: 0 0.5rem;
} }
.flexRowContent{
padding: 0;
margin: 0;
&--buy-button{
gap: 10px;
.stretchChildrenWidth{
padding: 0;
width: max-content !important;
:global(.vtex-button){
background: black;
height: 49px;
width: 100%;
min-width: 534px;
}
}
}
}
@media screen and (min-width: 40em) { @media screen and (min-width: 40em) {
.flexRowContent--menu-link, .flexRowContent--menu-link,
.flexRowContent--main-header { .flexRowContent--main-header {

View File

@ -0,0 +1,3 @@
.quantitySelectorTitle{
display: none;
}

View File

@ -1,3 +1,6 @@
.container{
}
.skuSelectorContainer{ .skuSelectorContainer{
display: flex; display: flex;
flex-direction: column-reverse; flex-direction: column-reverse;