hexo-theme-fluid 1.8.13 → 1.9.1

package/layout/_partials/plugins/math.ejs

@@ -0,0 +1,46 @@
+<% if(theme.post.math.engine === 'mathjax') { %>
+  <%
+    var lazy = theme.lazyload.enable && require_version(theme.static_prefix.mathjax, '3.2.0')
+
+    import_script(`
+      <script>
+        MathJax = {
+          tex    : {
+            inlineMath: { '[+]': [['$', '$']] }
+          },
+          loader : {
+            ${ lazy ? 'load: \[\'ui/lazy\'\]' : '' }
+          },
+          options: {
+            renderActions: {
+              findScript    : [10, doc => {
+                document.querySelectorAll('script[type^="math/tex"]').forEach(node => {
+                  const display = !!node.type.match(/; *mode=display/);
+                  const math = new doc.options.MathItem(node.textContent, doc.inputJax[0], display);
+                  const text = document.createTextNode('');
+                  node.parentNode.replaceChild(text, node);
+                  math.start = { node: text, delim: '', n: 0 };
+                  math.end = { node: text, delim: '', n: 0 };
+                  doc.math.push(math);
+                });
+              }, '', false],
+              insertedScript: [200, () => {
+                document.querySelectorAll('mjx-container').forEach(node => {
+                  let target = node.parentNode;
+                  if (target.nodeName.toLowerCase() === 'li') {
+                    target.parentNode.classList.add('has-jax');
+                  }
+                });
+              }, '', false]
+            }
+          }
+        };
+      </script>
+    `)
+
+    import_js(theme.static_prefix.mathjax.replace('es5/', ''), 'es5/tex-mml-chtml.js')
+  %>
+
+<% } else if (theme.post.math.engine === 'katex') { %>
+  <% import_css(theme.static_prefix.katex, 'katex.min.css') %>
+<% } %>

package/layout/_partials/plugins/mermaid.ejs

@@ -0,0 +1,5 @@
+<script>
+  Fluid.utils.createScript('<%= url_join(theme.static_prefix.mermaid, 'mermaid.min.js') %>', function() {
+    mermaid.initialize(<%- JSON.stringify(theme.post.mermaid.options || {}) %>);
+  });
+</script>

package/layout/_partials/plugins/typed.ejs

@@ -0,0 +1,48 @@
+<% if(theme.fun_features.typing.enable && in_scope(theme.fun_features.typing.scope) && page.subtitle !== false) { %>
+  <%- js_ex(theme.static_prefix.typed, '/typed.min.js') %>
+  <script>
+    (function (window, document) {
+      var typing = Fluid.plugins.typing;
+      var subtitle = document.getElementById('subtitle');
+      if (!subtitle || !typing) {
+        return;
+      }
+      var text = subtitle.getAttribute('data-typed-text');
+      <% if (is_home() && theme.index.slogan.api && theme.index.slogan.api.enable) { %>
+        jQuery.ajax({
+          type: '<%= theme.index.slogan.api.method %>',
+          url: '<%= theme.index.slogan.api.url %>',
+          headers: <%- JSON.stringify(theme.index.slogan.api.headers || {}) %>,
+          dataType: 'json',
+          success: function(result) {
+            var apiText;
+            if (result) {
+              var keys = '<%= theme.index.slogan.api.keys %>'.split(',');
+              if (result instanceof Array) {
+                result = result[0];
+              }
+              for (const k of keys) {
+                var value = result[k];
+                if (typeof value === 'string') {
+                  apiText = value;
+                  break;
+                } else if (value instanceof Object) {
+                  result = value;
+                }
+              }
+            }
+            apiText ? typing(apiText) : typing(text);
+          },
+          error: function(xhr, status, error) {
+            if (error) {
+              console.error('Failed to request <%= theme.index.slogan.api.url %>:', error);
+            }
+            typing(text);
+          }
+        })
+      <% } else { %>
+        typing(text);
+      <% } %>
+    })(window, document);
+  </script>
+<% } %>

package/layout/_partials/post/category-bar.ejs

