hexo-theme-nblog 1.2.0 → 1.2.1

package/layout/layout.ejs

@@ -51,11 +51,7 @@
           }
         </style>
         <link rel="icon" type="image/svg+xml" href="/favicon.svg">
-        <link rel="preconnect" href="https://fonts.googleapis.com">
-        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-        <link
-          href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&family=Noto+Sans+SC:wght@400;500;700&display=swap"
-          rel="stylesheet">
+        <link rel="preload" href="<%= url_for('/css/main.css') %>" as="style">
         <link rel="stylesheet" href="<%= url_for('/css/main.css') %>">
         <% if (theme.lazyload && theme.lazyload.enable) { %>
           <link rel="stylesheet" href="<%= url_for('/css/lazyload.css') %>">
@@ -105,78 +101,59 @@
       </main>
       <%- partial('_partial/footer') %>
   </div>
-  <script src="<%= url_for('/js/main.js') %>"></script>
+  <script defer src="<%= url_for('/js/main.js') %>"></script>
   <% if (theme.lazyload && theme.lazyload.enable) { %>
-    <script src="<%= url_for('/js/lazyload.js') %>"></script>
-    <script>
-      document.addEventListener('DOMContentLoaded', function () {
-        if (typeof initLazyload === 'function') {
-          initLazyload({
-            rootMargin: '100px 0px',
-            threshold: 0.01
-          });
-        }
-      });
-      document.addEventListener('pjax:complete', function () {
-        if (typeof refreshLazyload === 'function') {
-          refreshLazyload();
-        }
-      });
-    </script>
+    <script defer src="<%= url_for('/js/lazyload.js') %>"></script>
     <% } %>
       <% if (theme.medium_zoom && theme.medium_zoom.enable) { %>
-        <script src="https://cdn.jsdelivr.net/npm/medium-zoom@1.1.0/dist/medium-zoom.min.js"></script>
-        <script>
-          document.addEventListener('DOMContentLoaded', function () {
-            if (typeof initMediumZoom === 'function') {
-              initMediumZoom();
-            }
-          });
-          document.addEventListener('pjax:complete', function () {
-            if (typeof initMediumZoom === 'function') {
-              initMediumZoom();
-            }
-          });
-        </script>
+        <script defer src="<%= url_for('/js/lib/medium-zoom.min.js') %>"></script>
         <% } %>
           <% if (theme.pjax && theme.pjax.enable) { %>
-            <script src="https://cdn.jsdelivr.net/npm/pjax@0.2.8/pjax.min.js"></script>
+            <script defer src="<%= url_for('/js/lib/pjax.min.js') %>"></script>
             <script>
-              var pjax = new Pjax({
-                selectors: [
-                  'title',
-                  'meta[name="description"]',
-                  'meta[property="og:title"]',
-                  'meta[property="og:description"]',
-                  'meta[property="og:url"]',
-                  'meta[property="og:image"]',
-                  'meta[property="article:published_time"]',
-                  'meta[property="article:modified_time"]',
-                  '#pjax-container',
-                  '#header'
-                ],
-                cacheBust: false
-              });
+              document.addEventListener('DOMContentLoaded', function () {
+                if (typeof Pjax !== 'undefined') {
+                  var pjax = new Pjax({
+                    selectors: [
+                      'title',
+                      'meta[name="description"]',
+                      'meta[property="og:title"]',
+                      'meta[property="og:description"]',
+                      'meta[property="og:url"]',
+                      'meta[property="og:image"]',
+                      'meta[property="article:published_time"]',
+                      'meta[property="article:modified_time"]',
+                      '#pjax-container',
+                      '#header'
+                    ],
+                    cacheBust: false
+                  });
 
-              document.addEventListener('pjax:complete', function () {
-                if (typeof initPage === 'function') {
-                  initPage();
-                }
-                if (typeof twikoo !== 'undefined' && twikoo.init) {
-                  twikoo.init({
-                    envId: '<%= theme.twikoo.envId %>',
-                    el: '#twikoo-comment'
+                  document.addEventListener('pjax:complete', function () {
+                    if (typeof initPage === 'function') {
+                      initPage();
+                    }
+                    if (typeof twikoo !== 'undefined' && twikoo.init) {
+                      twikoo.init({
+                        envId: '<%= theme.twikoo.envId %>',
+                        el: '#twikoo-comment'
+                      });
+                    }
                   });
                 }
               });
             </script>
             <% } %>
               <% if (is_post() && theme.twikoo && theme.twikoo.enable) { %>
-                <script src="https://cdn.jsdelivr.net/npm/twikoo@1.6.39/dist/twikoo.all.min.js"></script>
+                <script defer src="<%= url_for('/js/lib/twikoo.all.min.js') %>"></script>
                 <script>
-                  twikoo.init({
-                    envId: '<%= theme.twikoo.envId %>',
-                    el: '#twikoo-comment'
+                  document.addEventListener('DOMContentLoaded', function () {
+                    if (typeof twikoo !== 'undefined' && twikoo.init) {
+                      twikoo.init({
+                        envId: '<%= theme.twikoo.envId %>',
+                        el: '#twikoo-comment'
+                      });
+                    }
                   });
                 </script>
                 <% } %>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-nblog",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "A lightweight and minimalist blog theme",
   "main": "index.js",
   "scripts": {

package/scripts/helpers.js

@@ -32,7 +32,7 @@ hexo.extend.filter.register('after_post_render', function (data) {
         }
       }
 
-      return '<img' + before + 'data-src="' + src + '"' + newAfter + '>';
+      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 + '>';
     });
   }
 

package/source/css/lazyload.css

@@ -10,15 +10,18 @@
 }
 
 img[data-src] {
-  opacity: 0 !important;
-  visibility: hidden !important;
+  opacity: 0;
   min-height: 1px;
   min-width: 1px;
 }
 
 img[data-src].lazyload-image {
-  visibility: visible !important;
   opacity: 0;
+  transition: opacity 0.3s ease;
+}
+
+img[data-src].lazyload-loaded {
+  opacity: 1;
 }
 
 .lazyload-skeleton {

package/source/css/main.css

@@ -22,7 +22,7 @@
   --transition-fast: 0.15s ease;
   --transition-normal: 0.3s ease;
   --transition-slow: 0.5s ease;
-  --font-family: 'Roboto', 'Noto Sans SC', sans-serif;
+  --font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'PingFang SC', 'Microsoft YaHei', sans-serif;
   --font-mono: 'Fira Code', 'Consolas', monospace;
   --header-height: 64px;
   --sidebar-width: 280px;

package/source/css/tocbot.css

@@ -0,0 +1 @@
+.toc{overflow-y:auto}.toc>.toc-list{overflow:hidden;position:relative}.toc>.toc-list li{list-style:none}.toc-list{margin:0;padding-left:10px}a.toc-link{color:currentColor;height:100%}.is-collapsible{max-height:1000px;overflow:hidden;transition:all 300ms ease-in-out}.is-collapsed{max-height:0}.is-position-fixed{position:fixed !important;top:0}.is-active-link{font-weight:700}.toc-link::before{background-color:#eee;content:" ";display:inline-block;height:inherit;left:0;margin-top:-1px;position:absolute;width:2px}.is-active-link::before{background-color:#54bc4b}/*# sourceMappingURL=tocbot.css.map */

package/source/js/lazyload.js

@@ -107,6 +107,7 @@
             img.src = src;
 
             img.classList.add('lazyload-loaded');
+            img.classList.remove('lazyload-image');
             if (wrapper) {
                 wrapper.classList.add('lazyload-wrapper--loaded');
             }
@@ -122,6 +123,8 @@
 
         tempImg.onerror = function () {
             img.classList.add('lazyload-error');
+            img.classList.remove('lazyload-image');
+            img.style.opacity = '1';
             if (wrapper) {
                 wrapper.classList.add('lazyload-wrapper--error');
                 self.showErrorPlaceholder(wrapper, src);
@@ -179,4 +182,22 @@
     window.initLazyload = initLazyload;
     window.refreshLazyload = refreshLazyload;
     window.destroyLazyload = destroyLazyload;
+
+    function autoInit() {
+        if (document.readyState === 'loading') {
+            document.addEventListener('DOMContentLoaded', function () {
+                initLazyload({
+                    rootMargin: '100px 0px',
+                    threshold: 0.01
+                });
+            });
+        } else {
+            initLazyload({
+                rootMargin: '100px 0px',
+                threshold: 0.01
+            });
+        }
+    }
+
+    autoInit();
 })();