t510599/2021
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[Style] Small fix for intro

Browse Source
This commit is contained in:
hyperbola 2021-01-20 08:53:20 +08:00
parent e19d896930
commit a4b18631ce
No known key found for this signature in database
GPG Key ID: D987B1D59478B51F
1 changed files with 24 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
src/assets/scss/CFP/intro.scss
View File

@ -1,11 +1,11 @@
@import '../color';
$fontFamily: Noto Sans TC; $fontFamily: Noto Sans TC;
$fontColor: #226BB4; $fontColor: $mid-blue;
// General settings: // General settings:
// font-size and paragraph spacing for headers and paragraph text // font-size and paragraph spacing for headers and paragraph text
#cfp-intro { #cfp-intro {
margin-top: 90px; margin-top: 90px;
padding: 96px 0 0 0;
h1, h1,
h2, h2,
@ -15,9 +15,6 @@ $fontColor: #226BB4;
p { p {
line-height: 1.75; line-height: 1.75;
}
p:not(:last-child) {
margin-bottom: 2em; margin-bottom: 2em;
} }
@ -39,11 +36,12 @@ $fontColor: #226BB4;
font-weight: 900; font-weight: 900;
} }
} }
.introduction{ .introduction {
height: 2250px; height: 2400px;
overflow: hidden; overflow: hidden;
padding-bottom: 0; padding-bottom: 0;
} }
// Utiliy // Utiliy
#cfp-intro { #cfp-intro {
.mr-2 { .mr-2 {
@ -58,8 +56,8 @@ $fontColor: #226BB4;
} }
#cfp-intro { #cfp-intro {
.box-back { .box-back {
// margin-top: -120px;
// width: 880px; // width: 880px;
margin-bottom: -40em; margin-bottom: -40em;
font-family: $fontFamily; font-family: $fontFamily;
@ -70,7 +68,7 @@ $fontColor: #226BB4;
.first-box { .first-box {
transform: rotate(15deg); transform: rotate(15deg);
box-shadow: 0 3px 12px 0 rgba(89,120,206,.56); box-shadow: 0 3px 12px 0 rgba(89, 120, 206, 0.56);
border-radius: 30px; border-radius: 30px;
position: relative; position: relative;
bottom: 550px; bottom: 550px;
@ -123,9 +121,9 @@ $fontColor: #226BB4;
.box-bluearea { .box-bluearea {
width: 150vw; width: 150vw;
height: 450px; height: 450px;
background: rgba(34, 107, 180,1); background: rgba(34, 107, 180, 1);
right: 25%; right: 25%;
position:relative; position: relative;
z-index: -1; z-index: -1;
transform: rotate(15deg); transform: rotate(15deg);
opacity: 1; opacity: 1;
@ -137,31 +135,31 @@ $fontColor: #226BB4;
color: $fontColor; color: $fontColor;
width: 900px; width: 900px;
padding: 20px; padding: 20px 20px 168px 20px;
height: 2200px; height: 2350px;
.about-topic { .about-topic {
margin-bottom: 2em; margin-bottom: 2em;
position:relative; position: relative;
bottom: 75px; bottom: 75px;
z-index: 2; z-index: 2;
left: 50px; left: 50px;
} }
.second-box { .second-box {
transform: rotate(15deg); transform: rotate(15deg);
box-shadow: 0 3px 12px 0 rgba(89,120,206,.56); box-shadow: 0 3px 12px 0 rgba(89, 120, 206, 0.56);
border-radius: 30px; border-radius: 30px;
position: relative; position: relative;
bottom: 1100px; bottom: 1100px;
right: 120px; right: 120px;
z-index: 0; z-index: 0;
} }
.cfp-deadline { .cfp-deadline {
margin-bottom: 2em; margin-bottom: 2em;
margin-bottom: 2em; margin-bottom: 2em;
position:relative; position: relative;
z-index: 2; z-index: 2;
left: 50px; left: 50px;
bottom: 75px; bottom: 75px;
@ -174,7 +172,7 @@ $fontColor: #226BB4;
} }
.give-me-money { .give-me-money {
position:relative; position: relative;
z-index: 2; z-index: 2;
left: 50px; left: 50px;
bottom: 75px; bottom: 75px;
@ -182,7 +180,6 @@ $fontColor: #226BB4;
font-weight: 900; font-weight: 900;
font-size: 1.25em; font-size: 1.25em;
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }
} }
} }