BernardoWaldhelm/challenge-vtex-io-bernardo-waldhelm
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style(product): corrigindo posições

Browse Source
This commit is contained in:
Bernardo Cunha Ernani Waldhelm 2023-02-02 16:55:38 -03:00
parent 97a34e9a9c
commit 2447d9dfee
9 changed files with 23 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
react/components/PixDiscount/PixDiscount.module.css
View File

@ -4,7 +4,7 @@
align-items: center;
height: 39px;
column-gap: 26px;
margin-top: 8px;
margin: 8px 0 16px 0;
}
.pixContainer__img {

2
styles/css/vtex.product-summary.css
View File

@ -53,6 +53,8 @@
text-align: center;
text-decoration-line: line-through;
color: #BABABA;
padding: 0;
margin-bottom: 8px;
}
@media (min-width: 769px) and (max-width: 1024px), (min-width: 280px) and (max-width: 768px) {
.containerNormal .clearLink .element .priceContainer .listPriceContainer {

4
styles/css/vtex.slider-layout.css
View File

@ -92,13 +92,15 @@
display: flex;
align-items: center;
justify-content: center;
margin-top: 16px;
top: 100%;
column-gap: 12px;
}
.sliderLayoutContainer--carousel .paginationDotsContainer--carousel .paginationDot--carousel {
background-color: #000;
width: 10px;
height: 10px;
margin: 0;
padding: 0;
}
.sliderLayoutContainer--carousel .paginationDotsContainer--carousel .paginationDot--carousel--isActive {
width: 17px !important;

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

@ -57,21 +57,16 @@
}
}
.carouselGaleryThumbs .productImagesThumb {
width: 10% !important;
height: 100% !important;
width: 90px !important;
height: 90px !important;
margin: 16px 16px 0 0;
border-radius: 8px;
max-width: calc(100% - 16px);
}
@media (min-width: 1025px) and (max-width: 1920px), (min-width: 769px) and (max-width: 1024px), (min-width: 280px) and (max-width: 768px) {
.carouselGaleryThumbs .productImagesThumb {
width: 90px !important;
height: 90px !important;
}
}
.carouselGaleryThumbs .productImagesThumb .figure, .carouselGaleryThumbs .productImagesThumb .thumbImg {
width: 100%;
height: 100%;
border-radius: 8px;
}
.productNameContainer--quickview {
@ -95,7 +90,7 @@
.skuSelectorContainer--sku-product {
display: flex;
flex-direction: column-reverse;
margin: 16px 0;
margin-bottom: 16px;
}
.skuSelectorContainer--sku-product .skuSelectorSubcontainer--tamanho .skuSelectorNameContainer {
margin: 0;

4
styles/css/vtex.tab-layout.css
View File

@ -9,13 +9,13 @@
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap");
/* Grid breakpoints */
.container--description-block {
padding: 16px 360px;
padding: 0 360px 16px 360px;
margin: 0;
max-width: 100%;
}
@media (min-width: 1025px) and (max-width: 1920px), (min-width: 769px) and (max-width: 1024px), (min-width: 280px) and (max-width: 768px) {
.container--description-block {
padding: 16px 40px;
padding: 0 40px 16px 40px;
}
}
.container--description-block .listContainer {

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

@ -42,20 +42,16 @@
}
.productImagesThumb {
width: 10% !important;
height: 100% !important;
width: 90px !important;
height: 90px !important;
margin: 16px 16px 0 0;
border-radius: 8px;
max-width: calc(100% - 16px);
@media #{$mq-desktop}, #{$mq-tablet}, #{$mq-mobile} {
width: 90px !important;
height: 90px !important;
}
.figure, .thumbImg{
width: 100%;
height: 100%;
border-radius: 8px;
}
}
}
@ -82,7 +78,7 @@
.skuSelectorContainer--sku-product {
display: flex;
flex-direction: column-reverse;
margin: 16px 0;
margin-bottom: 16px;
.skuSelectorSubcontainer--tamanho {

2
styles/sass/pages/product/vtexProduct/vtex.product-summary.scss
View File

@ -46,6 +46,8 @@
text-align: center;
text-decoration-line: line-through;
color: #BABABA;
padding: 0;
margin-bottom: 8px;
@media #{$mq-tablet}, #{$mq-mobile} {
font-size: 12px;

5
styles/sass/pages/product/vtexSlider/vtex.slider-layout.scss
View File

@ -77,14 +77,15 @@
display: flex;
align-items: center;
justify-content: center;
margin-top: 16px;
top: 100%;
column-gap: 12px;
.paginationDot--carousel {
background-color: $color-black0;
width: 10px;
height: 10px;
margin: 0;
padding: 0;
}
.paginationDot--carousel--isActive {
width: 17px !important;

4
styles/sass/pages/product/vtexTab/vtex.tab-layout.scss
View File

@ -1,10 +1,10 @@
.container--description-block {
padding:16px 360px;
padding: 0 360px 16px 360px;
margin: 0;
max-width: 100%;
@media #{$mq-desktop}, #{$mq-tablet}, #{$mq-mobile} {
padding: 16px 40px;
padding: 0 40px 16px 40px;
}
.listContainer {