Gustavo_Rallenson_Goncalves_Da_Silva/challenge-vtex-io-Gustavo-Rallenson
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(product-image):ajustando thumnails conforme o figma

Browse Source 
finalizando product-images
This commit is contained in:
Gustavo Rallenson Gonçalves Da Silva 2023-01-30 19:51:12 -03:00
parent 9187738596
commit 9d6d696e9a
4 changed files with 16 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
styles/css/vtex.breadcrumb.css
View File

@ -13,6 +13,11 @@
margin-right: auto;
max-width: 96rem;
}
@media screen and (max-width: 64.0625em) {
.container {
padding: 0 0 0 10.67%;
}
}
.container .term, .container .termArrow {
display: none;
}

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

@ -69,6 +69,7 @@
align-self: stretch;
}
.carouselContainer .productImage .productImageTag--main {
border-radius: 8px;
max-height: 100% !important;
}
@ -83,7 +84,7 @@
}
@media screen and (max-width: 64.0625em) {
.carouselGaleryThumbs .productImagesThumb {
width: 32% !important;
width: 30% !important;
}
}
.carouselGaleryThumbs .productImagesThumb .figure {
@ -93,19 +94,15 @@
min-height: 90px;
}
.carouselGaleryThumbs .productImagesThumb .figure--video .thumbImg {
border-radius: 8px;
min-height: 5.54em;
}
@media screen and (max-width: 64.0625em) {
.carouselGaleryThumbs .productImagesThumb .figure--video .thumbImg {
width: 50px;
min-height: 4.9em;
}
}
.carouselGaleryThumbs .productImagesThumb .figure .thumbImg {
border-radius: 8px;
width: 90px;
}
@media screen and (max-width: 64.0625em) {
.carouselGaleryThumbs .productImagesThumb .figure .thumbImg {
width: 50px;
}
}

3
styles/sass/pages/product/vtex.breadcrumb.scss
View File

@ -3,6 +3,9 @@
margin-left: auto;
margin-right: auto;
max-width: 96rem;
@media screen and (max-width: 64.0625em){
padding: 0 0 0 10.67%;
}
.term,.termArrow{
display: none;
}

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

@ -65,6 +65,7 @@
margin-bottom: 1em;
align-self: stretch;
&-main{
border-radius: 8px;
max-height: 100% !important;
}
}
@ -78,25 +79,23 @@
background:white;
margin-right: 1em;
@media screen and (max-width: 64.0625em){
width: 32% !important;
width: 30% !important;
}
.figure{
width: 100%;
&--video{
min-height: 90px;
.thumbImg{
border-radius: 8px;
min-height: 5.54em;
@media screen and (max-width: 64.0625em){
width: 50px;
min-height: 4.9em;
}
}
}
.thumbImg{
border-radius: 8px;
width: 90px;
@media screen and (max-width: 64.0625em){
width: 50px;
}
}
}
}