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 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
- <div class="posts-page__content">
3
- <div class="posts-list">
4
- <% page.posts.each(function(post) { %>
5
- <article class="post-card material-card animate-fade-in-up">
6
- <a href="<%= url_for(post.path) %>" class="post-card__link">
7
- <div class="post-card__cover">
8
- <% if (post.cover) { %>
9
- <img data-src="<%= post.cover %>" alt="<%= post.title %>">
10
- <% } else { %>
11
- <div class="post-card__cover-placeholder"></div>
12
- <% } %>
13
- <div class="post-card__overlay"></div>
14
- <div class="post-card__info">
15
- <div class="post-card__meta">
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
- </a>
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
- <% if (theme.social && theme.social.length> 0) { %>
77
- <div class="author-card__social">
78
- <% for (var link of theme.social) { %>
79
- <a href="<%= link.url %>" target="_blank" rel="noopener" class="author-card__social-link"
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
- <div class="sidebar-widget material-card animate-fade-in-right animate-delay-2">
110
- <h3 class="sidebar-widget__title">
111
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
112
- <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>
113
- <line x1="7" y1="7" x2="7.01" y2="7"></line>
114
- </svg>
115
- 标签云
116
- </h3>
117
- <div class="sidebar-widget__content sidebar-widget__content--tags">
118
- <% site.tags.sort('name').forEach(function(tag) { %>
119
- <a href="<%= url_for(tag.path) %>" class="tag-cloud__tag">
120
- <%= tag.name %>
121
- </a>
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
- <link rel="icon" type="image/svg+xml" href="/favicon.svg">
15
- <link rel="preconnect" href="https://fonts.googleapis.com">
16
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
17
- <link
18
- href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&family=Noto+Sans+SC:wght@400;500;700&display=swap"
19
- rel="stylesheet">
20
- <link rel="stylesheet" href="<%= url_for('/css/main.css') %>">
21
- <% if (theme.lazyload && theme.lazyload.enable) { %>
22
- <link rel="stylesheet" href="<%= url_for('/css/lazyload.css') %>">
23
- <% } %>
24
- <% if (is_post()) { %>
25
- <link rel="stylesheet" href="<%= url_for('/css/markdown.css') %>">
26
- <link rel="stylesheet" href="<%= url_for('/css/highlight.css') %>">
27
- <link rel="stylesheet" href="<%= url_for('/css/admonition.css') %>">
28
- <% if (theme.twikoo && theme.twikoo.enable) { %>
29
- <link rel="stylesheet" href="<%= url_for('/css/twikoo.css') %>">
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
- <%- partial('_partial/open-graph') %>
33
- <% if (theme.canonical && theme.canonical.enable && typeof autoCanonical==='function' ) { %>
34
- <%- autoCanonical(config, page) %>
35
- <% } %>
36
- <script>
37
- (function () {
38
- var savedTheme = localStorage.getItem('theme');
39
- if (savedTheme === 'dark') {
40
- document.documentElement.setAttribute('data-theme', 'dark');
41
- } else if (savedTheme === null && window.matchMedia('(prefers-color-scheme: dark)').matches) {
42
- document.documentElement.setAttribute('data-theme', 'dark');
43
- }
44
- })();
45
- </script>
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="https://cdn.jsdelivr.net/npm/medium-zoom@1.1.0/dist/medium-zoom.min.js"></script>
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="https://cdn.jsdelivr.net/npm/pjax@0.2.8/pjax.min.js"></script>
112
+ <script defer src="<%= url_for('/js/lib/pjax.min.js') %>"></script>
97
113
  <script>
98
- var pjax = new Pjax({
99
- selectors: [
100
- 'title',
101
- 'meta[name="description"]',
102
- 'meta[property="og:title"]',
103
- 'meta[property="og:description"]',
104
- 'meta[property="og:url"]',
105
- 'meta[property="og:image"]',
106
- 'meta[property="article:published_time"]',
107
- 'meta[property="article:modified_time"]',
108
- '#pjax-container',
109
- '#header'
110
- ],
111
- cacheBust: false
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
- document.addEventListener('pjax:complete', function () {
115
- if (typeof initPage === 'function') {
116
- initPage();
117
- }
118
- if (typeof twikoo !== 'undefined' && twikoo.init) {
119
- twikoo.init({
120
- envId: '<%= theme.twikoo.envId %>',
121
- el: '#twikoo-comment'
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="https://cdn.jsdelivr.net/npm/twikoo@1.6.39/dist/twikoo.all.min.js"></script>
148
+ <script defer src="<%= url_for('/js/lib/twikoo.all.min.js') %>"></script>
129
149
  <script>
130
- twikoo.init({
131
- envId: '<%= theme.twikoo.envId %>',
132
- el: '#twikoo-comment'
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
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hexo-theme-nblog",
3
- "version": "1.1.0",
3
+ "version": "1.2.1",
4
4
  "description": "A lightweight and minimalist blog theme",
5
5
  "main": "index.js",
6
6
  "scripts": {
@@ -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
  });