@@ -0,0 +1,18 @@
+<%
+var parent = page.categories
+if (Array.isArray(page.category_bar)) {
+  parent = parent.filter(cat => page.category_bar.indexOf(cat.name) !== -1)
+}
+var activeIds = page.categories.map(c => c._id)
+activeIds.push(page._id)
+%>
+
+<%- partial('_partials/category-list', {
+  curCats  : parent,
+  params: {
+    type     : 'post',
+    activeIds: activeIds,
+    postLimit: theme.post.category_bar.post_limit,
+    postOrderBy: theme.post.category_bar.post_order_by || config.index_generator.order_by
+  }
+}) %>

package/layout/_partials/post/copyright.ejs

@@ -0,0 +1,56 @@
+<% if (theme.post.copyright.enable && page.copyright !== false) { %>
+  <%
+    var license = theme.post.copyright.license
+    if (typeof page.copyright === 'string') {
+      license = page.copyright
+    } else if (typeof page.license === 'string') {
+      license = page.license
+    }
+    license = license.toUpperCase()
+  %>
+
+  <div class="license-box my-3">
+    <div class="license-title">
+      <div><%= page.title %></div>
+      <div><%= decode_url(page.permalink) %></div>
+    </div>
+    <div class="license-meta">
+      <% if (theme.post.copyright.author.enable && (page.author || config.author)) { %>
+        <div class="license-meta-item">
+          <div><%- __('post.copyright.author') %></div>
+          <div><%- page.author || config.author %></div>
+        </div>
+      <% } %>
+      <% if (theme.post.copyright.post_date.enable && page.date) { %>
+        <div class="license-meta-item license-meta-date">
+          <div><%- __('post.copyright.posted') %></div>
+          <div><%= full_date(page.date, theme.post.copyright.post_date.format || 'LL') %></div>
+        </div>
+      <% } %>
+      <% if (theme.post.copyright.update_date.enable && page.updated && compare_date(page.date, page.updated)) { %>
+        <div class="license-meta-item license-meta-date">
+          <div><%- __('post.copyright.updated') %></div>
+          <div><%= full_date(page.updated, theme.post.copyright.update_date.format || 'LL') %></div>
+        </div>
+      <% } %>
+      <div class="license-meta-item">
+        <div><%- __('post.copyright.licensed') %></div>
+        <div>
+          <% if (['BY', 'BY-SA', 'BY-ND', 'BY-NC', 'BY-NC-SA', 'BY-NC-ND'].indexOf(license) !== -1) { %>
+            <% var items = license.split('-') %>
+            <% for (var idx = 0; idx < items.length; idx++) { %>
+              <a target="_blank" href="https://creativecommons.org/licenses/<%= license.toLowerCase() %>/4.0/">
+              <span class="hint--top hint--rounded" aria-label="<%- __('post.copyright.' + items[idx]) %>">
+                <i class="iconfont icon-<%= items[idx].toLowerCase() %>"></i>
+              </span>
+              </a>
+            <% } %>
+          <% } else { %>
+            <%- license %>
+          <% } %>
+        </div>
+      </div>
+    </div>
+    <div class="license-icon iconfont"></div>
+  </div>
+<% } %>

package/layout/_partials/post/meta-bottom.ejs

@@ -0,0 +1,16 @@
+<div class="post-metas my-3">
+  <% if (page.categories && page.categories.length > 0) { %>
+    <div class="post-meta mr-3 d-flex align-items-center">
+      <i class="iconfont icon-category"></i>
+      <%- partial('_partials/category-chains', { categories: page.categories }) %>
+    </div>
+  <% } %>
+  <% if (page.tags && page.tags.length > 0 ) { %>
+    <div class="post-meta">
+      <i class="iconfont icon-tags"></i>
+      <% page.tags.each(function(tag) { %>
+        <a href="<%= url_for(tag.path) %>">#<%- tag.name %></a>
+      <% }) %>
+    </div>
+  <% } %>
+</div>

package/layout/_partials/post/meta-top.ejs

