forked from M3-Academy/m3-academy-template-checkout
feat: Aplica css mobile
This commit is contained in:
parent
77aedfc945
commit
e1ce6c233a
@ -165,6 +165,13 @@
|
||||
|
||||
.client-pre-email-h label {
|
||||
margin-top: 0;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
.link-cart {
|
||||
@ -182,6 +189,12 @@
|
||||
line-height: 33px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
font-size: 10px;
|
||||
line-height: 12px;
|
||||
padding-right: 16px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: lighen($color-black, 10);
|
||||
}
|
||||
@ -199,6 +212,10 @@
|
||||
justify-content: center;
|
||||
margin-top: 65px;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin-bottom: 16px;
|
||||
width: 825px;
|
||||
@ -207,6 +224,10 @@
|
||||
width: 1631px;
|
||||
}
|
||||
|
||||
@media (max-width: 860px) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
span,
|
||||
small {
|
||||
font-family: $font-family-secundary;
|
||||
@ -223,6 +244,17 @@
|
||||
line-height: 47px;
|
||||
margin-bottom: 23px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
font-size: 14px;
|
||||
line-height: 16px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 590px) {
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -235,6 +267,14 @@
|
||||
width: 990px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
input {
|
||||
box-shadow: none;
|
||||
color: $color-black2;
|
||||
@ -242,7 +282,7 @@
|
||||
padding: 15px 14px;
|
||||
border: 1px solid $color-black2;
|
||||
box-sizing: border-box;
|
||||
border-radius: 5px;
|
||||
border-radius: 5px 00 5px;
|
||||
width: 443px;
|
||||
height: 50px;
|
||||
font-style: normal;
|
||||
@ -256,6 +296,23 @@
|
||||
font-size: 24px;
|
||||
line-height: 33px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
width: 85%;
|
||||
}
|
||||
|
||||
@media (max-width: 860px) {
|
||||
width: 82%;
|
||||
}
|
||||
|
||||
@media (max-width: 590px) {
|
||||
width: 66.3% !important;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
@media (max-width: 490px) {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
@ -286,12 +343,32 @@
|
||||
padding: 12px 17px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
width: 14.7%;
|
||||
right: 2px;
|
||||
padding: 12px 0;
|
||||
}
|
||||
|
||||
@media (max-width: 860px) {
|
||||
width: 18%;
|
||||
}
|
||||
|
||||
@media (max-width: 590px) {
|
||||
width: 33.7%;
|
||||
}
|
||||
|
||||
@media (max-width: 490px) {
|
||||
height: 48px;
|
||||
height: 52px;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
right: -2px;
|
||||
}
|
||||
|
||||
@media (max-width: 340px) {
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $color-blue3;
|
||||
}
|
||||
@ -321,11 +398,19 @@
|
||||
border: 1px solid $color-black2;
|
||||
border-radius: 5px;
|
||||
width: 400px;
|
||||
height: 150px;
|
||||
min-height: 150px;
|
||||
|
||||
@include mq(xg, min) {
|
||||
width: 776px;
|
||||
height: 238px;
|
||||
min-height: 238px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
width: 343px;
|
||||
}
|
||||
|
||||
@media (max-width: 375px) {
|
||||
width: 91.47%;
|
||||
}
|
||||
|
||||
h3 {
|
||||
@ -519,7 +604,6 @@
|
||||
font-size: 32px;
|
||||
line-height: 37px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
span {
|
||||
|
@ -630,9 +630,10 @@
|
||||
.srp-container {
|
||||
padding: 0 0 0 10px;
|
||||
|
||||
@include mq(md, max) {
|
||||
@media (max-width: 1024px) {
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
.srp-main-title {
|
||||
margin: 0 0 11px 0;
|
||||
font-style: normal;
|
||||
@ -1250,7 +1251,7 @@
|
||||
}
|
||||
|
||||
.accordion-group {
|
||||
@media (max-width: 767px) {
|
||||
@media (max-width: 1024px) {
|
||||
width: 96.8%;
|
||||
margin: auto;
|
||||
padding: 0 4px;
|
||||
@ -1336,9 +1337,6 @@
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@include mq(md, max) {
|
||||
padding: 0 16px;
|
||||
float: none;
|
||||
}
|
||||
|
@ -60,6 +60,10 @@ body {
|
||||
.container-cart {
|
||||
width: 96.875%;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@include mq(xm, min) {
|
||||
width: 80%;
|
||||
}
|
||||
@ -108,10 +112,9 @@ body {
|
||||
margin: 17px 0 16px;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
@media (max-width: 1024px) {
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#orderform-title {
|
||||
|
Loading…
Reference in New Issue
Block a user