From ffdf3df1dd1cfc818ef607d4628a2913e55ada57 Mon Sep 17 00:00:00 2001 From: hyperbola Date: Tue, 19 Jan 2021 18:54:44 +0800 Subject: [PATCH] [Fix] Coding style --- src/assets/scss/CFP/card.scss | 4 +- src/assets/scss/CFP/schedule.scss | 221 +++++++++++++++--------------- src/assets/scss/CFP/topic.scss | 4 +- src/assets/scss/footer.scss | 2 +- src/assets/scss/main.scss | 10 +- src/assets/scss/news.scss | 4 +- src/components/CFP/Agenda.vue | 2 +- 7 files changed, 127 insertions(+), 120 deletions(-) diff --git a/src/assets/scss/CFP/card.scss b/src/assets/scss/CFP/card.scss index a1c28a6..c7d37e7 100644 --- a/src/assets/scss/CFP/card.scss +++ b/src/assets/scss/CFP/card.scss @@ -1,5 +1,5 @@ -@import '@/assets/scss/breakpoint.scss'; -@import '@/assets/scss/color.scss'; +@import '../breakpoint.scss'; +@import '../color.scss'; .agenda.card:not(.container) { a.image.container { diff --git a/src/assets/scss/CFP/schedule.scss b/src/assets/scss/CFP/schedule.scss index a1b0c36..2089cef 100644 --- a/src/assets/scss/CFP/schedule.scss +++ b/src/assets/scss/CFP/schedule.scss @@ -1,126 +1,133 @@ -@import '@/assets/scss/breakpoint.scss'; -@import '@/assets/scss/color.scss'; -@import '@/assets/scss/font.scss'; +@import '../breakpoint'; +@import '../color'; +// No need to import font; the fonts have been imported in App.vue +// @import '@/assets/scss/font'; $fontFamily: Noto Sans CJK TC, monospace; #info-schedule { - max-width: 80vw; - margin: 0 auto; + max-width: 80vw; + margin: 0 auto; - font-family: $fontFamily; - font-size: 20px; - line-height: 2.1em; - letter-spacing: 0.2px; + font-family: $fontFamily; + font-size: 20px; + line-height: 2.1em; + letter-spacing: 0.2px; + color: $mid-blue; + + * { + position: relative; + } + + a { color: $mid-blue; + text-decoration: underline; + } - * { - position: relative; + h1 { + font-size: 48px; + line-height: 70px; + margin: 15px 0; + } + + h2 { + font-size: 36px; + line-height: 70px; + } + + h3 { + font-size: 24px; + line-height: 30px; + } + + h1, + h2, + h3 { + font-weight: 900; + } + + ul { + li { + &::before { + content: '•'; + margin: 2px; + line-height: 42px; + } + } + } + + section:not(:last-of-type), + article:not(:last-of-type) { + margin-bottom: 55px; + } + + #theme-example { + > p { + padding: 20px 0; + } + } + + #theme-example ~ p { + padding: 20px 0; + } + + #presentation-example, + #espresso-example { + > p { + padding-bottom: 40px; } - a { - color: $mid-blue; - text-decoration: underline; - } - - h1 { - font-size: 48px; - line-height: 70px; - margin: 15px 0; - } - - h2 { - font-size: 36px; - line-height: 70px; - } - - h3 { - font-size: 24px; - line-height: 30px; - } - - h1, h2, h3 { - font-weight: 900; - } - - ul { - li { - &::before { - content: "•"; - margin: 2px; - line-height: 42px; - } - } - } - - section:not(:last-of-type), article:not(:last-of-type) { - margin-bottom: 55px; - } - - #theme-example { - > p { - padding: 20px 0; - } - } - - #theme-example ~ p { - padding: 20px 0; - } - - #presentation-example, #espresso-example { - > p { - padding-bottom: 40px; - } - - .agenda.card.container { - display: grid; - grid-template-columns: repeat(4, 1fr); - column-gap: 62px; - row-gap: 40px; - } + .agenda.card.container { + display: grid; + grid-template-columns: repeat(4, 1fr); + column-gap: 62px; + row-gap: 40px; } + } } #code-of-conduct a { - font-weight: 900; + font-weight: 900; } - @include md { - #info-schedule { - margin: 0 auto; - font-size: 14px; + #info-schedule { + margin: 0 auto; + font-size: 14px; - h1, h2 { - font-size: 26px; - line-height: 2.69em; - } - - h3 { - font-size: 20px; - line-height: 30px; - } - - h1, h2, h3 { - margin: 0; - } - - #schedule { - margin-bottom: unset; - } - - #theme-example ~ p { - padding: 15px 0; - } - - #presentation-example, #espresso-example { - margin-bottom: unset; - .agenda.card.container { - grid-template-columns: repeat(2, 1fr); - column-gap: 42px; - row-gap: 30px; - } - } + h1, + h2 { + font-size: 26px; + line-height: 2.69em; } -} \ No newline at end of file + h3 { + font-size: 20px; + line-height: 30px; + } + + h1, + h2, + h3 { + margin: 0; + } + + #schedule { + margin-bottom: unset; + } + + #theme-example ~ p { + padding: 15px 0; + } + + #presentation-example, + #espresso-example { + margin-bottom: unset; + .agenda.card.container { + grid-template-columns: repeat(2, 1fr); + column-gap: 42px; + row-gap: 30px; + } + } + } +} diff --git a/src/assets/scss/CFP/topic.scss b/src/assets/scss/CFP/topic.scss index 629e8cb..ae36d91 100644 --- a/src/assets/scss/CFP/topic.scss +++ b/src/assets/scss/CFP/topic.scss @@ -1,5 +1,5 @@ -@import '@/assets/scss/breakpoint.scss'; -@import '@/assets/scss/color.scss'; +@import '../breakpoint.scss'; +@import '../color.scss'; .topic { padding: 30px 0; diff --git a/src/assets/scss/footer.scss b/src/assets/scss/footer.scss index d32a2fc..805fbd3 100644 --- a/src/assets/scss/footer.scss +++ b/src/assets/scss/footer.scss @@ -1,4 +1,4 @@ -@import './breakpoint.scss'; +@import 'breakpoint.scss'; // varible declare $fontColor: white; diff --git a/src/assets/scss/main.scss b/src/assets/scss/main.scss index 3e47969..e8fe555 100644 --- a/src/assets/scss/main.scss +++ b/src/assets/scss/main.scss @@ -1,9 +1,9 @@ // global -@import './reset.scss'; -@import './variable.scss'; -@import './color.scss'; -@import './util.scss'; -@import './font.scss'; +@import 'reset.scss'; +@import 'variable.scss'; +@import 'color.scss'; +@import 'util.scss'; +@import 'font.scss'; // components // @import './footer.scss'; diff --git a/src/assets/scss/news.scss b/src/assets/scss/news.scss index aa7ffbb..cca02b7 100644 --- a/src/assets/scss/news.scss +++ b/src/assets/scss/news.scss @@ -1,5 +1,5 @@ -@import './hyperpoint.scss'; -@import './color.scss'; +@import 'hyperpoint.scss'; +@import 'color.scss'; // desktop mode #news-header { diff --git a/src/components/CFP/Agenda.vue b/src/components/CFP/Agenda.vue index 56af629..207a02d 100644 --- a/src/components/CFP/Agenda.vue +++ b/src/components/CFP/Agenda.vue @@ -249,5 +249,5 @@ export default class Agenda extends Vue {