@@ -0,0 +1,63 @@
+<% if (page.meta !== false) { %>
+  <div class="mt-3">
+    <% if (theme.post.meta.author && theme.post.meta.author.enable && (page.author || config.author)) { %>
+      <span class="post-meta mr-2">
+        <i class="iconfont icon-author" aria-hidden="true"></i>
+        <%- page.author || config.author %>
+      </span>
+    <% } %>
+    <% if (theme.post.meta.date.enable) { %>
+      <span class="post-meta">
+        <i class="iconfont icon-date-fill" aria-hidden="true"></i>
+        <time datetime="<%= full_date(page.date, 'YYYY-MM-DD HH:mm') %>" pubdate>
+          <%= full_date(page.date, theme.post.meta.date.format) %>
+        </time>
+      </span>
+    <% } %>
+  </div>
+
+  <div class="mt-1">
+    <% if (theme.post.meta.wordcount.enable) { %>
+      <span class="post-meta mr-2">
+        <i class="iconfont icon-chart"></i>
+        <% if (theme.post.meta.wordcount.format) { %>
+          <!-- compatible with older versions-->
+          <%- theme.post.meta.wordcount.format.replace('{}', wordcount(page)) %>
+        <% } else { %>
+          <%- __('post.meta.wordcount', wordcount(page)) %>
+        <% } %>
+      </span>
+    <% } %>
+
+    <% if (theme.post.meta.min2read.enable) { %>
+      <span class="post-meta mr-2">
+        <i class="iconfont icon-clock-fill"></i>
+        <% var awl = parseInt(theme.post.meta.min2read.awl, 10) %>
+        <% var wpm = parseInt(theme.post.meta.min2read.wpm, 10) %>
+        <% if (theme.post.meta.min2read.format) { %>
+          <!-- compatible with older versions-->
+          <%- theme.post.meta.min2read.format.replace('{}', min2read(page, { awl: awl, wpm: wpm })) %>
+        <% } else { %>
+          <%- __('post.meta.min2read', min2read(page, { awl: awl, wpm: wpm })) %>
+        <% } %>
+      </span>
+    <% } %>
+
+    <% var views_texts = (theme.post.meta.views.format || __('post.meta.views')).split('{}') %>
+    <% if (theme.post.meta.views.enable && views_texts.length >= 2) { %>
+      <% if (theme.post.meta.views.source === 'leancloud') { %>
+        <span id="leancloud-page-views-container" class="post-meta" style="display: none">
+          <i class="iconfont icon-eye" aria-hidden="true"></i>
+          <%- views_texts[0] %><span id="leancloud-page-views"></span><%- views_texts[1] %>
+        </span>
+        <% import_js(theme.static_prefix.internal_js, 'leancloud.js', 'defer') %>
+      <% } else if (theme.post.meta.views.source === 'busuanzi')  { %>
+        <span id="busuanzi_container_page_pv" style="display: none">
+          <i class="iconfont icon-eye" aria-hidden="true"></i>
+          <%- views_texts[0] %><span id="busuanzi_value_page_pv"></span><%- views_texts[1] %>
+        </span>
+        <% import_js(theme.static_prefix.busuanzi, 'busuanzi.pure.mini.js', 'defer') %>
+      <% } %>
+    <% } %>
+  </div>
+<% } %>

package/layout/_partials/post/sidebar-left.ejs

@@ -0,0 +1,10 @@
+<% if(theme.post.toc.enable && theme.post.toc.placement === 'left' && page.toc !== false){ %>
+  <aside class="sidebar" style="padding-left: 2rem; margin-right: -1rem">
+    <%- partial('_partials/post/toc') %>
+  </aside>
+<% } else if (theme.post.category_bar.enable && theme.post.category_bar.placement !== 'right' && !page.hide &&
+  (!theme.post.category_bar.specific || (theme.post.category_bar.specific && page.category_bar))) { %>
+  <aside class="sidebar category-bar" style="margin-right: -1rem">
+    <%- partial('_partials/post/category-bar') %>
+  </aside>
+<% } %>

package/layout/_partials/post/sidebar-right.ejs

@@ -0,0 +1,10 @@
+<% if(theme.post.toc.enable && theme.post.toc.placement !== 'left' && page.toc !== false){ %>
+  <aside class="sidebar" style="margin-left: -1rem">
+    <%- partial('_partials/post/toc') %>
+  </aside>
+<% } else if (theme.post.category_bar.enable && theme.post.category_bar.placement === 'right' && !page.hide &&
+  (!theme.post.category_bar.specific || (theme.post.category_bar.specific && page.category_bar))) { %>
+  <aside class="sidebar category-bar" style="margin-left: -1rem">
+    <%- partial('_partials/post/category-bar') %>
+  </aside>
+<% } %>

