Rafael_Sampaio_de_Oliveira/challenge-vtex-io-rafael-sampaio
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: ajuste css sku e preteleira

Browse Source
This commit is contained in:
Rafael Sampaio de Oliveira 2023-02-03 15:39:27 -03:00
parent c8d71f4fb9
commit 676dd1e71e
3 changed files with 50 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -5,7 +5,7 @@
} }
[class*="html--product-quantity"] { [class*="html--product-quantity"] {
width: 24.335%; width: 161.58px;
} }
[class*="html--add-to-cart"] { [class*="html--add-to-cart"] {
@ -38,11 +38,6 @@
width: 100%; width: 100%;
} }
[class*="html--shelf"] {
display: flex;
justify-content: center;
}
@media (min-width: 1921px) { @media (min-width: 1921px) {
[class*="html--product-quantity"] { [class*="html--product-quantity"] {
width: 16.712%; width: 16.712%;
@ -51,9 +46,18 @@
[class*="html--descriptionImage"] { [class*="html--descriptionImage"] {
width: 47.392%; width: 47.392%;
} }
[class*="html--shelf"] {
display: flex;
justify-content: center;
}
} }
@media (max-width: 1024px) { @media (max-width: 1024px) {
[class*="html--product-quantity"] {
width: 149.91px;
}
[class*="html--buy-button"] { [class*="html--buy-button"] {
margin-bottom: 16px; margin-bottom: 16px;
} }
@ -73,6 +77,10 @@
gap: 0; gap: 0;
} }
[class*="html--product-quantity"] {
width: 128px;
}
[class*="html--buy-button"] :global(.vtex-button) { [class*="html--buy-button"] :global(.vtex-button) {
height: 74px; height: 74px;
padding: 0 64px; padding: 0 64px;

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

@ -53,6 +53,21 @@
height: 40px !important; height: 40px !important;
width: 40px; width: 40px;
} }
.skuSelectorItem .skuSelectorItemTextValue {
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: rgba(185, 185, 185, 0.6);
}
.skuSelectorItem--selected .skuSelectorItemTextValue {
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: #000000;
}
.frameAround { .frameAround {
border-radius: 50%; border-radius: 50%;
@ -65,8 +80,8 @@
left: 6px; left: 6px;
bottom: 0px; bottom: 0px;
z-index: 2; z-index: 2;
width: 28px; width: 30px;
height: 28px; height: 33px;
} }
.skuSelectorInternalBox { .skuSelectorInternalBox {

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

@ -41,6 +41,23 @@
.skuSelectorItem { .skuSelectorItem {
height: 40px !important; height: 40px !important;
width: 40px; width: 40px;
.skuSelectorItemTextValue {
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: #b9b9b999;
}
}
.skuSelectorItem--selected {
.skuSelectorItemTextValue {
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: $color-black;
}
} }
.frameAround { .frameAround {
@ -54,8 +71,8 @@
left: 6px; left: 6px;
bottom: 0px; bottom: 0px;
z-index: 2; z-index: 2;
width: 28px; width: 30px;
height: 28px; height: 33px;
} }
.skuSelectorInternalBox { .skuSelectorInternalBox {