[Fixed] Modify the order of @inclde to repair $xs

Modify the order from big to small resolution.
This commit is contained in:
Snowmint 2021-01-20 09:56:49 +08:00
parent fae7c3d570
commit 87743020e3

View File

@ -187,36 +187,22 @@ $fontColor: $mid-blue;
}
}
@include xs {
@include md{
#cfp-intro{
h1,
h2,
h3 {
margin-bottom: 10pt;
}
h1,
.h1 {
font-size: 36pt;
font-weight: 900;
}
h2,
.h2 {
font-size: 20pt;
font-weight: 900;
}
h3,
.h3 {
font-size: 18pt;
font-weight: 900;
margin-bottom: 12pt;
}
p {
font-size: 11pt;
line-height: 1.55;
width:75vw;
font-size: 14pt;
line-height: 1.85;
width:80vw;
}
p:not(:last-child) {
@ -226,13 +212,13 @@ $fontColor: $mid-blue;
#cfp-intro{
.box-back {
margin-bottom: -44em;
margin-left:-8em;
margin-bottom: -40em;
margin-left:-6em;
.first-box {
transform: rotate(12deg);
bottom: 550px;
left: 40px;
bottom: 650px;
left: 20px;
}
.introd-text {
top: 100px;
@ -253,22 +239,13 @@ $fontColor: $mid-blue;
#cfp-intro{
.box-back2 {
margin-top:0em;
margin-left:-3em;
margin-top: 0em;
margin-left: -1em;
.second-box {
transform: rotate(12deg) scale(0.65);
bottom: 1260px;
left:-13em;
}
}
.give-me-money {
top: 2em;
.whisper {
font-weight: 900;
font-size: 1.25em;
margin-bottom: 0.5em;
transform: rotate(12deg);
bottom: 1130px;
left:-6em;
}
}
}
@ -332,17 +309,35 @@ $fontColor: $mid-blue;
}
}
@include md{
@include xs {
#cfp-intro{
h1,
h2,
h3 {
margin-bottom: 12pt;
margin-bottom: 10pt;
}
h1,
.h1 {
font-size: 36pt;
font-weight: 900;
}
h2,
.h2 {
font-size: 20pt;
font-weight: 900;
}
h3,
.h3 {
font-size: 18pt;
font-weight: 900;
}
p {
font-size: 14pt;
line-height: 1.85;
font-size: 11pt;
line-height: 1.65;
width:80vw;
}
@ -354,12 +349,12 @@ $fontColor: $mid-blue;
#cfp-intro{
.box-back {
margin-bottom: -40em;
margin-left:-6em;
margin-left:-7em;
.first-box {
transform: rotate(12deg);
bottom: 650px;
left: 20px;
bottom: 580px;
left: 30px;
}
.introd-text {
top: 100px;
@ -380,13 +375,22 @@ $fontColor: $mid-blue;
#cfp-intro{
.box-back2 {
margin-top: 0em;
margin-top: 3em;
margin-left: -1em;
.second-box {
transform: rotate(12deg);
bottom: 1130px;
left:-6em;
transform: rotate(12deg) scale(0.65);
bottom: 1260px;
left:-14em;
}
}
.give-me-money {
top: 2em;
.whisper {
font-weight: 900;
font-size: 1.25em;
margin-bottom: 0.5em;
}
}
}