package/layout/_partials/post/toc.ejs

@@ -0,0 +1,34 @@
+<div id="toc">
+  <p class="toc-header"><i class="iconfont icon-list"></i>&nbsp;<%- __('post.toc') %></p>
+  <div class="toc-body" id="toc-body"></div>
+</div>
+
+<%
+import_script(`
+<script>
+  Fluid.utils.createScript('${url_join(theme.static_prefix.tocbot, 'tocbot.min.js')}', function() {
+    var toc = jQuery('#toc');
+    if (toc.length === 0 || !window.tocbot) { return; }
+    var boardCtn = jQuery('#board-ctn');
+    var boardTop = boardCtn.offset().top;
+
+    window.tocbot.init({
+      tocSelector     : '#toc-body',
+      contentSelector : '.markdown-body',
+      headingSelector : CONFIG.toc.headingSelector || 'h1,h2,h3,h4,h5,h6',
+      linkClass       : 'tocbot-link',
+      activeLinkClass : 'tocbot-active-link',
+      listClass       : 'tocbot-list',
+      isCollapsedClass: 'tocbot-is-collapsed',
+      collapsibleClass: 'tocbot-is-collapsible',
+      collapseDepth   : CONFIG.toc.collapseDepth || 0,
+      scrollSmooth    : true,
+      headingsOffset  : -boardTop
+    });
+    if (toc.find('.toc-list-item').length > 0) {
+      toc.css('visibility', 'visible');
+    }
+  });
+</script>
+`)
+%>

package/layout/_partials/scripts.ejs

@@ -0,0 +1,32 @@
+<%- partial('_partials/plugins/nprogress.ejs') %>
+<%- js_ex(theme.static_prefix.jquery, 'jquery.min.js') %>
+<%- js_ex(theme.static_prefix.bootstrap, 'js/bootstrap.min.js') %>
+<%- js_ex(theme.static_prefix.internal_js, 'events.js') %>
+<%- js_ex(theme.static_prefix.internal_js, 'plugins.js') %>
+
+<%- partial('_partials/plugins/typed.ejs') %>
+<%- partial('_partials/plugins/analytics.ejs') %>
+
+<% if (theme.lazyload.enable){ %>
+  <% if (theme.lazyload.onlypost) { %>
+    <% if (is_post() || is_page()) { %>
+      <%- js_ex(theme.static_prefix.internal_js, 'img-lazyload.js') %>
+    <% } %>
+  <% } else { %>
+    <%- js_ex(theme.static_prefix.internal_js, 'img-lazyload.js') %>
+  <% } %>
+<% } %>
+
+<% var script_snippets = deduplicate(page.script_snippets) %>
+<% for (var idx = 0; idx < script_snippets.length; idx++) { %>
+  <%- script_snippets[idx] %>
+<% } %>
+<% page.script_snippets = [] %>
+
+<% if (theme.custom_js) { %>
+  <%- js(theme.custom_js) %>
+<% } %>
+
+<!-- 主题的启动项，将它保持在最底部 -->
+<!-- the boot of the theme, keep it at the bottom -->
+<%- js_ex(theme.static_prefix.internal_js, 'boot.js') %>

package/layout/{_partial → _partials}/search.ejs

@@ -11,11 +11,10 @@
       <div class="modal-body mx-3">
         <div class="md-form mb-5">
           <input type="text" id="local-search-input" class="form-control validate">
-          <label data-error="<%= __('search.status.error') %>" data-success="<%= __('search.status.success') %>"
-                 for="local-search-input"><%= __('search.keyword') %></label>
+          <label data-error="x" data-success="v" for="local-search-input"><%= __('search.keyword') %></label>
         </div>
         <div class="list-group" id="local-search-result"></div>
       </div>
     </div>
   </div>
-</div>
+</div>

package/layout/about.ejs

