hexo-theme-shokax 0.0.3 → 0.0.4-alpha

package/CONTRIBUTING.md

@@ -25,6 +25,10 @@
 2. 您愿意接受长时间的等待（一般不超过15天）
 3. 您能够接受因代码质量等问题而提出的疑问,并愿意讨论是否接受更改
 
+有关issues的说明:
+1. 如果您愿意开发某 issues 的提议功能或修复 bug，建议在对应 issue 下评论说明一下，避免闭门造车和重复造轮子的惨剧
+2. 您应该在对应 PR 提交时绑定对应 issue，以便进行统计
+
 ## Github PR
 此处为在使用 Github PR 提交时应注意的事:
 - 默认你对 Git、GitHub 已经有了一定的了解,并且懂得使用 PR（此方面问题可以去讨论区发起 Q&A）

package/README.md

@@ -9,16 +9,33 @@
 诞生原因是目前shoka已经两年没有更新了,积压了大量BUG和功能请求。\
 本项目处于高强度开发期,但github仓库版本已基本可用 \
 二次开发与常见问题请看wiki \
-`0.0.2-alpha2`开始,`lantern`和`qweather`已迁移为插件 \
-插件系统已完工,食用方法见[awesome-shokaX](https://github.com/zkz098/awesome-shokaX)
+`0.0.2-alpha2`开始,`lantern`和`qweather`已迁移为插件
 
-## 和shoka的区别
+shokaX的社区资源导航和插件仓库为[awesome-shokaX](https://github.com/zkz098/awesome-shokaX)
+
+## 💬 和shoka的区别
 原先shoka使用了javascript+Native+nunjucks的技术 \
 而shokaX则使用了typescript+Vue 3+Pug的技术搭配 \
 图标库可能会更换为Font Awesome 6 \
 更改了大量难以访问的CDN链接
 
-## 如何安装?
+## ✨ 功能清单 
+
+|   功能名称   | 实现状态 |     功能名称     | 实现状态 |
+|:--------:|:----:|:------------:|:----:|
+|  PWA支持   |  ✅   |    JSD拆分     |  ✅   |
+|  注入API   |  ✅   |    社区插件系统    |  ✅   |
+|  自定义字体   |  ✅*  |    自定义样式     |  ✅*  |
+| 多种评论系统支持 |  ✅   |   用户行为分析支持   |  ✅   |
+|  底部备案号   |  ✅   |    自定义页尾     |  ✅*  |
+| CSS渐变封面  |  ✅   | typescript支持 |  ✅^  |
+
+备注:
+- *: 需要使用注入API实现
+- ^: 仅page js部分,hexo script未实现
+
+
+## 🔧 如何安装?
 建议使用[ShokaX-CLI](https://github.com/zkz098/shokaX-CLI) ,执行下列命令即可:
 ```bash
 npm i shokax-cli --location=global
@@ -27,6 +44,15 @@ SXC install shokaX
 ```
 后续配置请点[这里](https://www.kaitaku.xyz/webbuild/shokaX/) 查看
 
+releases及npm的版本号区别如下:
+- x.x.x-alpha版本是早期测试版,部分未经测试环境测试,不能保证正常运行
+- x.x.x-beta(目前还没有)是测试版,可以保证正常生成,但可能存在bug
+- x.x.x是相对稳定的版本,基本上不存在严重BUG
+
+github仓库建议通过右边的 releases 下载,步骤为:
+- 点击 Releases 的 Latest 版本
+- 下载 Assets 中的 `Source code(zip)`
+- 解压即可作为主题使用
 # 许可证
 许可证: BSD-3-Clause \
 [![FOSSA Status](https://app.fossa.com/api/projects/git%2Bgithub.com%2Fzkz098%2Fhexo-theme-shokaX.svg?type=large)](https://app.fossa.com/projects/git%2Bgithub.com%2Fzkz098%2Fhexo-theme-shokaX?ref=badge_large)

package/layout/_mixin/breadcrumb.pug

@@ -1,7 +1,7 @@
 mixin BCRender(post, home)
     if home
         != '<div class="breadcrumb" itemListElement itemscope itemtype="https://schema.org/BreadcrumbList">'
-        i(class="ic i-home")
+        i(class="fa fa-solid fa-house")
         span
             a(href=url_for(site.path))
                 != __('menu.home')
@@ -10,7 +10,7 @@ mixin BCRender(post, home)
     if post.categories && post.categories.length
         - var cat_length = post.categories.length
         if home
-            i(class="ic i-angle-right")
+            i(class="fa fa-solid fa-angle-right")
         each cat,index in post.categories.toArray()
             if home
                 if index===cat_length
@@ -29,5 +29,5 @@ mixin BCRender(post, home)
                 a(href=url_for(cat.path) title=__('post.in')+cat.name)
                     != cat.name
             if cat_length > 1 && index !== cat_length
-                i(class="ic i-angle-right")
+                i(class="fa fa-solid fa-angle-right")
     != '</div>'

package/layout/_mixin/card.pug

@@ -12,10 +12,11 @@ mixin CardRender(item)
                     != item.top.name
         div(class="info")
             if item.link
-                - var postTitleIcon = '<i class="ic i-link-alt"></i>'
+                - var postTitleIcon = '<i class="fa fa-solid fa-up-right-from-square"></i>'
             - var postText = itemname || item.link || __('post.untitled')
+            - var tempI = postText + (postTitleIcon || '')
             div(class="ribbon")
-                != _url(item.link , postText + (postTitleIcon || ''), {itemprop: 'url', title: postText})
+                != _url(item.link , tempI , {itemprop: 'url', title: postText})
             div(class="inner")
                 - var len = ''
                 if item.child
@@ -30,8 +31,8 @@ mixin CardRender(item)
                 div(class="meta footer")
                     if item.top
                         span
-                            != _url(item.top.path, '<i class="ic i-flag"></i>'+item.top.name, {itemprop: 'url', title: item.top.name})
+                            != _url(item.top.path, '<i class="fa fa-solid fa-flag"></i>'+item.top.name, {itemprop: 'url', title: item.top.name})
                     span
-                        i(class="ic i-file")
+                        i(class="fa fa-solid fa-file")
                         != len
             != _url(item.path, 'more...', {itemprop: 'url', title: itemname, class: 'btn'})

package/layout/_mixin/comment.pug

@@ -33,6 +33,7 @@ mixin CommentRender()
         else if gt
             div(class="warp" id="gtcomments")
             script(type="text/javascript" data-pjax).
+                const gproxy = theme.gitalk.proxy || undefined
                 const gitalk = new Gitalk({
                     clientID: '#{theme.gitalk.clientID}',
                     clientSecret: '#{theme.gitalk.clientSecret}',
@@ -41,7 +42,7 @@ mixin CommentRender()
                     admin: #{theme.gitalk.admin},
                     id: location.pathname,      // Ensure uniqueness and length less than 50
                     distractionFreeMode: false,  // Facebook-like distraction free mode
-                    proxy: "#{theme.gitalk.proxy || undefined}"
+                    proxy: "#{gproxy}"
                 });
                 gitalk.render("gtcomments")
         else if gs

package/layout/_mixin/postmeta.pug

@@ -5,7 +5,7 @@ mixin PMRender(item, full)
         - var create_title = __('post.created') + __('symbol.colon') + full_date(item.date)
         span(class="item" title=create_title)
             span(class="icon")
-                i(class="ic i-calendar")
+                i(class="fa fa-solid fa-calendar-days")
             if full
                 span(class="text")
                     != __('post.posted')
@@ -14,7 +14,7 @@ mixin PMRender(item, full)
         if theme.post.count
             span(class="item" title=__('symbols_count_time.count'))
                 span(class="icon")
-                    i(class="ic i-pen")
+                    i(class="fa fa-solid fa-pen-nib")
                 if full
                     span(class="text")
                         != __('symbols_count_time.count')
@@ -23,7 +23,7 @@ mixin PMRender(item, full)
                     != __('symbols_count_time.word')
         span(class="item" title=__('symbols_count_time.time'))
             span(class="icon")
-                i(class="ic i-clock")
+                i(class="fa fa-solid fa-clock")
             if full
                 span(class="text")
                     != __('symbols_count_time.time')

package/layout/_mixin/segment.pug

@@ -4,7 +4,7 @@ mixin SMRender(item)
     - var link1 = item.link || item.path
     - var gradient = theme?.experiments?.gradient
     if item.link
-        - var postTitleIcon = '<i class="ic i-link-alt"></i>'
+        - var postTitleIcon = '<i class="fa fa-solid fa-up-right-from-square"></i>'
     - var postText = item.title || item.link || __('post.untitled')
     article(class="item")
         if gradient
@@ -27,6 +27,6 @@ mixin SMRender(item)
                 div(class="meta footer")
                     span
                         - var lastcat = item.categories.last()
-                        != _url(lastcat.path, '<i class="ic i-flag"></i>' + lastcat.name, {itemprop: 'url', title: lastcat.name})
+                        != _url(lastcat.path, '<i class="fa fa-solid fa-flag"></i>' + lastcat.name, {itemprop: 'url', title: lastcat.name})
             != _url(link1, 'more...', {itemprop: 'url', title: postText, class: 'btn'})
 

package/layout/_mixin/sidebar.pug

@@ -25,12 +25,12 @@ mixin sidebarRender(display_toc)
             li(class="prev pjax")
                 if page && page.prev
                     if prevlink
-                        != _url(prevlink, '<i class="ic i-chevron-left"></i>', {rel: 'prev', title: __('post.prev')})
+                        != _url(prevlink, '<i class="fa fa-solid fa-chevron-left"></i>', {rel: 'prev', title: __('post.prev')})
             li(class="up")
-                i(class="ic i-arrow-up")
+                i(class="fa fa-solid fa-arrow-up")
             li(class="down")
-                i(class="ic i-arrow-down")
+                i(class="fa fa-solid fa-arrow-down")
             li(class="next pjax")
                 if nextlink
-                    != _url(nextlink, '<i class="ic i-chevron-right"></i>', {rel: 'next', title: __('post.next')})
+                    != _url(nextlink, '<i class="fa fa-solid fa-chevron-right"></i>', {rel: 'next', title: __('post.next')})
             li(class="percent")

package/layout/_mixin/widgets.pug

@@ -1,6 +1,6 @@
 mixin field(item)
     if item.link
-        - var postTitleIcon = '<i class="ic i-link-alt"></i>'
+        - var postTitleIcon = '<i class="fa fa-solid fa-up-right-from-square"></i>'
     li(class="item")
         +BCRender(item, false)
         - var postText = item.title || item.link || __('post.untitled')

package/layout/_partials/footer.pug

@@ -11,12 +11,12 @@ div(class="status")
     if theme.footer.count
         div(class="count")
             span(class="post-meta-item-icon")
-                i(class="ic i-chart-area")
+                i(class="fa fa-solid fa-chart-area")
             span(title=__('symbols_count_time.count_total'))
                 != `${ symbolsCountTotal(site) } ${__('symbols_count_time.word')}`
             span(class="post-meta-divider") |
             span(class="post-meta-item-icon")
-                i(class="ic i-coffee")
+                i(class="fa fa-solid fa-coffee")
             span(title=__('symbols_count_time.time_total'))
                 != symbolsTimeTotal(site, config.symbols_count_time.awl, config.symbols_count_time.wpm, __('symbols_count_time.time_minutes'))
             //- span(id="timeDate")

package/layout/_partials/head/head.pug

@@ -33,6 +33,7 @@ link(rel="alternate" type="application/json" title=siteTitle href=feedLink)
 if fontConfig
     != _vendor_font()
 != _css('app.css')
+link(rel="stylesheet" type="text/css" href="https://cdn.staticfile.org/font-awesome/6.2.1/css/all.min.css")
 - var debugVue = theme?.experiments?.debug
 if debugVue
     script(src="https://cdn.staticfile.org/vue/3.2.45/vue.global.js")

package/layout/_partials/header.pug

@@ -11,8 +11,8 @@ nav(id="nav")
                     != alternate || title
         ul(class="right" id="rightNav")
             li(class="item theme" @click="changeThemeByBtn")
-                i(class="ic" :class="{'i-sun': !themeStatus,'i-moon': themeStatus}")
+                i(class="fa fa-solid fa-sunrise")
             li(class="item search")
-                i(class="ic i-search")
+                i(class="fa fa-solid fa-magnifying-glass")
             != shokax_inject('rightNav')
 

package/layout/_partials/layout.pug

@@ -65,7 +65,7 @@ html(lang=page.language?page.language:config.language, style=theme.grayMode ? 'f
                     div(class="widgets")
                         +WRender
                     != partial('_partials/footer.pug', {}, {cache: true})
-        - var ccIcon = '<i class="ic i-creative-commons"></i>'
+        - var ccIcon = '<i class="fa fa-solid fa-creative-commons"></i>'
         - var ccText = theme.creative_commons.license.toUpperCase()
         <script data-config type="text/javascript" >
             | var LOCAL = {

package/layout/_partials/pagination.pug

@@ -1,4 +1,4 @@
 if page.prev || page.next
     nav(class="pagination")
         div(class="inner")
-            != paginator({prev_text: '<i class="ic i-angle-left" aria-label="' + __('accessibility.prev_page') + '"></i>',next_text: '<i class="ic i-angle-right" aria-label="' + __('accessibility.next_page') + '"></i>',mid_size : 1,escape   : false})
+            != paginator({prev_text: '<i class="fa fa-solid fa-angle-left" aria-label="' + __('accessibility.prev_page') + '"></i>',next_text: '<i class="fa fa-solid fa-angle-right" aria-label="' + __('accessibility.next_page') + '"></i>',mid_size : 1,escape   : false})

package/layout/_partials/post/copyright.pug

@@ -1,5 +1,5 @@
 if page.copyright !== false
-    - var ccIcon = '<i class="ic i-creative-commons"><em>(CC)</em></i>'
+    - var ccIcon = '<i class="fa fa-brands fa-creative-commons"><em>(CC)</em></i>'
     - var ccText = theme.creative_commons.license.toUpperCase()
     div(id="copyright")
         ul
@@ -7,7 +7,7 @@ if page.copyright !== false
                 strong
                     != __('post.copyright.author') + __('symbol.colon')
                 != page.author || author
-                i(class="ic i-at")
+                i(class="fa fa-solid fa-at")
                     em @
                 != title
             li(class="link")

package/layout/_partials/post/footer.pug

@@ -1,12 +1,12 @@
 div(class="meta")
     if date(post.date) != date(post.updated) || time(post.date) != time(post.updated)
         span(class="icon")
-            i(class="ic i-eye")
+            i(class="fa fa-solid fa-eye")
         span 此文章已被阅读次数:
         span(id="twikoo_visitors" class="waline-pageview-count" data-path=post.path) 正在加载...
         span(class="item")
             span(class="icon")
-                i(class="ic i-calendar-check")
+                i(class="fa fa-solid fa-calendar-check")
             span(class="text")
                 != __('post.edited')
             time(title=__('post.modified') + __('symbol.colon') + full_date(post.updated) itemprop="dateModified" datetime=moment(post.updated).format())

package/layout/_partials/post/nav.pug

@@ -1,7 +1,7 @@
 mixin navpost(item, type)
     - var postText = item.title || item.link || __('post.untitled')
     - var lastcat = item.categories.last()
-    - var itemlink=`<span class="type">${__('post.' + type)}</span><span class="category"><i class="ic i-flag"></i>${lastcat?.name}</span><h3>${ postText }</h3>`
+    - var itemlink=`<span class="type">${__('post.' + type)}</span><span class="category"><i class="fa fa-solid fa-flag"></i>${lastcat?.name}</span><h3>${ postText }</h3>`
     != _url(item.path, itemlink, {itemprop: 'url', rel: type, 'data-background-image': _cover(item), title: postText})
 
 div(class="post-nav")

package/layout/_partials/post/post.pug

@@ -17,7 +17,7 @@ article(itemscope itemtype="http://schema.org/Article" class="post block" lang=t
             div(class="tags")
                 each tag in post.tags.toArray()
                     a(href!=url_for(tag.path) rel="tag")
-                        i(class="ic i-tag")
+                        i(class="fa fa-solid fa-tag")
                         != tag.name
     footer
         != partial('_partials/post/footer.pug')

package/layout/_partials/post/reward.pug

@@ -1,7 +1,7 @@
 if page.reward !== false
     div(class="reward")
         button
-            i(class="ic i-heartbeat")
+            i(class="fa fa-solid fa-heart-pulse")
             != __('reward.donate')
         p
             != __('reward.text')

package/layout/archive.pug

@@ -103,7 +103,7 @@ block content
                                         a(href=url_for(cat.path)) #{cat.name}
                     div(class="title")
                         if post.link
-                            - var postTitleIcon = '<i class="ic i-link-alt"></i>'
+                            - var postTitleIcon = '<i class="fa fa-solid fa-up-right-from-square"></i>'
                             - var postText = post.title || post.link
                             != _url(post.link, postText + postTitleIcon, {class: 'external', itemprop: 'url'})
                         else

package/layout/category.pug

@@ -53,7 +53,7 @@ block content
                     ) #{date(post.date, 'MM-DD')}
                 div(class="title")
                     if post.link
-                        - var postTitleIcon = '<i class="ic i-link-alt"></i>'
+                        - var postTitleIcon = '<i class="fa fa-solid fa-up-right-from-square"></i>'
                         - var postText = post.title || post.link
                         != _url(post.link, postText + postTitleIcon, {class: 'external', itemprop: 'url'})
                     else

package/layout/page.pug

@@ -16,7 +16,7 @@ block title
 block header
     h1(itemprop="name headline")
         if page.link
-            - var postTitleIcon = '<i class="ic i-link-alt"></i>'
+            - var postTitleIcon = '<i class="fa fa-solid fa-up-right-from-square"></i>'
             - var postText = page.title || page.link
             != _url(page.link, postText + postTitleIcon, {class: 'link external', itemprop: 'url'})
         else

package/layout/post.pug

@@ -17,7 +17,7 @@ block title
 block header
     h1(itemprop="name headline")
         if page.link
-            - var postTitleIcon = '<i class="ic i-link-alt"></i>'
+            - var postTitleIcon = '<i class="fa fa-solid fa-up-right-from-square"></i>'
             - var postText = page.title || page.link
             != _url(page.link, postText + postTitleIcon, {class: 'link external', itemprop: 'url'})
         else

package/layout/tag.pug

@@ -33,7 +33,7 @@ block content
                                         != cat.name
                 div(class="title")
                     if post.link
-                        - var postTitleIcon = '<i class="ic i-link-alt"></i>'
+                        - var postTitleIcon = '<i class="fa fa-solid fa-up-right-from-square"></i>'
                         - var postText = post.title || post.link
                         != _url(post.link, postText + postTitleIcon, {class: 'external', itemprop: 'url'})
                     else

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-shokax",
-  "version": "0.0.3",
+  "version": "0.0.4-alpha",
   "description": "a hexo theme based on shoka",
   "main": "index.js",
   "repository": "https://github.com/zkz098/hexo-theme-shokaX",

package/source/css/_common/scaffolding/base.styl

@@ -145,6 +145,7 @@ input, textarea {
     src: url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono@2.242/fonts/webfonts/JetBrainsMono-Regular.woff2") format("woff2");
 }
 
+// TODO
 .ic {
   font-family: "ic" !important;
   -webkit-font-smoothing: antialiased;
@@ -158,15 +159,39 @@ input, textarea {
   line-height: 1;
 }
 
+.fa {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  width: 1.25em;
+  display: inline-block;
+  font-style: normal;
+  font-variant: normal;
+  text-rendering: auto;
+  line-height: 1;
+}
+
+// TODO
 .ic em {
   font-size: 0;
 }
 
+.fa em {
+  font-size: 0;
+}
+
+// TODO
 .ic-lg {
   font-size: 1.33333em;
   line-height: .75em;
   vertical-align: -.0667em;
 }
+
+.fa-lg {
+  font-size: 1.33333em;
+  line-height: .75em;
+  vertical-align: -.0667em;
+}
 //.weather {
 //      color: var(--text-color) !important;
 //}

package/source/js/_app/global.js

@@ -43,12 +43,7 @@ const autoDarkmode = function () {
             changeTheme('dark');
         }
         else {
-            if (window.matchMedia('(prefers-color-scheme:dark)').matches) {
-                changeTheme('dark');
-            }
-            else {
-                changeTheme();
-            }
+            changeTheme();
         }
     }
 };

package/source/js/_app/library.js

@@ -149,7 +149,7 @@ const getScript = function (url, callback, condition) {
     else {
         let script = document.createElement('script');
         script.onload = function (_, isAbort) {
-            if (isAbort || !script.readyState || /loaded|complete/.test(script.readyState)) {
+            if (isAbort || !script.readyState) {
                 console.log("abort!");
                 script.onload = null;
                 script = undefined;
@@ -288,7 +288,7 @@ const pjaxScript = function (element) {
     }
     parent.appendChild(script);
 };
-const pageScroll = function (target, offset, complete) {
+const pageScrollOld = function (target, offset, complete) {
     const opt = {
         targets: typeof offset === 'number' ? target.parentNode : document.scrollingElement,
         duration: 500,
@@ -300,3 +300,27 @@ const pageScroll = function (target, offset, complete) {
     };
     anime(opt);
 };
+const pageScroll = (target, offset, complete) => {
+    const opt = {
+        left: 0,
+        behavior: "smooth"
+    };
+    if (typeof target === "number") {
+        opt.top = target;
+    }
+    else {
+        if (typeof target === 'number') {
+            opt.top = offset || target;
+        }
+        else {
+            if (offset || target) {
+                opt.top = target.top() + document.documentElement.scrollTop - siteNavHeight;
+            }
+            else {
+                opt.top = 0;
+            }
+        }
+    }
+    scrollTo(opt);
+    complete && complete();
+};