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

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

@ -385,6 +385,14 @@
margin: 0;
width: max-content;
.srp-postal-code__form{
@media (max-width: 1024px){
width: 40%;
}
}
div[class="cart-more-options span7"]{
width: 100%;
}
.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%;
}
}
@media (min-width: 1025px){
.orderform-template-holder {
width: 66.1132%;
}
}
@media (max-width: 1024px){
.orderform-template-holder{
width: 100%;
}
}
}
.mini-cart .info{
float: none;