@@ -38,14 +38,16 @@ page.banner_mask_alpha = page.banner_mask_alpha || theme.about.banner_mask_alpha
 
   <% if(page.comments) { %>
     <!-- Comments -->
-    <article class="comments" id="comments">
+    <article id="comments">
       <% var type %>
       <% if (typeof page.comment === 'string' && page.comment !== '') { %>
-        <% type = '_partial/comments/' + page.comment %>
+        <% type = '_partials/comments/' + page.comment %>
       <% } else { %>
-        <% type = '_partial/comments/' + theme.post.comments.type %>
+        <% type = '_partials/comments/' + theme.post.comments.type %>
       <% } %>
       <%- partial(type) %>
     </article>
   <% } %>
 </article>
+
+<% import_css(theme.static_prefix.hint, 'hint.min.css') %>

package/layout/archive.ejs

@@ -7,4 +7,4 @@ page.banner_img_height = theme.archive.banner_img_height
 page.banner_mask_alpha = theme.archive.banner_mask_alpha
 %>
 
-<%- partial('_partial/archive-list.ejs', { params: { postTotal: site.posts.length } }) %>
+<%- partial('_partials/archive-list.ejs', { params: { key: page.layout, postTotal: site.posts.length } }) %>

package/layout/categories.ejs

@@ -1,68 +1,19 @@
 <%
-page.layout = "categories"
+page.layout = 'categories'
 page.title = theme.category.title || __('category.title')
 page.subtitle = theme.category.subtitle || __('category.subtitle')
 page.banner_img = theme.category.banner_img
 page.banner_img_height = theme.category.banner_img_height
 page.banner_mask_alpha = theme.category.banner_mask_alpha
-
 var orderBy = theme.category.order_by || 'name'
+var curCats = site.categories.find({ parent: { $exists: false } }).sort(orderBy).filter(cat => cat.length)
 %>
 
-<% function render_categories(cats, depth) { %>
-  <% depth = depth || 0 %>
-  <% return cats.each((cat) => { %>
-    <% var subCats = site.categories.find({parent: cat._id}).sort(orderBy).filter(cat => cat.length) %>
-    <% var collapsed = subCats.length === 0 || depth >= theme.category.collapse_depth %>
-    <div class="<%= depth <= 0 ? 'category' : 'category-sub' %> row">
-      <a
-        class="<%= depth <= 0 ? 'category-item' : 'category-subitem' %> <%= collapsed ? 'collapsed' : '' %> list-group-item category-item-action col-10 col-md-11"
-        id="heading-<%= md5(cat.name) %>" role="tab" data-toggle="collapse" href="#collapse-<%= md5(cat.name) %>"
-        aria-expanded="<%= collapsed ? 'false' : 'true' %>"
-      >
-        <%= cat.name %>
-        <i class="iconfont icon-arrowright"></i>
-      </a>
-      <a href="<%= url_for(cat.path) %>" class="category-count col-2 col-md-1">
-        <i class="iconfont icon-articles"></i>
-        <span><%= cat.posts.length %></span>
-      </a>
-      <div class="category-collapse collapse" id="collapse-<%= md5(cat.name) %>" role="tabpanel" aria-labelledby="heading-<%= md5(cat.name) %>">
-        <% var posts = cat.posts.sort(theme.category.post_order_by || config.index_generator.order_by || '-date') %>
-        <% if (subCats.length > 0) { %>
-          <% var filteredPosts = posts.filter((p) => {
-            return p.categories.filter(catOnPost => catOnPost.parent === cat._id).length === 0;
-          }) %>
-          <%- render_posts(filteredPosts, cat) %>
-          <%- render_categories(subCats, depth + 1) %>
-        <% } else { %>
-          <%- render_posts(posts, cat) %>
-        <% } %>
-      </div>
-    </div>
-  <% }) %>
-<% } %>
-
-<% function render_posts(posts, cat) { %>
-  <div class="category-post-list">
-    <% var limit = theme.category.post_limit %>
-    <% for (var idx = 0; idx < posts.length; idx++) { %>
-      <% var post = posts.data[idx] %>
-      <% if (idx && limit && idx >= limit) { %>
-        <a href="<%= url_for(cat.path) %>" class="list-group-item list-group-item-action">
-          <span class="category-post">More...</span>
-        </a>
-        <% break %>
-      <% } else { %>
-        <a href="<%= url_for(post.path) %>" class="list-group-item list-group-item-action">
-          <span class="category-post"><%= post.title %></span>
-        </a>
-      <% } %>
-    <% } %>
-  </div>
-<% } %>
-
-<div class="category-list">
-  <% cats = site.categories.find({parent: {$exists: false}}).sort(orderBy).filter(cat => cat.length) %>
-  <%- render_categories(cats) %>
-</div>
+<%- partial('_partials/category-list', {
+  curCats: curCats,
+  params: {
+    orderBy: orderBy,
+    postLimit  : theme.category.post_limit,
+    postOrderBy: theme.category.post_order_by || config.index_generator.order_by
+  }
+}) %>

