github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

update site

pull/1062/head
tanjinzhou 2019-08-05 16:53:48 +08:00
parent 949cb6bdcc
commit d60d549f04
1 changed files with 39 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
site/components/geektime_ads.vue
View File

@ -1,57 +1,67 @@
<template> <template>
<div <div
v-show="visible" v-if="isEffective(effectiveTime)"
id="geektime-ads" id="geektime-ads"
:class="isMobile ? 'geektime-ads-mobile':''" :class="isMobile ? 'geektime-ads-mobile':''"
> >
<a <a
href="https://time.geekbang.org/course/intro/163?code=KHKYcoBU6vZa8nMglg7AWfDxxi3BWrz9INAzAY3umPk%3D" href="https://time.geekbang.org/column/intro/216?utm_term=zeusH8E0I&utm_source=website&utm_medium=tangjinzhou"
target="_blank" target="_blank"
> >
<img <img
height="100" height="100"
alt="Vue 实战教程" alt="浏览器工作原理与实践"
src="https://cdn.nlark.com/yuque/0/2019/jpeg/87084/1562230861353-assets/web-upload/2fab2df7-5cc9-4791-b344-a97da29eb400.jpeg" src="https://cdn.nlark.com/yuque/0/2019/jpeg/87084/1564994550991-assets/web-upload/fd11d2ba-7351-47d5-bf87-aa9eb2a10256.jpeg"
> />
</a> </a>
</div> </div>
</template> </template>
<script> <script>
import moment from 'moment';
export default { export default {
props: ['isMobile'], props: ['isMobile'],
data() { data() {
return { return {
visible: true, visible: true,
effectiveTime: {
start: '2019-08-05 17:00:00',
end: '2019-09-05 17:00:00',
},
}; };
}, },
methods: {
isEffective({ start, end }) {
return moment().isBetween(start, end);
},
},
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
#geektime-ads { #geektime-ads {
max-width: 280px; max-width: 280px;
height: 100px; height: 100px;
float: right; float: right;
position: relative; position: relative;
right: 0; right: 0;
bottom: 0; bottom: 0;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
z-index: 9; z-index: 9;
background-color: #fff; background-color: #fff;
border-radius: 3px; border-radius: 3px;
font-size: 13px; font-size: 13px;
background: #f5f5f5; background: #f5f5f5;
font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif; font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
} }
#geektime-ads.geektime-ads-mobile { #geektime-ads.geektime-ads-mobile {
width: 100%; width: 100%;
position: relative; position: relative;
right: 0; right: 0;
bottom: 0; bottom: 0;
padding: 0; padding: 0;
margin-bottom: 15px; margin-bottom: 15px;
} }
</style> </style>