Merge pull request #299 from fi3ework/dev-1.6.2

Update log: #299
fi3ework · Jun 25, 2021 · dc53228 · dc53228
2 parents 91ffda4 + a118be9
commit dc53228
Show file tree

Hide file tree

Showing 60 changed files with 1,870 additions and 6,825 deletions.
diff --git a/.gitignore b/.gitignore
@@ -32,7 +32,3 @@ tags
 *.ipr
 *.iws
 *.iml
-
-# JS source map file
-*.js.map
-*.js.LICENSE.txt
diff --git a/.prettierrc.js b/.prettierrc.js
@@ -3,12 +3,12 @@ module.exports = {
   tabWidth: 2,
   // useTabs: false,
   semi: false,
-  singleQuote: true
+  singleQuote: true,
   // trailingComma: 'none',
   // bracketSpacing: true,
   // jsxBracketSameLine: false,
   // arrowParens: 'avoid',
   // rangeStart: 0,
   // rangeEnd: Infinity,
   // proseWrap: "preserve"
-}
+}
diff --git a/README.md b/README.md
@@ -9,7 +9,6 @@
 ## 文档
 
 - [English document](./docs/README-en.md)
-
 - [二次开发文档](./docs/develop-guide-zh.md)
 
 ## 说明
@@ -26,7 +25,7 @@
 
 在 Hexo 根目录下执行以下命令：
 
