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

[Update] update page when call for page is overdue

Browse Source
This commit is contained in:
mysper 2021-02-22 18:47:05 +08:00
parent 72bd1db4e6
commit 2e90998388
2 changed files with 15 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/assets/scss/news/header.scss
View File

@ -108,7 +108,6 @@ $fontFamily: Noto Sans TC, monospace;
border-radius: 24px; border-radius: 24px;
color: $white; color: $white;
background: $mid-blue;
font-size: 14pt; font-size: 14pt;
font-weight: bold; font-weight: bold;
@ -149,6 +148,12 @@ $fontFamily: Noto Sans TC, monospace;
} }
} }
} }
.cfp-body-gray {
background: #5F7A95;
}
.cfp-body-blue {
background: $mid-blue;
}
@include lg { @include lg {
#news-header { #news-header {
@ -240,7 +245,7 @@ $fontFamily: Noto Sans TC, monospace;
border-radius: 24px; border-radius: 24px;
color: $white; color: $white;
background: $mid-blue; //background: $mid-blue;
font-weight: bold; font-weight: bold;
font-size: 1em; font-size: 1em;

13
src/components/news/Header.vue
View File

@ -13,16 +13,18 @@
<a class="btn-contribute" target="_blank" rel="noopener" href="https://forms.gle/XoXJSD2P8dL8X8s2A">我要投稿</a> <a class="btn-contribute" target="_blank" rel="noopener" href="https://forms.gle/XoXJSD2P8dL8X8s2A">我要投稿</a>
</div> </div>
</div> </div>
<div class="cfp-body"> <div class="cfp-body" :class="(cfp)? 'cfp-body-blue':'cfp-body-gray'">
<div class="spot-wrapper"> <div class="spot-wrapper" >
<h1 class="text-center">現正徵稿中<span class="ignore">！</span></h1> <h1 class="text-center" v-if="cfp">現正徵稿中<span class="ignore">！</span></h1>
<h1 class="text-center" v-else>徵稿已截止 :<span class="ignore">(</span></h1>
<!-- TODO counter --> <!-- TODO counter -->
<p class="text-center countdown"> <p class="text-center countdown">
距離投稿截止還有 距離投稿截止還有
<span class="d-inline-block"> <span class="d-inline-block" v-if="cfp">
{{ countdown.d }} 天 {{ countdown.h }} 小時 {{ countdown.m }} 分 {{ countdown.d }} 天 {{ countdown.h }} 小時 {{ countdown.m }} 分
{{ countdown.s }} 秒</span {{ countdown.s }} 秒</span
> >
<span v-else class="d-inline-block">...喔不! 你沒有時間了</span>
</p> </p>
</div> </div>
<div class="time-wrapper"> <div class="time-wrapper">
@ -72,7 +74,7 @@ export default class CfpHeader extends Vue {
h: 0, h: 0,
d: 0 d: 0
}; };
private cfp: boolean = true;
public beforeMount () { public beforeMount () {
this.registerTimer(); this.registerTimer();
} }
@ -96,6 +98,7 @@ export default class CfpHeader extends Vue {
} }
private async onTick (t: number) { private async onTick (t: number) {
if (t<0) this.cfp = false;
this.countdown.s = t % 60; this.countdown.s = t % 60;
t = Math.floor(t / 60); t = Math.floor(t / 60);
this.countdown.m = t % 60; this.countdown.m = t % 60;