package/layout/category.ejs

@@ -9,4 +9,4 @@ page.banner_mask_alpha = theme.category.banner_mask_alpha
 var cat = site.categories.find({name: page.category}).filter(cat => cat.length).data[0]
 %>
 
-<%- partial('_partial/archive-list.ejs', { params: { postTotal: cat ? cat.posts.length : 0 } }) %>
+<%- partial('_partials/archive-list.ejs', { params: { key: page.layout, postTotal: cat ? cat.posts.length : 0 } }) %>

package/layout/index.ejs

@@ -10,7 +10,7 @@ page.banner_mask_alpha = theme.index.banner_mask_alpha
 <% page.posts.each(function (post) { %>
   <div class="row mx-auto index-card">
     <% var post_url = url_for(post.path), index_img = post.index_img || theme.post.default_index_img %>
-    <% if(index_img) { %>
+    <% if (index_img) { %>
       <div class="col-12 col-md-4 m-auto index-img">
         <a href="<%= post_url %>" target="<%- theme.index.post_url_target %>">
           <img src="<%= url_for(index_img) %>" alt="<%= post.title %>">
@@ -27,15 +27,15 @@ page.banner_mask_alpha = theme.index.banner_mask_alpha
         </a>
       </h1>
 
-      <p class="index-excerpt">
-        <a href="<%= post_url %>" target="<%- theme.index.post_url_target %>">
-          <% var excerpt = post.description || post.excerpt || (theme.index.auto_excerpt.enable && post.content) %>
+      <% var excerpt = post.description || post.excerpt || (theme.index.auto_excerpt.enable && post.content) %>
+      <a class="index-excerpt <%= index_img ? '' : 'index-excerpt__noimg' %>" href="<%= post_url %>" target="<%- theme.index.post_url_target %>">
+        <div>
           <%- escape_html(strip_html(excerpt).substring(0, 200).trim()).replace(/\n/g, ' ') %>
-        </a>
-      </p>
+        </div>
+      </a>
 
       <div class="index-btm post-metas">
-        <% if(theme.index.post_meta.date ) { %>
+        <% if (theme.index.post_meta.date) { %>
           <div class="post-meta mr-3">
             <i class="iconfont icon-date"></i>
             <time datetime="<%= full_date(post.date, 'YYYY-MM-DD HH:mm') %>" pubdate>
@@ -43,19 +43,17 @@ page.banner_mask_alpha = theme.index.banner_mask_alpha
             </time>
           </div>
         <% } %>
-        <% if(theme.index.post_meta.category && post.categories.length > 0) { %>
-          <div class="post-meta mr-3">
+        <% if (theme.index.post_meta.category && post.categories.length > 0) { %>
+          <div class="post-meta mr-3 d-flex align-items-center">
             <i class="iconfont icon-category"></i>
-            <% post.categories.each(function(cate){ %>
-              <a href="<%= url_for(cate.path) %>"><%- cate.name %></a>
-            <% }) %>
+            <%- partial('_partials/category-chains', { categories: post.categories, limit: 1 }) %>
           </div>
         <% } %>
-        <% if(theme.index.post_meta.tag && post.tags.length > 0) { %>
+        <% if (theme.index.post_meta.tag && post.tags.length > 0) { %>
           <div class="post-meta">
             <i class="iconfont icon-tags"></i>
             <% post.tags.each(function(tag){ %>
-              <a href="<%= url_for(tag.path) %>"><%- tag.name %></a>
+              <a href="<%= url_for(tag.path) %>">#<%- tag.name %></a>
             <% }) %>
           </div>
         <% } %>
@@ -64,4 +62,4 @@ page.banner_mask_alpha = theme.index.banner_mask_alpha
   </div>
 <% }) %>
 
-<%- partial('_partial/paginator') %>
+<%- partial('_partials/paginator') %>

package/layout/layout.ejs

@@ -1,44 +1,18 @@
 <%
-var subtitle = page.subtitle || page.title
-var banner_img = page.banner_img || theme.index.banner_img
-var banner_img_height = page.banner_img_height || theme.index.banner_img_height
-var banner_mask_alpha = page.banner_mask_alpha || theme.index.banner_mask_alpha
+var banner_img_height = parseFloat(page.banner_img_height || theme.index.banner_img_height)
 var colorSchema = theme.dark_mode && theme.dark_mode.enable && theme.dark_mode.default ? theme.dark_mode.default : ''
 %>
 
 <!DOCTYPE html>
 <html lang="<%= config.language %>" <%= colorSchema ? `data-default-color-scheme=${colorSchema}` : '' %>>
 
-<%- partial('_partial/head') %>
+<%- partial('_partials/head.ejs') %>
 
 <body>
-  <header style="height: <%- banner_img_height %>vh;">
-    <%- partial('_partial/nav') %>
-    <div class="banner" id="banner" <%- theme.banner && theme.banner.parallax && 'parallax=true' %>
-         style="background: url('<%- url_for(banner_img) %>') no-repeat center center;
-           background-size: cover;">
-      <div class="full-bg-img">
-        <div class="mask flex-center" style="background-color: rgba(0, 0, 0, <%= parseFloat(banner_mask_alpha) %>)">
-          <div class="page-header text-center fade-in-up">
-            <span class="h2" id="subtitle" title="<%= subtitle %>">
-              <% if(!theme.fun_features.typing.enable) { %>
-                <%- subtitle %>
-              <% } %>
-            </span>
+  <%- inject_point('bodyBegin') %>
 
-            <% if(is_post() && page.meta !== false) { %>
-              <%- partial('_partial/post-meta') %>
-            <% } %>
-          </div>
-
-          <% if (theme.scroll_down_arrow.enable && theme.scroll_down_arrow.banner_height_limit <= banner_img_height && page.layout !== '404') { %>
-            <div class="scroll-down-bar">
-              <i class="iconfont icon-arrowdown"></i>
-            </div>
-          <% } %>
-        </div>
-      </div>
-    </div>
+  <header>
+    <%- inject_point('header') %>
   </header>
 
   <main>
@@ -46,12 +20,11 @@ var colorSchema = theme.dark_mode && theme.dark_mode.enable && theme.dark_mode.d
       <%- body %>
     <% } else { %>
       <div class="container nopadding-x-md">
-        <div class="py-5" id="board"
-          <%- banner_img_height >= 100 && theme.banner && theme.banner.parallax ? 'style=margin-top:0' : '' %>>
+        <div id="board"
+          <%- banner_img_height >= 100 && theme.banner && theme.banner.parallax ? 'style="margin-top: 0"' : '' %>>
           <% if(page.layout === 'about') { %>
             <div class="about-avatar">
-              <img src="<%= url_for(theme.about.avatar) %>"
-                   class="img-fluid" alt="avatar">
+              <img src="<%= url_for(theme.about.avatar) %>" class="img-fluid" alt="avatar">
             </div>
           <% } %>
           <div class="container">
@@ -72,7 +45,7 @@ var colorSchema = theme.dark_mode && theme.dark_mode.enable && theme.dark_mode.d
     <% } %>
 
     <% if (theme.search.enable) { %>
-      <%- partial('_partial/search') %>
+      <%- partial('_partials/search.ejs') %>
     <% } %>
 
     <% if (theme.custom_html) { %>
@@ -84,10 +57,17 @@ var colorSchema = theme.dark_mode && theme.dark_mode.enable && theme.dark_mode.d
     <% } %>
   </main>
 
-  <%- partial('_partial/footer', { params: { subtitle: subtitle } }) %>
+  <footer>
+    <%- inject_point('footer') %>
+  </footer>
+
+  <!-- Scripts -->
+  <%- partial('_partials/scripts.ejs') %>
 
-  <!-- SCRIPTS -->
-  <%- partial('_partial/scripts') %>
+  <%- inject_point('bodyEnd') %>
 
+  <noscript>
+    <div class="noscript-warning"><%- __('noscript_warning') %></div>
+  </noscript>
 </body>
 </html>