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

feat: Adiciona CSS responsivo para mobile

Browse Source
This commit is contained in:
SamuelCondack 2022-12-18 15:44:38 -03:00
parent b6461af1ad
commit 345e4baf2d
3 changed files with 69 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss
View File

@ -145,32 +145,26 @@
} }
} }
} }
.payment-data{ #client-profile-data{
.accordion-group{
@media (max-width: 1024px){ @media (max-width: 1024px){
width: 100%; width: 100%;
} }
} }
}
#client-profile-data{
.active{
@media (max-width: 415px){
width: fit-content;
}
}
}
#shipping-data{ #shipping-data{
.active{ @media (max-width: 1024px){
@media (max-width: 375px){ width: 100%;
width: fit-content;
} }
} }
#payment-data{
@media (max-width: 1024px) {
width: 100%;
}
width: 100%;
} }
.shipping-data, .shipping-data,
.payment-data, .payment-data,
.client-profile-data { .client-profile-data {
@media (max-width: 1024px){ @media (max-width: 1024px){
width: 100%;
margin: 0; margin: 0;
margin-top: 12px; margin-top: 12px;
} }
@ -232,7 +226,15 @@
.steps-view{ .steps-view{
width: fit-content; width: fit-content;
height: fit-content; height: fit-content;
@media (max-width: 1024px){
width:
95%;
} }
@media (max-width: 550px){
width: 90%;
}
}
.payment-group-item{ .payment-group-item{
font-family: 'Open Sans'; font-family: 'Open Sans';
font-style: normal; font-style: normal;
@ -381,9 +383,6 @@
} }
.vtex-omnishipping-1-x-deliveryGroup { .vtex-omnishipping-1-x-deliveryGroup {
.vtex-omnishipping-1-x-leanShippingGroupList{
width: fit-content;
}
p { p {
color: #7d7d7d; color: #7d7d7d;
font-size: 14px; font-size: 14px;
@ -516,6 +515,12 @@
.ship-neighborhood{ .ship-neighborhood{
display: none; display: none;
} }
.ship-city{
display: none;
}
.ship-state{
display: none;
}
div{ div{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -546,37 +551,44 @@
color: #7D7D7D; color: #7D7D7D;
} }
.input-small{ .input-small{
width: 100%;
height: 42px; height: 42px;
} }
.client-first-name{
width: 40%;
#client-first-name{
width: 100%;
}
@media (max-width: 1024px){
width: 45%;
}
}
.client-last-name{ .client-last-name{
padding-left: 42px; width: 40%;
@media (max-width: 870px){ #client-last-name{
padding-left: 30px; width: 100%;
} }
@media (max-width: 835px){ @media (max-width: 1024px){
padding-left: 25px; width: 45%;
margin-left: 14.5px;
} }
@media (max-width: 820px){
padding-left: 20px;
} }
@media (max-width: 815px){ .client-document{
padding-left: 0px; width: 40%;
#client-document{
width: 100%;
}
@media (max-width: 1024px){
width: 45%;
} }
} }
.client-phone{ .client-phone{
padding-left: 42px; width: 40%;
@media (max-width: 870px){ #client-phone{
padding-left: 30px; width: 100%;
} }
@media (max-width: 835px){ @media (max-width: 1024px){
padding-left: 25px; width: 45%;
} margin-left: 14.5px;
@media (max-width: 820px){
padding-left: 20px;
}
@media (max-width: 815px){
padding-left: 0px;
} }
} }

8
checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss
View File

@ -385,6 +385,14 @@
margin: 0; margin: 0;
width: max-content; width: max-content;
.srp-postal-code__form{
@media (max-width: 1024px){
width: 40%;
}
}
div[class="cart-more-options span7"]{
width: 100%;
}
.srp-container { .srp-container {

7
checkout/src/arquivos/sass/checkout/_checkout-pagamento.scss
View File

@ -13,10 +13,17 @@ body .container-main.container-order-form .orderform-template.active {
width: 100%; width: 100%;
} }
} }
@media (min-width: 1025px){
.orderform-template-holder { .orderform-template-holder {
width: 66.1132%; width: 66.1132%;
} }
} }
@media (max-width: 1024px){
.orderform-template-holder{
width: 100%;
}
}
}
.mini-cart .info{ .mini-cart .info{
float: none; float: none;