-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
151 lines (151 loc) · 6.28 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Blog</title>
<link rel="shortcut icon" href="favicon.ico">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" href="assets/css/index.css" media="screen" charset="utf-8">
</head>
<body>
<div id="app">
<div class="view__header">
<a href="#/" class="header_logo">👨🏻💻</a>
<nav class="header__nav" v-show="headerVisible">
<router-link to="/">Blog</router-link>
<router-link to="project">Project</router-link>
<a href="https://github.com/niexia" target="_blank"><i class="fab fa-github"></i></a>
</nav>
</div>
<div class="view__wrapper">
<router-view class="view__content"></router-view>
<div class="view__footer">
<p class="copyright text-muted">
Copyright ©Yang Jin<br>
Powered by Vuejs |
<iframe style="margin-left: 2px; margin-bottom:-5px;" frameborder="0" scrolling="0" width="100px"
height="20px"
src="https://ghbtns.com/github-btn.html?user=niexia&repo=niexia.github.io&type=star&count=true">
</iframe>
</p>
</div>
</div>
</div>
<!-- postList template -->
<script type="text/template" id="postList">
<div class="post">
<div class="loadingBox" v-if="loading">
<i class="fas fa-spinner fa-spin fa-lg"></i>
</div>
<div class="postBox" v-else>
<div class="catalog">
<h3 class="catalog__title">Blog</h3>
<h5 class="catalog__hint">个人博客，主要是工作、生活思考总结相关，偶尔也记录一些遇到的问题，不定时更新。</h5>
</div>
<div class="post__item" v-for="post in posts">
<div class="item__header">
<p :class="['item__title', post.labels.length > 0 && 'with-tags']">
<router-link :to="{name: 'postDetail', params: {id: post.number}}">
{{ post.title }}
</router-link>
</p>
<ul class="item__tagBox">
<li
class="item__tag"
v-for="label in post.labels"
:key="label.name"
:style="{backgroundColor: '#' + label.color}">
<router-link :to="{name: 'labelPost', params: {name: label.name}}">
{{label.name}}
</router-link>
</li>
</ul>
</div>
<div class="item__preview">
<p v-if="post.body.length < 120">{{post.body.replace(/[`#->\*\[\]]/g, '')}}</p>
<p v-else>{{post.body.substr(0, 120).replace(/[`#->\*\[\]]/g, '')}}...</p>
</div>
<p class="item__time">
Posted By YangJin on {{(new Date(post.created_at)).Format('yyyy-MM-dd hh:mm:ss')}}
</p>
</div>
</div>
<div class="paginationBox" v-if="notLabel">
<span class="page_item" v-show="prePage">
<router-link :to="{ name: 'pagePost', params: { page: prePage }}">上一页</router-link>
</span>
<span class="page_item" v-show="nextPage">
<router-link :to="{ name: 'pagePost', params: { page: nextPage }}">下一页</router-link>
</span>
</div>
<div class="paginationBox" v-else>
<span class="page_item" v-show="prePage">
<router-link :to="{ name: 'labelPagePost', params: { name:label, page: prePage }}">上一页</router-link>
</span>
<span class="page_item" v-show="nextPage">
<router-link :to="{ name: 'labelPagePost', params: { name:label, page: nextPage }}">下一页</router-link>
</span>
</div>
</div>
</script>
<!-- postDetail template -->
<script type="text/template" id="postDetail">
<div class="contentPost">
<div class="loadingBox" v-if="loading">
<i class="fas fa-spinner fa-spin fa-lg"></i>
</div>
<div class="detailBox" v-else>
<div class="post__return" @click="handleReturn"><i class="far fa-arrow-alt-circle-left"></i></div>
<h2 class="post__title">
<router-link :to="{ name: 'postDetail', params: { id: post.number }}">{{ post.title }}</router-link>
</h2>
<span class="post__time">Updated at {{(new Date(post.updated_at)).Format('yyyy-MM-dd hh:mm:ss')}}</span>
<div class="post__content markdown-body" v-html="post.body"></div>
<div class="post__tagBox" v-show="post.labels && post.labels.length">
<i class="fas fa-tag"></i>
<i v-for="label in post.labels" :key="label.name">
<router-link :to="{name: 'labelPost', params: {name: label.name}}">
{{label.name}}
</router-link>
</i>
</div>
<div class="post__comment">
<i class="far fa-comment-alt"></i>
<a :href="post.html_url+'#new_comment_field'" target="_blank">添加评论</a>
</div>
</div>
</div>
</script>
<!-- project template -->
<script type="text/template" id="project">
<div class="project">
<div class="loadingBox" v-if="loading">
<i class="fas fa-spinner fa-spin fa-lg"></i>
</div>
<div class="postBox" v-else>
<div class="catalog">
<h3 class="catalog__title">Project</h3>
<h5 class="catalog__hint">正在聚焦的、有趣的项目，包括整理的笔记教程、工具开发等。</h5>
</div>
<div class="post__item" v-for="project in projects">
<div class="item__header">
<p class="item__title">
<a :href="project.html_url" target="_blank">
{{ project.name }}
</a>
</p>
</div>
<div class="item__preview">
<p>{{ project.description }}</p>
</div>
</div>
</div>
</div>
</script>
<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
<script src="https://unpkg.com/[email protected]/dist/vue-router.js"></script>
<script src="https://unpkg.com/[email protected]/dist/vue-resource.min.js" charset="utf-8"></script>
<script src="https://unpkg.com/[email protected]/lib/marked.js" charset="utf-8"></script>
<script src="index.js" charset="utf-8"></script>
</body>
</html>