ThiagoDutraSampaioLeite/m3-academy-template-checkout-thiago-dutra
1
0
Fork 0
forked from M3-Academy/m3-academy-template-checkout
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: Cria responsividade prateleira

Browse Source
This commit is contained in:
ThiagoDuutra 2022-12-15 12:07:05 -03:00
parent e58387d8dc
commit ffa3756bc7
2 changed files with 34 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
checkout/src/arquivos/js/components/Footer.js
View File

@ -139,6 +139,13 @@ export default class Footer {
slidesToScroll: 1,
},
},
{
breakpoint: 720,
settings: {
slidesToShow: 2,
slidesToScroll: 2,
},
},
],
});
}

27
checkout/src/arquivos/sass/partials/_prateleira.scss
View File

@ -6,6 +6,10 @@
justify-content: center;
flex-direction: column;
@media (max-width: 1024px) {
width: 98% !important;
}
h2 {
font-weight: 400;
font-size: 24px;
@ -24,6 +28,15 @@
width: 242px;
height: 242px;
background: $color-gray3;
@media (max-width: 1024px) {
width: 320px;
height: 320px;
}
@media (max-width: 350px) {
width: 164px;
height: 164px;
}
}
.prateleira-text {
color: $color-black;
@ -35,6 +48,9 @@
margin-bottom: 25px;
align-items: center;
justify-content: center;
@media (max-width: 350px) {
flex-wrap: wrap;
}
button {
display: flex;
@ -64,8 +80,19 @@
top: 43%;
}
.slick-prev {
@media (max-width: 350px) {
top: 45%;
left: 0;
}
}
.slick-next {
right: 30px;
@media (max-width: 350px) {
top: 45%;
right: 15px;
}
}
.btn-list-prateleira {