-``` shell
+``` bash
 npm i hexo-generator-json-content --save && npm i --save hexo-wordcount && git clone https://github.com/fi3ework/hexo-theme-archer.git themes/archer --depth=1
 ```
 
@@ -44,7 +43,7 @@ theme: archer
 
 在 Hexo 根目录下的 `_config.yml` 中添加以下字段：
 
-```yaml
+``` yaml
 jsonContent:
   meta: true
   pages: false
@@ -69,7 +68,7 @@ jsonContent:
 
 现在您的博客项目的目录目录结构应当如下：
 
-```bash
+``` bash
 . # Hexo 根目录
 ├── themes
 │   └── archer # Archer 主题目录

diff --git a/_config.yml b/_config.yml
@@ -9,8 +9,9 @@ signature: witness me
 social:
   email: [email protected]
   github: //github.com/fi3ework
-  # wechat and qq should be a path of qr-code image
+  # wechat should be a path of qr-code image path
   wechat: /assets/example_qr.png
+  # qq should be a path of qr-code image path
   qq: 
   telegram: 
   weibo: 
@@ -85,12 +86,15 @@ comment:
   valine_appId: 
   valine_appKey: 
   valine_placeHolder: 
-  # gitalk site: https://github.com/gitalk/gitalk#options  
+  # gitalk site: https://github.com/gitalk/gitalk/
+  # Value 'true' is recommended for gitalk_pathname_id setting
   gitalk_client_id: 
   gitalk_client_secret: 
   gitalk_admin: 
   gitalk_owner: 
   gitalk_repo: 
+  gitalk_pathname_id: false
+  gitalk_create_issue_manually: true
   # utteranc site: https://utteranc.es/
   utteranc_repo:  
   utteranc_label: 
@@ -129,5 +133,17 @@ copyright:
   enable: true
   # https://creativecommons.org/
   license: '本文采用<a rel="license" href="http://creativecommons.org/licenses/by-nc/4.0/">知识共享署名-非商业性使用 4.0 国际许可协议</a>进行许可'
+# Website Approve
+website_approve:
+  enable: false
+  icp_approve: 
+  beian_approve: 
+  beian_img: /assets/beian.png
 # Blog page article timeliness days reminder, 0 for no threshold
 outdated_threshold: 0
+# Blog float button theme ('default' or 'rounded')
+float_button_theme: default
+# Blog read progress color ('default' for black or 'feature' for feature-color)
+read_progress_color: default
+# Blog post banner theme ('default' or 'clean')
+post_banner_theme: default
diff --git a/docs/develop-guide-zh.md b/docs/develop-guide-zh.md
@@ -50,11 +50,16 @@ ignore: ['**/themes/**/node_modules/**', '**/themes/**/node_modules', '**/themes
 2. 在 Hexo 根目录下执行 `hexo s` 启动本地服务器。
 3. 在 Archer 主题目录下执行 `npm run dev` 进入本地开发模式。
 
-该模式会监视 Archer 主题目录下 `src` 和 `layout` 中文件的修改，实时进行编译，然后通过 BrowserSync 在 `localhost:3000`（默认）下自动刷新页面。其他位置的文件修改并不会自动刷新页面，需手动重启服务。
+该模式会监听 Archer 主题目录下 `src` 和 `layout` 中文件的修改，实时进行编译，然后通过 BrowserSync 在 `localhost:3000`（默认）下自动刷新页面。其他位置的文件修改并不会自动刷新页面，需手动重启服务。
 
 ### 编译发布
 
 编译压缩，发布资源。
 
-1. 在 Archer 主题目录下执行 `npm run build`，编译需要的文件到 `source` 文件夹下。
+1. 在 Archer 主题目录下执行 `npm run build`，编译并压缩博客依赖的 `.js` 与 `.css` 文件到 `source` 文件夹下。
 2. 在 Hexo 根目录下执行 `hexo generate` 重新生成 Hexo 博客静态文件。
+3. 推送代码到仓库。
+
+在推送前，请确保已使用 `npm run build` 命令编译并压缩 `.js` 与 `.css` 文件，您可以分别在 `source/scripts` 和 `source/css` 目录下找到它们。
+
+如果编译没有生成 `.js` 文件，可以使用 `npm run build-js` 命令，查看编译失败的原因。对于 `.css` 文件，执行 `npm run build` 时会自动显示出现的错误。
diff --git a/gulpfile.js b/gulpfile.js
@@ -1,4 +1,7 @@
 const gulp = require('gulp'),
+  postcss = require('gulp-postcss'),
+  sourcemaps = require('gulp-sourcemaps'),
+  autoprefixer = require('autoprefixer'),
   webpack = require('webpack'),
   sass = require('gulp-sass'),
   browserSync = require('browser-sync').create()
@@ -7,18 +10,20 @@ const gulp = require('gulp'),
 
 // webpack
 function execWebpack(cb) {
-  webpack(require('./webpack.config.js'), function (err) {
+  webpack(require('./webpack.dev.js'), function (err) {
     if (err) return cb(err)
     cb()
   })
 }
 
 // sass
 function execSass() {
-  return gulp.src(['./src/scss/style.scss', './src/scss/mobile.scss'])
-    .pipe(sass({
-      outputStyle: 'compressed'
-    }).on('error', sass.logError))
+  return gulp
+    .src(['src/scss/style.scss', 'src/scss/mobile.scss'])
+    .pipe(sourcemaps.init())
+    .pipe(sass().on('error', sass.logError))
+    .pipe(postcss([autoprefixer()]))
+    .pipe(sourcemaps.write('.'))
     .pipe(gulp.dest('./source/css/'))
 }
 
@@ -46,7 +51,7 @@ function reloadConfig(done) {
 
 exports.dev = gulp.series(execWebpack, execSass, function (cb) {
   browserSync.init({
-    proxy: 'localhost:4000'
+    proxy: 'localhost:4000',
   })
   gulp.watch(['./src/js/**/*.js'], reloadJs)
   gulp.watch(['./src/scss/**/*.scss'], reloadCss)
@@ -55,7 +60,6 @@ exports.dev = gulp.series(execWebpack, execSass, function (cb) {
   cb()
 })
 
-
 /* ========== bulid ========== */
 
 // webpack-prod
@@ -66,7 +70,22 @@ function webpackProd(cb) {
   })
 }
 
-exports.build =  gulp.series(execSass, webpackProd, function (cb) {
+// sass-prod
+function sassProd() {
+  return gulp
+    .src(['src/scss/style.scss', 'src/scss/mobile.scss'])
+    .pipe(sourcemaps.init())
+    .pipe(
+      sass({
+        outputStyle: 'compressed',
+      }).on('error', sass.logError)
+    )
+    .pipe(postcss([autoprefixer()]))
+    .pipe(sourcemaps.write('.'))
+    .pipe(gulp.dest('./source/css/'))
+}
+
+exports.build = gulp.series(webpackProd, sassProd, function (cb) {
   cb()
   console.log(process.argv)
 })
diff --git a/layout/_partial/base-footer-fixed.ejs b/layout/_partial/base-footer-fixed.ejs
@@ -0,0 +1,20 @@
+<% if(is_home()) { %>
+<footer class="footer-fixed index-footer-fixed">
+<% } else { %>
+<footer class="footer-fixed">
+<% } %>
+    <!-- back to top button -->
+    <div class="footer-fixed-element">
+        <% if(theme.float_button_theme === 'rounded') { %>
+        <div class="back-top back-top-rounded">
+        <% } else { %>
+        <div class="back-top">
+        <% } %>
+            <% if(theme.float_button_theme === 'rounded') { %>
+            <i class="fas fa-chevron-up"></i>
+            <% } else { %>
+            <div>&#xe639;</div>
+            <% } %>
+        </div>
+    </div>
+</footer>
diff --git a/layout/_partial/base-footer.ejs b/layout/_partial/base-footer.ejs
@@ -9,6 +9,23 @@
     <div class="copyright">
         <span id="hexo-power">Powered by <a href="https://hexo.io/" target="_blank">Hexo</a></span><span class="iconfont-archer power">&#xe635;</span><span id="theme-info">theme <a href="https://github.com/fi3ework/hexo-theme-archer" target="_blank">Archer</a></span>
     </div>
+    <!-- website approve for Chinese user -->
+    <% if(theme.website_approve.enable) { %>
+    <div class="website-approve">
+        <% if(theme.website_approve.icp_approve) { %>
+        <span id="icp-approve" class="icp-approve">
+            <a href="https://beian.miit.gov.cn/" target="_blank"><%- theme.website_approve.icp_approve %></a>
+        </span>
+        <% } %>
+        <% if(theme.website_approve.beian_approve && theme.website_approve.beian_img) { %>
+        <% const beianPath = theme.website_approve.beian_img %>
+        <img class="beian-img" src="<%- url_for(beianPath) %>" />
+        <span id="beian-approve" class="beian-approve">
+            <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=<%- theme.website_approve.beian_approve %>" target="_blank">京公网安备 <%- theme.website_approve.beian_approve %>号</a>
+        </span>
+        <% } %>
+    </div>
+    <% } %>
     <!-- 不蒜子  -->
     <% if (theme.busuanzi) { %>
     <div class="busuanzi-container">

diff --git a/layout/_partial/base-header.ejs b/layout/_partial/base-header.ejs
@@ -3,18 +3,43 @@
 <% } else { %>
 <header class="header">
 <% } %>
-    <div class="read-progress"></div>
-    <div class="header-sidebar-menu">&#xe775;</div>
-    <!-- post页的toggle banner  -->
+    <!-- top read progress line -->
+    <div class="header-element">
+        <% if(theme.read_progress_color === 'feature') { %>
+        <div class="read-progress read-progress-feature"></div>
+        <% } else { %>
+        <div class="read-progress"></div>
+        <% } %>
+    </div>
+    <!-- sidebar menu button -->
+    <div class="header-element">
+        <% if(theme.float_button_theme === 'rounded') { %>
+        <div class="header-sidebar-menu header-sidebar-menu-rounded">
+        <% } else { %>
+        <div class="header-sidebar-menu">
+        <% } %>
+            <% if(theme.float_button_theme === 'rounded') { %>
+            <i class="fas fa-bars"></i>
+            <% } else { %>
+            <div style="padding-left: 1px;">&#xe775;</div>
+            <% } %>
+        </div>
+    </div>
+    <!-- back to home page text -->
+    <a class="home-link header-element" href=<%- config.root %>><%- theme.main_title || config.title %></a>
+    <!-- toggle banner for post layout -->
     <% if (is_post()) { %>
+    <% if(theme.post_banner_theme === 'clean') { %>
+    <div class="banner banner-clean">
+    <% } else { %>
     <div class="banner">
-            <div class="blog-title">
-                <a href="<%- url_for() %>" ><%= theme.main_title || config.title%></a>
-            </div>
-            <div class="post-title">
-                <a href="#" class="post-name"><%- page.title %></a>
-            </div>
+    <% } %>
+        <div class="blog-title header-element">
+            <a href="<%- url_for() %>" ><%= theme.main_title || config.title%></a>
+        </div>
+        <div class="post-title header-element">
+            <a href="#" class="post-name"><%- page.title %></a>
+        </div>
     </div>
     <% } %>
-    <a class="home-link" href=<%- config.root %>><%- theme.main_title || config.title %></a>
 </header>
diff --git a/layout/_partial/base-social.ejs b/layout/_partial/base-social.ejs
@@ -5,8 +5,8 @@
                 <a href="mailto:<%- theme.social[name] %>" class="iconfont-archer <%- name %>" title=<%- name %> ></a>
             <% } else if (name === "wechat" || name === "qq") { %>
                 <span class="iconfont-archer <%- name %>" title=<%- name %>>
-                  <% var path = theme.social[name] %>
-                  <img class="profile-qr" src="<%- url_for(path) %>" />
+                    <% var path = theme.social[name] %>
+                    <img class="profile-qr" src="<%- url_for(path) %>" />
                 </span>
             <% } else { %>
                 <a href="<%- url_for(theme.social[name]) %>" class="iconfont-archer <%- name %>" target="_blank" title=<%- name %>></a>

diff --git a/layout/_partial/comment/gitalk.ejs b/layout/_partial/comment/gitalk.ejs
@@ -1,19 +1,24 @@
-<!-- gitalk评论 -->
-<% if(theme.comment.gitalk_client_id && theme.comment.gitalk_client_secret && theme.comment.gitalk_admin && theme.comment.gitalk_owner && theme.comment.gitalk_repo) { %>
-    <div id="comment-container"></div>
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/gitalk.css">
-    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gitalk.min.js"></script>
+<% if(theme.comment && theme.comment.gitalk_client_id && theme.comment.gitalk_client_secret && theme.comment.gitalk_admin && theme.comment.gitalk_owner && theme.comment.gitalk_repo) { %>
+    <div id="gitalk-container"></div>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/gitalk.css"></link>
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gitalk.min.js"></script>
     <script>
-        var gitalk = new Gitalk({
+        let idOption = '<%- page.date %>'
+        <% if(theme.comment.gitalk_pathname_id) { %>
+        idOption = location.pathname
+        <% } %>
+        const gitalk = new Gitalk({
             clientID: '<%- theme.comment.gitalk_client_id %>',
-            clientSecret: '<%- theme.comment.gitalk_client_secret%>',
-            id: '<%- page.date %>',
-            repo: '<%- theme.comment.gitalk_repo%>',
-            owner: '<%- theme.comment.gitalk_owner%>',
-            admin: <%- JSON.stringify(theme.comment.gitalk_admin)%>,
-            createIssueManually: true,
-            distractionFreeMode: false
+            clientSecret: '<%- theme.comment.gitalk_client_secret %>',
+            repo: '<%- theme.comment.gitalk_repo %>',
+            owner: '<%- theme.comment.gitalk_owner %>',
+            admin: <%- JSON.stringify(theme.comment.gitalk_admin) %>,
+            id: idOption,
+            distractionFreeMode: false,
+            createIssueManually: <%- theme.comment.gitalk_create_issue_manually %>,
         })
-        gitalk.render('comment-container')
+        console.log(gitalk)
+        gitalk.render('gitalk-container')
     </script>
-    <% } %>
+    <noscript>为正常使用 Gitalk 评论功能，您需要激活 JavaScript</noscript>
+<% } %> 
diff --git a/layout/layout.ejs b/layout/layout.ejs
@@ -11,6 +11,7 @@
         <body class="about-body">
     <% } %>
     <%- partial('_partial/base-header') %>
+    <%- partial('_partial/base-footer-fixed') %>
     <div class="wrapper">
         <%- partial('_partial/base-background-image') %>
         <%- partial('_partial/script/font-loader') %>        
@@ -35,7 +36,6 @@
         <%- toc(page.content, {class: 'toc', list_number: true}) %>
     </div>
     <% } %>
-    <div class="back-top iconfont-archer">&#xe639;</div>
     <%- partial('_partial/sidebar/base-sidebar', {}, {cache: true}) %>
     <%- partial('./site-meta.ejs') %>
     <!-- CDN failover -->
@@ -51,7 +51,7 @@
     <!-- algolia -->
     <% if (theme.algolia_search.enable) { %>
         <%- partial('_partial/algolia') %>
-        <script src="https://cdn.jsdelivr.net/npm/instantsearch.js@4.8.3/dist/instantsearch.production.min.js" integrity="sha256-LAGhRRdtVoD6RLo2qDQsU2mp+XVSciKRC8XPOBWmofM=" crossorigin="anonymous"></script>
+        <script src="https://cdn.jsdelivr.net/npm/instantsearch.js@4.24.1/dist/instantsearch.production.min.js" crossorigin="anonymous"></script>
         <script src="<%- url_for('/scripts/search.js') %>" defer></script>
     <% } %>
     <!-- busuanzi  -->