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

Fix first paragraph in intro

Browse Source
This commit is contained in:
hyperbola
2021-01-19 21:14:32 +08:00
parent 70bf0dbecc
commit 6bbb985344
4 changed files with 310 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -10,11 +10,12 @@ $buttonHoverColor: #ffffff;
@mixin hyperlinkFont() {
text-decoration: underline;
}
// font size
$h1FontSize: 30px;
$h2FontSize: 24px;
$h3FontSize: 16px;
$contextFontSize: 13px;
$h1FontSize: 42pt;
$h2FontSize: 27pt;
$h3FontSize: 20pt;
// $contextFontSize: 13px;
$buttonFontSize: 24px;
$mh1FontSize: 26px;
@@ -36,6 +37,16 @@ $hyperlinkLetterSpace: 0;
$buttonHoverBg: #226bb4;
#cfp {
h1,
h2,
h3 {
margin-bottom: 2em;
}
p {
line-height: 2;
}
.introduction-container {
overflow-x: hidden;
overflow-y: hidden;
@@ -62,24 +73,24 @@ $buttonHoverBg: #226bb4;
.about-section {
// font
font-size: $contextFontSize;
// font-size: $contextFontSize;
letter-spacing: $contextLetterSpace;
line-height: 42px;
//line-height: 42px;
width: 90%;
@media screen and(max-width: 414px) {
font-size: $mcontextFontSize;
// font-size: $mcontextFontSize;
width: 160%;
}
}
.discuss-section {
font-size: $contextFontSize;
// font-size: $contextFontSize;
letter-spacing: $contextLetterSpace;
line-height: 42px;
// line-height: 42px;
@media screen and(max-width: 414px) {
font-size: $mcontextFontSize;
// font-size: $mcontextFontSize;
width: 80%;
}
}
@@ -88,9 +99,9 @@ $buttonHoverBg: #226bb4;
// size
margin-top: 130px;
// font
font-size: $contextFontSize;
// font-size: $contextFontSize;
letter-spacing: $contextLetterSpace;
line-height: 42px;
// line-height: 42px;
width: 1100px;
@@ -105,9 +116,9 @@ $buttonHoverBg: #226bb4;
margin-top: 70px;
height: 325px;
// font
font-size: $contextFontSize;
// font-size: $contextFontSize;
letter-spacing: $contextLetterSpace;
line-height: 42px;
// line-height: 42px;
@media screen and(max-width: 414px) {
margin-top: 30%;
@@ -122,7 +133,7 @@ $buttonHoverBg: #226bb4;
font-size: $buttonFontSize;
font-weight: 900;
letter-spacing: $buttonLetterSpace;
line-height: 30px;
// line-height: 30px;
// size
margin-right: 37px;
padding: 12px 15px 12px 15px;
@@ -184,12 +195,12 @@ $buttonHoverBg: #226bb4;
margin-right: 35px;
// align
vertical-align: bottom;
line-height: 30px;
// line-height: 16pt;
@media screen and(max-width:414px) {
font-size: 30px;
font-size: 16pt;
margin-right: 10px;
line-height: 50px;
//line-height: 1.5;
vertical-align: middle;
}
}
@@ -208,14 +219,14 @@ $buttonHoverBg: #226bb4;
h1 {
// font
font-size: $h1FontSize;
line-height: 70px;
//@function: 70px;
font-weight: 900;
letter-spacing: $titleLetterSpace;
.enlarge {
font-size: $enlargeFontSize;
@media screen and (max-width: 414px) {
line-height: 80px;
// line-height: 80px;
}
}
@@ -224,7 +235,7 @@ $buttonHoverBg: #226bb4;
}
@media screen and (max-width: 414px) {
line-height: 20px;
// line-height: 20px;
}
}
@@ -239,20 +250,20 @@ $buttonHoverBg: #226bb4;
h2 {
// font
font-size: $h2FontSize;
// font-size: $h2FontSize;
letter-spacing: $titleLetterSpace;
font-weight: 900;
line-height: 70px;
margin: 0px;
//line-height: 70px;
// margin: 0px;
}
h3 {
// Font
font-size: $h3FontSize;
// font-size: $h3FontSize;
letter-spacing: $titleLetterSpace;
font-weight: 900;
line-height: 15px;
margin: 0px;
//line-height: 15px;
// margin: 0px;
}
.about-section > .context {
@@ -263,20 +274,22 @@ $buttonHoverBg: #226bb4;
margin-right: 30%;
}
/*
.context {
// font
font-size: $contextFontSize;
// font-size: $contextFontSize;
line-height: 30px;
letter-spacing: $contextLetterSpace;
font-weight: normal;
}
*/
.detail {
// display
display: inline;
// font
font-size: $contextFontSize;
line-height: 20px;
// font-size: $contextFontSize;
// line-height: 20px;
letter-spacing: $contextLetterSpace;
font-weight: normal;
// align
@@ -285,17 +298,17 @@ $buttonHoverBg: #226bb4;
@media screen and (max-width: 414px) {
margin-right: 25%;
line-height: 35px;
font-size: $mcontextFontSize;
//line-height: 35px;
// font-size: $mcontextFontSize;
}
}
.context-span {
// font
font-size: $contextFontSize;
// font-size: $contextFontSize;
font-weight: 900;
letter-spacing: $contextLetterSpace;
line-height: 42px;
//line-height: 42px;
}
.context-hyperlink {
@@ -304,13 +317,13 @@ $buttonHoverBg: #226bb4;
letter-spacing: $hyperlinkLetterSpace;
color: $light-blue;
font-weight: normal;
line-height: 42px;
//line-height: 42px;
}
p.tag {
// font
font-size: 14px;
line-height: 15px;
// line-height: 15px;
letter-spacing: 0;
font-weight: 900;
// align
@@ -325,7 +338,7 @@ $buttonHoverBg: #226bb4;
p.tag.sub {
font-size: 12px;
line-height: 10px;
// line-height: 10px;
@media screen and (max-width: 414px) {
font-size: 12px;
@@ -340,7 +353,7 @@ $buttonHoverBg: #226bb4;
text-align: center;
@media screen and (max-width: 414px) {
line-height: 12px;
// line-height: 12px;
font-size: 10px;
}
}
@@ -366,7 +379,7 @@ $buttonHoverBg: #226bb4;
.thumbnails {
// box
margin-left: -20.5px;
// margin-left: -20.5px;
@media screen and (max-width: 414px) {
margin-left: -9px;
@@ -689,3 +702,79 @@ $buttonHoverBg: #226bb4;
}
}
}
// General settings: font-size and paragraph spacing
#cfp-intro {
h1,
h2,
h3 {
margin-bottom: 1em;
}
p:not(:last-child) {
margin-bottom: 1em;
line-height: 1.75;
}
h1 {
font-size: 42pt;
}
h2 {
font-size: 26pt;
}
h3 {
font-size: 22pt;
}
}
#cfp-intro {
.box-back {
margin-top: -70px;
width: 600px;
.about-sitcon {
margin-bottom: 1em;
}
.past-sitcon {
margin-bottom: 1em;
.thumbnails {
display: flex;
flex-direction: row;
padding: 0.25em 0;
.thumb-wrapper {
.thumb-title,
.thumb-subtitle {
margin: 0;
font-size: 0.8em;
line-height: 1.75em;
font-weight: 900;
}
.small {
font-size: 0.6em;
}
&:not(:last-child) {
margin-right: 1em;
}
}
}
}
.join-discuss {
.link-group {
margin-top: 1em;
.btn {
&:not(:first-child) {
margin-left: 2em;
}
}
}
}
}
}

7
src/assets/scss/main.scss
View File

@@ -23,13 +23,14 @@
body {
width: 100vw;
height: 100vh;
position: relative;
overflow-x: hidden;
display: flex;
flex-direction: column;
height: 100vh;
font-size: 14pt;
margin:0;
font-size: 13pt;
}
#app {

27
src/assets/scss/util.scss
View File

@@ -1,3 +1,5 @@
@import 'color';
.text-center {
text-align: center;
.ignore {
@@ -33,3 +35,28 @@
.d-inline-block {
display: inline-block;
}
.btn {
display: inline-block;
padding: 0.85em 1.25em;
font-size: 1.1em;
font-weight: 900;
border: none;
border-radius: 8px;
&.btn-primary {
background-color: #ffffff;
box-shadow: 0 3px 12px 0 rgba(89, 120, 206, 0.56);
transition-duration: 0.2s;
color: $mid-blue;
&:hover {
// box
background-color: $mid-blue;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 0, 0, 0.19);
// font
color: $white;
}
}
}