hexo-theme-nblog 1.1.0 → 1.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/_config.yml +10 -2
- package/layout/index.ejs +166 -117
- package/layout/layout.ejs +113 -89
- package/package.json +1 -1
- package/scripts/helpers.js +10 -10
- package/source/css/lazyload.css +7 -4
- package/source/css/main.css +207 -9
- package/source/css/markdown.css +1 -1
- package/source/css/tocbot.css +1 -0
- package/source/js/lazyload.js +21 -0
- package/source/js/lib/highlight.min.js +1213 -0
- package/source/js/lib/medium-zoom.min.js +2 -0
- package/source/js/lib/pjax.min.js +1 -0
- package/source/js/lib/tocbot.min.js +1 -0
- package/source/js/lib/twikoo.all.min.js +2 -0
- package/source/js/main.js +231 -13
package/_config.yml
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
#! 注意! 为了更新 npm package 后你的数据不会丢失
|
|
2
|
-
#! 请将此文件复制到根目录并重命名为 `_config.nblog.yml`
|
|
2
|
+
#! 请将此文件复制到根目录并重命名为 `_config.nblog.yml` 并在此文件的基础上进行站点配置
|
|
3
3
|
default_license: CC BY-NC-SA 4.0
|
|
4
4
|
|
|
5
|
+
primary_color: '#FF7F78'
|
|
6
|
+
|
|
5
7
|
site_name: My Blog
|
|
6
8
|
author: Your Name
|
|
7
9
|
avatar: /images/avatar.png
|
|
@@ -82,4 +84,10 @@ medium_zoom:
|
|
|
82
84
|
|
|
83
85
|
lazyload:
|
|
84
86
|
enable: true
|
|
85
|
-
placeholder: blur
|
|
87
|
+
placeholder: blur
|
|
88
|
+
|
|
89
|
+
notifications:
|
|
90
|
+
enable: true
|
|
91
|
+
interval: 10000
|
|
92
|
+
items:
|
|
93
|
+
- message: '欢迎访问我的博客!'
|
package/layout/index.ejs
CHANGED
|
@@ -1,127 +1,176 @@
|
|
|
1
1
|
<div class="posts-page container">
|
|
2
|
-
<
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
<span class="post-card__date">
|
|
17
|
-
<%= date(post.date, 'YYYY-MM-DD' ) %>
|
|
18
|
-
</span>
|
|
19
|
-
<% if (post.categories && post.categories.length> 0) { %>
|
|
20
|
-
<span class="post-card__category">
|
|
21
|
-
<%= post.categories.toArray()[0].name %>
|
|
22
|
-
</span>
|
|
23
|
-
<% } %>
|
|
24
|
-
</div>
|
|
25
|
-
<h2 class="post-card__title">
|
|
26
|
-
<%= post.title %>
|
|
27
|
-
</h2>
|
|
28
|
-
</div>
|
|
2
|
+
<h1 class="sr-only">
|
|
3
|
+
<%= config.title %>
|
|
4
|
+
</h1>
|
|
5
|
+
<% if (theme.notifications && theme.notifications.enable && theme.notifications.items &&
|
|
6
|
+
theme.notifications.items.length> 0) { %>
|
|
7
|
+
<div class="notification-banner notification-banner--mobile material-card" id="notificationBannerMobile"
|
|
8
|
+
data-interval="<%= theme.notifications.interval || 5000 %>">
|
|
9
|
+
<div class="notification-banner__inner">
|
|
10
|
+
<div class="notification-banner__content">
|
|
11
|
+
<% theme.notifications.items.forEach(function(item, index) { %>
|
|
12
|
+
<div class="notification-banner__item<%= index === 0 ? ' is-active' : '' %>">
|
|
13
|
+
<span class="notification-banner__message">
|
|
14
|
+
<%- markdown(item.message) %>
|
|
15
|
+
</span>
|
|
29
16
|
</div>
|
|
30
|
-
|
|
31
|
-
</article>
|
|
32
|
-
<% }); %>
|
|
33
|
-
|
|
34
|
-
<% if (page.total> 1) { %>
|
|
35
|
-
<nav class="pagination">
|
|
36
|
-
<%- paginator({
|
|
37
|
-
prev_text: '<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="15 18 9 12 15 6"></polyline></svg>'
|
|
38
|
-
,
|
|
39
|
-
next_text: '<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"></polyline></svg>'
|
|
40
|
-
, escape: false }) %>
|
|
41
|
-
</nav>
|
|
42
|
-
<% } %>
|
|
43
|
-
</div>
|
|
44
|
-
|
|
45
|
-
<aside class="sidebar">
|
|
46
|
-
<div class="author-card material-card animate-fade-in-right">
|
|
47
|
-
<div class="author-card__avatar">
|
|
48
|
-
<img data-src="<%= theme.avatar %>" alt="<%= theme.author %>">
|
|
49
|
-
</div>
|
|
50
|
-
<h3 class="author-card__name">
|
|
51
|
-
<%= theme.author %>
|
|
52
|
-
</h3>
|
|
53
|
-
<p class="author-card__bio">
|
|
54
|
-
<%= theme.bio %>
|
|
55
|
-
</p>
|
|
56
|
-
<div class="author-card__stats">
|
|
57
|
-
<div class="author-card__stat">
|
|
58
|
-
<span class="author-card__stat-value">
|
|
59
|
-
<%= site.posts.length %>
|
|
60
|
-
</span>
|
|
61
|
-
<span class="author-card__stat-label">文章</span>
|
|
62
|
-
</div>
|
|
63
|
-
<div class="author-card__stat">
|
|
64
|
-
<span class="author-card__stat-value">
|
|
65
|
-
<%= site.categories.length %>
|
|
66
|
-
</span>
|
|
67
|
-
<span class="author-card__stat-label">分类</span>
|
|
68
|
-
</div>
|
|
69
|
-
<div class="author-card__stat">
|
|
70
|
-
<span class="author-card__stat-value">
|
|
71
|
-
<%= site.tags.length %>
|
|
72
|
-
</span>
|
|
73
|
-
<span class="author-card__stat-label">标签</span>
|
|
74
|
-
</div>
|
|
17
|
+
<% }); %>
|
|
75
18
|
</div>
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
title="<%= link.platform %>">
|
|
81
|
-
<%- link.icon %>
|
|
82
|
-
</a>
|
|
83
|
-
<% } %>
|
|
84
|
-
</div>
|
|
85
|
-
<% } %>
|
|
86
|
-
</div>
|
|
87
|
-
|
|
88
|
-
<div class="sidebar-widget material-card animate-fade-in-right animate-delay-1">
|
|
89
|
-
<h3 class="sidebar-widget__title">
|
|
90
|
-
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
91
|
-
<path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"></path>
|
|
92
|
-
</svg>
|
|
93
|
-
分类
|
|
94
|
-
</h3>
|
|
95
|
-
<div class="sidebar-widget__content">
|
|
96
|
-
<% site.categories.sort('name').forEach(function(category) { %>
|
|
97
|
-
<a href="<%= url_for(category.path) %>" class="sidebar-widget__item">
|
|
98
|
-
<span class="sidebar-widget__item-name">
|
|
99
|
-
<%= category.name %>
|
|
100
|
-
</span>
|
|
101
|
-
<span class="sidebar-widget__item-count">
|
|
102
|
-
<%= category.length %>
|
|
103
|
-
</span>
|
|
104
|
-
</a>
|
|
19
|
+
<div class="notification-banner__indicators">
|
|
20
|
+
<% theme.notifications.items.forEach(function(item, index) { %>
|
|
21
|
+
<span class="notification-banner__indicator<%= index === 0 ? ' is-active' : '' %>"
|
|
22
|
+
data-index="<%= index %>"></span>
|
|
105
23
|
<% }); %>
|
|
106
24
|
</div>
|
|
107
25
|
</div>
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
<
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
26
|
+
</div>
|
|
27
|
+
<% } %>
|
|
28
|
+
<div class="posts-page__content">
|
|
29
|
+
<div class="posts-list">
|
|
30
|
+
<% page.posts.each(function(post) { %>
|
|
31
|
+
<article class="post-card material-card animate-fade-in-up">
|
|
32
|
+
<a href="<%= url_for(post.path) %>" class="post-card__link">
|
|
33
|
+
<div class="post-card__cover">
|
|
34
|
+
<% if (post.cover) { %>
|
|
35
|
+
<img data-src="<%= post.cover %>" alt="<%= post.title %>">
|
|
36
|
+
<% } else { %>
|
|
37
|
+
<div class="post-card__cover-placeholder"></div>
|
|
38
|
+
<% } %>
|
|
39
|
+
<div class="post-card__overlay"></div>
|
|
40
|
+
<div class="post-card__info">
|
|
41
|
+
<div class="post-card__meta">
|
|
42
|
+
<span class="post-card__date">
|
|
43
|
+
<%= date(post.date, 'YYYY-MM-DD' ) %>
|
|
44
|
+
</span>
|
|
45
|
+
<% if (post.categories && post.categories.length> 0) { %>
|
|
46
|
+
<span class="post-card__category">
|
|
47
|
+
<%= post.categories.toArray()[0].name %>
|
|
48
|
+
</span>
|
|
49
|
+
<% } %>
|
|
50
|
+
</div>
|
|
51
|
+
<h2 class="post-card__title">
|
|
52
|
+
<%= post.title %>
|
|
53
|
+
</h2>
|
|
54
|
+
</div>
|
|
55
|
+
</div>
|
|
56
|
+
</a>
|
|
57
|
+
</article>
|
|
122
58
|
<% }); %>
|
|
59
|
+
|
|
60
|
+
<% if (page.total> 1) { %>
|
|
61
|
+
<nav class="pagination">
|
|
62
|
+
<%- paginator({
|
|
63
|
+
prev_text: '<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="15 18 9 12 15 6"></polyline></svg>'
|
|
64
|
+
,
|
|
65
|
+
next_text: '<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"></polyline></svg>'
|
|
66
|
+
, escape: false }) %>
|
|
67
|
+
</nav>
|
|
68
|
+
<% } %>
|
|
123
69
|
</div>
|
|
70
|
+
|
|
71
|
+
<aside class="sidebar">
|
|
72
|
+
<% if (theme.notifications && theme.notifications.enable && theme.notifications.items &&
|
|
73
|
+
theme.notifications.items.length> 0) { %>
|
|
74
|
+
<div class="notification-banner material-card animate-fade-in-right" id="notificationBanner"
|
|
75
|
+
data-interval="<%= theme.notifications.interval || 5000 %>">
|
|
76
|
+
<div class="notification-banner__inner">
|
|
77
|
+
<div class="notification-banner__content">
|
|
78
|
+
<% theme.notifications.items.forEach(function(item, index) { %>
|
|
79
|
+
<div class="notification-banner__item<%= index === 0 ? ' is-active' : '' %>">
|
|
80
|
+
<span class="notification-banner__message">
|
|
81
|
+
<%- markdown(item.message) %>
|
|
82
|
+
</span>
|
|
83
|
+
</div>
|
|
84
|
+
<% }); %>
|
|
85
|
+
</div>
|
|
86
|
+
<div class="notification-banner__indicators">
|
|
87
|
+
<% theme.notifications.items.forEach(function(item, index) { %>
|
|
88
|
+
<span class="notification-banner__indicator<%= index === 0 ? ' is-active' : '' %>"
|
|
89
|
+
data-index="<%= index %>"></span>
|
|
90
|
+
<% }); %>
|
|
91
|
+
</div>
|
|
92
|
+
</div>
|
|
93
|
+
</div>
|
|
94
|
+
<% } %>
|
|
95
|
+
<div class="author-card material-card animate-fade-in-right">
|
|
96
|
+
<div class="author-card__avatar">
|
|
97
|
+
<img data-src="<%= theme.avatar %>" alt="<%= theme.author %>">
|
|
98
|
+
</div>
|
|
99
|
+
<h3 class="author-card__name">
|
|
100
|
+
<%= theme.author %>
|
|
101
|
+
</h3>
|
|
102
|
+
<p class="author-card__bio">
|
|
103
|
+
<%= theme.bio %>
|
|
104
|
+
</p>
|
|
105
|
+
<div class="author-card__stats">
|
|
106
|
+
<div class="author-card__stat">
|
|
107
|
+
<span class="author-card__stat-value">
|
|
108
|
+
<%= site.posts.length %>
|
|
109
|
+
</span>
|
|
110
|
+
<span class="author-card__stat-label">文章</span>
|
|
111
|
+
</div>
|
|
112
|
+
<div class="author-card__stat">
|
|
113
|
+
<span class="author-card__stat-value">
|
|
114
|
+
<%= site.categories.length %>
|
|
115
|
+
</span>
|
|
116
|
+
<span class="author-card__stat-label">分类</span>
|
|
117
|
+
</div>
|
|
118
|
+
<div class="author-card__stat">
|
|
119
|
+
<span class="author-card__stat-value">
|
|
120
|
+
<%= site.tags.length %>
|
|
121
|
+
</span>
|
|
122
|
+
<span class="author-card__stat-label">标签</span>
|
|
123
|
+
</div>
|
|
124
|
+
</div>
|
|
125
|
+
<% if (theme.social && theme.social.length> 0) { %>
|
|
126
|
+
<div class="author-card__social">
|
|
127
|
+
<% for (var link of theme.social) { %>
|
|
128
|
+
<a href="<%= link.url %>" target="_blank" rel="noopener" class="author-card__social-link"
|
|
129
|
+
title="<%= link.platform %>">
|
|
130
|
+
<%- link.icon %>
|
|
131
|
+
</a>
|
|
132
|
+
<% } %>
|
|
133
|
+
</div>
|
|
134
|
+
<% } %>
|
|
135
|
+
</div>
|
|
136
|
+
|
|
137
|
+
<div class="sidebar-widget material-card animate-fade-in-right animate-delay-1">
|
|
138
|
+
<h3 class="sidebar-widget__title">
|
|
139
|
+
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
140
|
+
<path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"></path>
|
|
141
|
+
</svg>
|
|
142
|
+
分类
|
|
143
|
+
</h3>
|
|
144
|
+
<div class="sidebar-widget__content">
|
|
145
|
+
<% site.categories.sort('name').forEach(function(category) { %>
|
|
146
|
+
<a href="<%= url_for(category.path) %>" class="sidebar-widget__item">
|
|
147
|
+
<span class="sidebar-widget__item-name">
|
|
148
|
+
<%= category.name %>
|
|
149
|
+
</span>
|
|
150
|
+
<span class="sidebar-widget__item-count">
|
|
151
|
+
<%= category.length %>
|
|
152
|
+
</span>
|
|
153
|
+
</a>
|
|
154
|
+
<% }); %>
|
|
155
|
+
</div>
|
|
156
|
+
</div>
|
|
157
|
+
|
|
158
|
+
<div class="sidebar-widget material-card animate-fade-in-right animate-delay-2">
|
|
159
|
+
<h3 class="sidebar-widget__title">
|
|
160
|
+
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
161
|
+
<path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"></path>
|
|
162
|
+
<line x1="7" y1="7" x2="7.01" y2="7"></line>
|
|
163
|
+
</svg>
|
|
164
|
+
标签云
|
|
165
|
+
</h3>
|
|
166
|
+
<div class="sidebar-widget__content sidebar-widget__content--tags">
|
|
167
|
+
<% site.tags.sort('name').forEach(function(tag) { %>
|
|
168
|
+
<a href="<%= url_for(tag.path) %>" class="tag-cloud__tag">
|
|
169
|
+
<%= tag.name %>
|
|
170
|
+
</a>
|
|
171
|
+
<% }); %>
|
|
172
|
+
</div>
|
|
173
|
+
</div>
|
|
174
|
+
</aside>
|
|
124
175
|
</div>
|
|
125
|
-
</aside>
|
|
126
|
-
</div>
|
|
127
176
|
</div>
|
package/layout/layout.ejs
CHANGED
|
@@ -11,38 +11,73 @@
|
|
|
11
11
|
<%= page.title %> | <% } %>
|
|
12
12
|
<%= config.title %>
|
|
13
13
|
</title>
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
<
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
14
|
+
<% var primaryColor=theme.primary_color || '#FF7F78' ; function hexToRgb(hex) { var
|
|
15
|
+
result=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); return result ? { r: parseInt(result[1], 16), g:
|
|
16
|
+
parseInt(result[2], 16), b: parseInt(result[3], 16) } : null; } function rgbToHsl(r, g, b) { r /=255; g /=255; b
|
|
17
|
+
/=255; var max=Math.max(r, g, b), min=Math.min(r, g, b); var h, s, l=(max + min) / 2; if (max===min) { h=s=0; } else
|
|
18
|
+
{ var d=max - min; s=l> 0.5 ? d / (2 - max - min) : d / (max + min);
|
|
19
|
+
switch (max) {
|
|
20
|
+
case r: h = ((g - b) / d + (g < b ? 6 : 0)) / 6; break; case g: h=((b - r) / d + 2) / 6; break; case b: h=((r - g) /
|
|
21
|
+
d + 4) / 6; break; } } return { h: h * 360, s: s * 100, l: l * 100 }; } function hslToRgb(h, s, l) { h /=360; s
|
|
22
|
+
/=100; l /=100; var r, g, b; if (s===0) { r=g=b=l; } else { var hue2rgb=function(p, q, t) { if (t < 0) t +=1; if
|
|
23
|
+
(t> 1) t -= 1;
|
|
24
|
+
if (t < 1/6) return p + (q - p) * 6 * t; if (t < 1/2) return q; if (t < 2/3) return p + (q - p) * (2/3 - t) * 6;
|
|
25
|
+
return p; }; var q=l < 0.5 ? l * (1 + s) : l + s - l * s; var p=2 * l - q; r=hue2rgb(p, q, h + 1/3);
|
|
26
|
+
g=hue2rgb(p, q, h); b=hue2rgb(p, q, h - 1/3); } return { r: Math.round(r * 255), g: Math.round(g * 255), b:
|
|
27
|
+
Math.round(b * 255) }; } function rgbToHex(r, g, b) { return '#' + [r, g, b].map(function(x) { var
|
|
28
|
+
hex=x.toString(16); return hex.length===1 ? '0' + hex : hex; }).join(''); } function adjustLightness(hex,
|
|
29
|
+
amount) { var rgb=hexToRgb(hex); var hsl=rgbToHsl(rgb.r, rgb.g, rgb.b); hsl.l=Math.max(0, Math.min(100, hsl.l +
|
|
30
|
+
amount)); var newRgb=hslToRgb(hsl.h, hsl.s, hsl.l); return rgbToHex(newRgb.r, newRgb.g, newRgb.b); } function
|
|
31
|
+
adjustSaturation(hex, satAmount, lightAmount) { var rgb=hexToRgb(hex); var hsl=rgbToHsl(rgb.r, rgb.g, rgb.b);
|
|
32
|
+
hsl.s=Math.max(0, Math.min(100, hsl.s + satAmount)); hsl.l=Math.max(0, Math.min(100, hsl.l + lightAmount)); var
|
|
33
|
+
newRgb=hslToRgb(hsl.h, hsl.s, hsl.l); return rgbToHex(newRgb.r, newRgb.g, newRgb.b); } var
|
|
34
|
+
rgb=hexToRgb(primaryColor); var primaryLight=adjustLightness(primaryColor, 21); var
|
|
35
|
+
primaryDark=adjustSaturation(primaryColor, -39, -12); var btnPlainBgHover='rgba(' + rgb.r + ', ' + rgb.g + ', '
|
|
36
|
+
+ rgb.b + ', 0.5)' ; var darkPrimary=adjustLightness(primaryColor, 5); var
|
|
37
|
+
darkPrimaryLight=adjustSaturation(primaryColor, -56, -36); var darkPrimaryDark=adjustLightness(primaryColor,
|
|
38
|
+
21); %>
|
|
39
|
+
<style>
|
|
40
|
+
:root {
|
|
41
|
+
--primary-color: <%=primaryColor %>;
|
|
42
|
+
--primary-light: <%=primaryLight %>;
|
|
43
|
+
--primary-dark: <%=primaryDark %>;
|
|
44
|
+
--btn-plain-bg-hover: <%=btnPlainBgHover %>;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
[data-theme="dark"] {
|
|
48
|
+
--primary-color: <%=darkPrimary %>;
|
|
49
|
+
--primary-light: <%=darkPrimaryLight %>;
|
|
50
|
+
--primary-dark: <%=darkPrimaryDark %>;
|
|
51
|
+
}
|
|
52
|
+
</style>
|
|
53
|
+
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
|
|
54
|
+
<link rel="preload" href="<%= url_for('/css/main.css') %>" as="style">
|
|
55
|
+
<link rel="stylesheet" href="<%= url_for('/css/main.css') %>">
|
|
56
|
+
<% if (theme.lazyload && theme.lazyload.enable) { %>
|
|
57
|
+
<link rel="stylesheet" href="<%= url_for('/css/lazyload.css') %>">
|
|
30
58
|
<% } %>
|
|
31
|
-
<%
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
59
|
+
<% if (is_post()) { %>
|
|
60
|
+
<link rel="stylesheet" href="<%= url_for('/css/markdown.css') %>">
|
|
61
|
+
<link rel="stylesheet" href="<%= url_for('/css/highlight.css') %>">
|
|
62
|
+
<link rel="stylesheet" href="<%= url_for('/css/admonition.css') %>">
|
|
63
|
+
<% if (theme.twikoo && theme.twikoo.enable) { %>
|
|
64
|
+
<link rel="stylesheet" href="<%= url_for('/css/twikoo.css') %>">
|
|
65
|
+
<% } %>
|
|
66
|
+
<% } %>
|
|
67
|
+
<%- partial('_partial/open-graph') %>
|
|
68
|
+
<% if (theme.canonical && theme.canonical.enable && typeof autoCanonical==='function' ) { %>
|
|
69
|
+
<%- autoCanonical(config, page) %>
|
|
70
|
+
<% } %>
|
|
71
|
+
<script>
|
|
72
|
+
(function () {
|
|
73
|
+
var savedTheme = localStorage.getItem('theme');
|
|
74
|
+
if (savedTheme === 'dark') {
|
|
75
|
+
document.documentElement.setAttribute('data-theme', 'dark');
|
|
76
|
+
} else if (savedTheme === null && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
77
|
+
document.documentElement.setAttribute('data-theme', 'dark');
|
|
78
|
+
}
|
|
79
|
+
})();
|
|
80
|
+
</script>
|
|
46
81
|
</head>
|
|
47
82
|
|
|
48
83
|
<body>
|
|
@@ -51,6 +86,14 @@
|
|
|
51
86
|
<div class="app__circle app__circle--1"></div>
|
|
52
87
|
<div class="app__circle app__circle--2"></div>
|
|
53
88
|
<div class="app__circle app__circle--3"></div>
|
|
89
|
+
<div class="app__particle app__particle--1"></div>
|
|
90
|
+
<div class="app__particle app__particle--2"></div>
|
|
91
|
+
<div class="app__particle app__particle--3"></div>
|
|
92
|
+
<div class="app__particle app__particle--4"></div>
|
|
93
|
+
<div class="app__particle app__particle--5"></div>
|
|
94
|
+
<div class="app__particle app__particle--6"></div>
|
|
95
|
+
<div class="app__particle app__particle--7"></div>
|
|
96
|
+
<div class="app__particle app__particle--8"></div>
|
|
54
97
|
</div>
|
|
55
98
|
<%- partial('_partial/header') %>
|
|
56
99
|
<main class="main" id="pjax-container">
|
|
@@ -58,78 +101,59 @@
|
|
|
58
101
|
</main>
|
|
59
102
|
<%- partial('_partial/footer') %>
|
|
60
103
|
</div>
|
|
61
|
-
<script src="<%= url_for('/js/main.js') %>"></script>
|
|
104
|
+
<script defer src="<%= url_for('/js/main.js') %>"></script>
|
|
62
105
|
<% if (theme.lazyload && theme.lazyload.enable) { %>
|
|
63
|
-
<script src="<%= url_for('/js/lazyload.js') %>"></script>
|
|
64
|
-
<script>
|
|
65
|
-
document.addEventListener('DOMContentLoaded', function () {
|
|
66
|
-
if (typeof initLazyload === 'function') {
|
|
67
|
-
initLazyload({
|
|
68
|
-
rootMargin: '100px 0px',
|
|
69
|
-
threshold: 0.01
|
|
70
|
-
});
|
|
71
|
-
}
|
|
72
|
-
});
|
|
73
|
-
document.addEventListener('pjax:complete', function () {
|
|
74
|
-
if (typeof refreshLazyload === 'function') {
|
|
75
|
-
refreshLazyload();
|
|
76
|
-
}
|
|
77
|
-
});
|
|
78
|
-
</script>
|
|
106
|
+
<script defer src="<%= url_for('/js/lazyload.js') %>"></script>
|
|
79
107
|
<% } %>
|
|
80
108
|
<% if (theme.medium_zoom && theme.medium_zoom.enable) { %>
|
|
81
|
-
<script src="
|
|
82
|
-
<script>
|
|
83
|
-
document.addEventListener('DOMContentLoaded', function () {
|
|
84
|
-
if (typeof initMediumZoom === 'function') {
|
|
85
|
-
initMediumZoom();
|
|
86
|
-
}
|
|
87
|
-
});
|
|
88
|
-
document.addEventListener('pjax:complete', function () {
|
|
89
|
-
if (typeof initMediumZoom === 'function') {
|
|
90
|
-
initMediumZoom();
|
|
91
|
-
}
|
|
92
|
-
});
|
|
93
|
-
</script>
|
|
109
|
+
<script defer src="<%= url_for('/js/lib/medium-zoom.min.js') %>"></script>
|
|
94
110
|
<% } %>
|
|
95
111
|
<% if (theme.pjax && theme.pjax.enable) { %>
|
|
96
|
-
<script src="
|
|
112
|
+
<script defer src="<%= url_for('/js/lib/pjax.min.js') %>"></script>
|
|
97
113
|
<script>
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
114
|
+
document.addEventListener('DOMContentLoaded', function () {
|
|
115
|
+
if (typeof Pjax !== 'undefined') {
|
|
116
|
+
var pjax = new Pjax({
|
|
117
|
+
selectors: [
|
|
118
|
+
'title',
|
|
119
|
+
'meta[name="description"]',
|
|
120
|
+
'meta[property="og:title"]',
|
|
121
|
+
'meta[property="og:description"]',
|
|
122
|
+
'meta[property="og:url"]',
|
|
123
|
+
'meta[property="og:image"]',
|
|
124
|
+
'meta[property="article:published_time"]',
|
|
125
|
+
'meta[property="article:modified_time"]',
|
|
126
|
+
'#pjax-container',
|
|
127
|
+
'#header'
|
|
128
|
+
],
|
|
129
|
+
cacheBust: false
|
|
130
|
+
});
|
|
113
131
|
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
132
|
+
document.addEventListener('pjax:complete', function () {
|
|
133
|
+
if (typeof initPage === 'function') {
|
|
134
|
+
initPage();
|
|
135
|
+
}
|
|
136
|
+
if (typeof twikoo !== 'undefined' && twikoo.init) {
|
|
137
|
+
twikoo.init({
|
|
138
|
+
envId: '<%= theme.twikoo.envId %>',
|
|
139
|
+
el: '#twikoo-comment'
|
|
140
|
+
});
|
|
141
|
+
}
|
|
122
142
|
});
|
|
123
143
|
}
|
|
124
144
|
});
|
|
125
145
|
</script>
|
|
126
146
|
<% } %>
|
|
127
147
|
<% if (is_post() && theme.twikoo && theme.twikoo.enable) { %>
|
|
128
|
-
<script src="
|
|
148
|
+
<script defer src="<%= url_for('/js/lib/twikoo.all.min.js') %>"></script>
|
|
129
149
|
<script>
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
150
|
+
document.addEventListener('DOMContentLoaded', function () {
|
|
151
|
+
if (typeof twikoo !== 'undefined' && twikoo.init) {
|
|
152
|
+
twikoo.init({
|
|
153
|
+
envId: '<%= theme.twikoo.envId %>',
|
|
154
|
+
el: '#twikoo-comment'
|
|
155
|
+
});
|
|
156
|
+
}
|
|
133
157
|
});
|
|
134
158
|
</script>
|
|
135
159
|
<% } %>
|
package/package.json
CHANGED
package/scripts/helpers.js
CHANGED
|
@@ -3,38 +3,38 @@
|
|
|
3
3
|
const path = require('path');
|
|
4
4
|
const themePkg = require('../package.json');
|
|
5
5
|
|
|
6
|
-
hexo.extend.helper.register('theme_version', function() {
|
|
6
|
+
hexo.extend.helper.register('theme_version', function () {
|
|
7
7
|
return 'v' + themePkg.version;
|
|
8
8
|
});
|
|
9
9
|
|
|
10
|
-
hexo.extend.filter.register('after_post_render', function(data) {
|
|
10
|
+
hexo.extend.filter.register('after_post_render', function (data) {
|
|
11
11
|
const lazyload = hexo.theme.config.lazyload;
|
|
12
|
-
|
|
12
|
+
|
|
13
13
|
if (!lazyload || !lazyload.enable) {
|
|
14
14
|
return data;
|
|
15
15
|
}
|
|
16
|
-
|
|
16
|
+
|
|
17
17
|
if (data.content) {
|
|
18
|
-
data.content = data.content.replace(/<img([^>]*)src=["']([^"']+)["']([^>]*)>/gi, function(match, before, src, after) {
|
|
18
|
+
data.content = data.content.replace(/<img([^>]*)src=["']([^"']+)["']([^>]*)>/gi, function (match, before, src, after) {
|
|
19
19
|
if (match.includes('data-src=')) {
|
|
20
20
|
return match;
|
|
21
21
|
}
|
|
22
|
-
|
|
22
|
+
|
|
23
23
|
let newAfter = after;
|
|
24
24
|
if (!newAfter.includes('class=')) {
|
|
25
25
|
newAfter = ' class=""' + newAfter;
|
|
26
26
|
}
|
|
27
|
-
|
|
27
|
+
|
|
28
28
|
const mediumZoom = hexo.theme.config.medium_zoom;
|
|
29
29
|
if (mediumZoom && mediumZoom.enable) {
|
|
30
30
|
if (!newAfter.includes('data-zoomable')) {
|
|
31
31
|
newAfter = newAfter.replace(/class=["']([^"']*)["']/, 'class="$1" data-zoomable');
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
|
-
|
|
35
|
-
return '<img' + before + 'data-src="' + src + '"' + newAfter + '>';
|
|
34
|
+
|
|
35
|
+
return '<img' + before + 'src="data:image/svg+xml,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 1 1\'%3E%3C/svg%3E" data-src="' + src + '"' + newAfter + '>';
|
|
36
36
|
});
|
|
37
37
|
}
|
|
38
|
-
|
|
38
|
+
|
|
39
39
|
return data;
|
|
40
40
|
});
|