SabrinaMiranda/challenge-vtex-io-sabrina-miranda
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: aplica mudanças no código

Browse Source
This commit is contained in:
Sabrina Miranda 2023-02-03 16:57:10 -03:00
parent 8ccd7cd95d
commit 0ecadd329b
4 changed files with 38 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
react/components/Html/styles.css
View File

@ -2,7 +2,8 @@
background-color: #FFFFFF;
}
[class*="html--product-main"] {
[class*="html--product-main"],
[class*="html--product-availability"] {
width: 94.4444%;
margin: 0 auto;
display: grid;
@ -13,7 +14,8 @@
grid-area: 1/1;
}
[class*="html--right-col"] {
[class*="html--right-col"],
[class*="html--info-availability"] {
grid-area: 1/2;
margin-left: 32px;
}

10
store/blocks/pdp/product.jsonc
View File

@ -205,7 +205,7 @@
"html#product-availability": {
"props": {
"tag": "div",
"tag": "section",
"blockClass": "product-availability"
},
"children": [
@ -216,14 +216,14 @@
"html#right-col-availability": {
"props": {
"blockClass": "info-availability",
"tag": "div"
"tag": "section",
"blockClass": "info-availability"
},
"children": [
"html#product-name",
"product-identifier.product",
"html#sku-selector-m3",
"html#availability"
"html#availability",
"html#sku-selector-m3"
]
},

17
styles/css/vtex.store-components.css
View File

@ -67,6 +67,9 @@
margin-top: 16px;
margin-bottom: 16px;
}
.skuSelectorContainer :global(.vtex-store-components-3-x-skuSelectorItemImageValue) {
border-radius: 50%;
}
.skuSelectorName,
.skuSelectorNameSeparator,
@ -87,8 +90,8 @@
}
.skuSelectorItemImage :global(.vtex-store-components-3-x-skuSelectorInternalBox) {
width: 46px;
height: 46px;
width: 100%;
height: 100%;
}
.frameAround {
@ -125,6 +128,12 @@
.skuSelectorItem--selected :global(.vtex-store-components-3-x-skuSelectorItemTextValue) {
color: #000000;
}
.skuSelectorItem--selected :global(.vtex-store-components-3-x-diagonalCross) {
border: 2px solid #000000;
}
.skuSelectorItem--selected :global(.vtex-store-components-3-x-skuSelectorInternalBox) {
border: none;
}
.skuSelectorOptionsList {
gap: 16px;
@ -136,8 +145,8 @@
border: 1px solid #D5D5D5;
transform: rotate(-45deg);
position: absolute;
left: -80%;
right: -10.46%;
left: -100%;
right: -20%;
top: 82.5%;
bottom: 17.5%;
}

20
styles/sass/pages/product/vtex.store-components.scss
View File

@ -57,6 +57,10 @@
flex-direction: column-reverse;
margin-top: 16px;
margin-bottom: 16px;
:global(.vtex-store-components-3-x-skuSelectorItemImageValue) {
border-radius: 50%;
}
}
.skuSelectorName,
@ -79,8 +83,8 @@
.skuSelectorItemImage {
:global(.vtex-store-components-3-x-skuSelectorInternalBox) {
width: 46px;
height: 46px;
width: 100%;
height: 100%;
}
}
@ -118,6 +122,14 @@
:global(.vtex-store-components-3-x-skuSelectorItemTextValue) {
color: #000000;
}
:global(.vtex-store-components-3-x-diagonalCross) {
border: 2px solid #000000;
}
:global(.vtex-store-components-3-x-skuSelectorInternalBox) {
border: none;
}
}
.skuSelectorOptionsList {
@ -132,8 +144,8 @@
transform: rotate(-45deg);
position: absolute;
left: -80%;
right: -10.46%;
left: -100%;
right: -20%;
top: 82.5%;
bottom: 17.5%;
}