hexo-theme-shokax 0.2.7 → 0.2.8

package/CONTRIBUTING.md

@@ -14,14 +14,10 @@
 1. 您同意我们在未来进行授权许可更改时包含您所贡献的代码
 2. 您有对于 shokaX 所使用的相关技术和 github PR 及 actions 的基础了解
 
-对于代码修改的说明:
-1. `page js` 仅需要修改ts文件，`hexo script` 请修改js文件
-
 有关提交的说明:
 1. 您在提交时的`commit message`应描述其改动
 2. 如果您提交的代码中包括图片资源，建议使用`webp`或`avif`格式
-3. 由于 Copilot 所生成的代码可能存在版权问题，如果您使用了 Copilot，请在 PR 正文中说明
-4. 条件允许的情况下代码应当附有注释以便维护
+3. 条件允许的情况下代码应当附有注释以便维护
 
 有关审查（Review）的说明:
 1. 您在 PR 时应打开允许维护者修改 PR，以便我们进行修改

package/_config.yml

@@ -74,6 +74,13 @@ loader:
   start: true # 进入页面时显示加载动画
   switch: false # 切换页面时显示加载动画
 
+# 使用polyfill.io自动处理浏览器兼容问题
+polyfill:
+  enable: true
+  features:
+    - default
+    - fetch
+
 # 显示的动画(烟花)
 fireworks:
   enable: true

package/layout/_partials/layout.pug

@@ -108,7 +108,9 @@ html(lang=page.language?page.language:config.language, style=theme.grayMode ? 'f
             ]
             };
 
-        script(src="https://polyfill.alicdn.com/polyfill.min.js")
+        if theme.polyfill.enable
+            script(src=`https://polyfill.io/v3/polyfill.min.js?features=${theme.polyfill.features}`)
+
         if theme.advVendors.enable
             each i in _list_vendor_js()
                 != _adv_vendor_js(i)

package/package.json

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

package/scripts/generaters/script.js

@@ -34,7 +34,6 @@ hexo.extend.generator.register('script', function (locals) {
         },
         loader: theme.loader,
         search: null,
-        valine: theme.valine,
         outime: {
             enable: theme.outime.enable,
             days: theme.outime.days

package/source/js/_app/components.js

@@ -156,8 +156,6 @@ const sidebarTOC = function () {
         return sections.indexOf(entry.target);
     };
     const createIntersectionObserver = function () {
-        if (!window.IntersectionObserver)
-            return;
         const observer = new IntersectionObserver(function (entries, observe) {
             const index = findIndex(entries) + (diffY < 0 ? 1 : 0);
             if (activeLock === null) {

package/source/js/_app/page.js

@@ -325,8 +325,6 @@ const postBeauty = function () {
     });
     const angleDown = document.querySelectorAll('.show-btn .i-angle-down');
     if (angleDown.length) {
-        if (!window.IntersectionObserver)
-            return;
         const io = new IntersectionObserver((entries) => {
             entries.forEach(entry => {
                 if (entry.isIntersecting) {
@@ -408,20 +406,15 @@ const loadComments = function () {
     else {
         goToComment.display('');
     }
-    if (!window.IntersectionObserver) {
+    const io = new IntersectionObserver(function (entries, observer) {
+        const entry = entries[0];
         vendorCss('valine');
-    }
-    else {
-        const io = new IntersectionObserver(function (entries, observer) {
-            const entry = entries[0];
-            vendorCss('valine');
-            if (entry.isIntersecting || entry.intersectionRatio > 0) {
-                transition($dom('#comments'), 'bounceUpIn');
-                observer.disconnect();
-            }
-        });
-        io.observe(element);
-    }
+        if (entry.isIntersecting || entry.intersectionRatio > 0) {
+            transition($dom('#comments'), 'bounceUpIn');
+            observer.disconnect();
+        }
+    });
+    io.observe(element);
 };
 const algoliaSearch = function (pjax) {
     if (CONFIG.search === null) {
@@ -563,8 +556,6 @@ const domInit = function () {
         });
     }
     const createIntersectionObserver = function () {
-        if (!window.IntersectionObserver)
-            return;
         new IntersectionObserver(([entry]) => {
             if (entry.isIntersecting) {
                 document.querySelectorAll('.parallax>use').forEach(i => {

package/source/css/_common/components/third-party/valine.styl

@@ -1,548 +0,0 @@
-.v {
-  &.wrap {
-    animation: none;
-    opacity: 0;
-  }
-
-  .lozaded {
-    animation: none;
-  }
-
-  input,
-  textarea {
-    border: none;
-    outline: none;
-    background: transparent;
-    font-size: $font-size-smallest;
-    transition: all .25s ease;
-  }
-
-  a {
-    color: var(--color-aqua);
-
-    &:hover {
-      color: var(--primary-color);
-    }
-  }
-
-  .text-center {
-    text-align: center;
-  }
-
-  .text-right {
-    text-align: right;
-  }
-
-  .float-right {
-    float: right !important;
-  }
-
-  .pd5 {
-    padding: 5px;
-  }
-
-  .pd10 {
-    padding: 10px;
-  }
-
-  .vemoji, .emoji, .tk-owo-emotion {
-    max-height: 1.5rem;
-    display: inline;
-    vertical-align: middle;
-  }
-
-  .submitting {
-    margin: 1em 0;
-  }
-
-  .form {
-    shadow-box();
-    margin-bottom: .625rem;
-    position: relative;
-    padding: .625rem;
-
-    >.inner {
-      .auth-section {
-        display: flex;
-        padding: .3em .6em;
-      }
-
-      +mobile-small() {
-        flex-wrap: wrap;
-      }
-
-      .input {
-        flex: 1 1 27%;
-        width: 27%;
-
-        +mobile-small() {
-          flex: 1 1 100%;
-          padding-right: 0;
-          width: 100%;
-        }
-
-        input {
-          padding: .625rem .3125rem;
-          width: 100%;
-          border-bottom: .0625rem dashed var(--grey-4);
-
-          &:focus {
-            border-bottom-color: var(--primary-color);
-          }
-        }
-      }
-
-      .textarea {
-        padding: .3em .6em;
-      }
-
-      .veditor {
-        width: 100%;
-        min-height: 8.75em;
-        font-size: $font-size-small;
-        line-height: 1.75;
-        resize: vertical;
-      }
-
-      .btn-group {
-        padding: .625rem 0;
-        display: flex;
-
-        .i-markdown {
-          font-size: $font-size-smallest;
-        }
-
-        .left {
-          width: 30%;
-        }
-
-        .right {
-          width: 70%;
-          text-align: right;
-        }
-      }
-
-      .vextra-area {
-        margin: .4em 0 .4em .5em;
-      }
-
-
-      .preview-box {
-        padding: .4375rem 1.25rem;
-        font-size: $font-size-smaller;
-        shadow-box();
-      }
-
-      .trigger-section {
-        display: none;
-      }
-    }
-
-    .smile-body {
-
-      img {
-        display: inline-block;
-        width: auto;
-        height: 3rem;
-        cursor: pointer;
-        padding: .5rem;
-        border-radius: .25rem;
-        transition: box-shadow .2s ease-out, background .2s ease-out;
-      }
-
-      li.active img, img:hover {
-        background: var(--grey-2);
-        box-shadow: 1px 1px 2px var(--grey-1), -1px -1px 2px var(--grey-4), inset 8px 8px 16px var(--grey-1), inset -8px -8px 16px var(--grey-3);
-      }
-
-      .smile-icons {
-        border-radius: .5rem;
-        margin: .3rem 0;
-        min-height: 10rem;
-        max-height: 10rem;
-        overflow: auto;
-        background: var(--grey-2);
-        padding: .5rem;
-      }
-
-      .smile-bar {
-        li {
-          display: inline-block;
-          margin-right: .25rem;
-        }
-
-        img {
-          width: 2.8rem;
-          height: 2.8rem;
-          background: var(--grey-2);
-          object-fit: contain;
-        }
-      }
-    }
-
-    .btn {
-      cursor: pointer;
-      display: inline-block;
-      margin: .5rem;
-      overflow: hidden;
-      vertical-align: middle;
-
-      &.actived .ic {
-        color: var(--primary-color);
-      }
-
-      .ic {
-        color: var(--grey-6);
-        transition: all .25s ease;
-
-        &:hover {
-          color: var(--color-blue);
-        }
-      }
-    }
-
-    .cancel-reply {
-      position: absolute;
-      right: 0;
-      top: 0;
-      z-index: 1;
-    }
-
-    .vsubmit {
-      font-size: $font-size-small;
-    }
-  }
-
-  .msg {
-    position: absolute;
-    background: var(--grey-1-a5);
-    width: 100%;
-    height: 100%;
-    left: 0;
-    top: 0;
-
-    .alert {
-      padding: 3em 0 0 0;
-
-      .text {
-        color: var(--grey-8);
-        padding: 15px;
-      }
-    }
-
-    +mobile() {
-      .alert {
-        padding: 8em 0;
-
-        .text {
-          padding: 10px;
-        }
-      }
-    }
-  }
-
-  .info {
-    padding: .3125rem;
-    font-weight: 600;
-    font-size: $font-size-larger;
-
-    .col {
-      display: inline-block;
-      padding: 0 20px;
-      position: relative;
-      background: transparent;
-      z-index: 2;
-
-      .count {
-        font-size: 1.375rem;
-        font-weight: inherit;
-      }
-    }
-  }
-
-
-
-  .next {
-    .more {
-      cursor: pointer;
-      margin: 1em 0;
-    }
-  }
-
-  .list {
-    width: 100%;
-  }
-  .item {
-    word-break: break-all;
-    padding-top: 1.25em;
-
-    .avatar {
-      width: 3.125em;
-      height: 3.125em;
-      float: left;
-      border-radius: 50%;
-      margin-right: .7525em;
-      border: .0625rem solid var(--grey-3);
-      padding: .125em
-    }
-
-    &:hover .avatar {
-      animation: .8s ease-out 0s 1 normal both running shake;
-    }
-
-    .main {
-      overflow: hidden;
-      padding-bottom: .5em;
-      border-bottom: .0625rem dashed var(--grey-3);
-    }
-
-    .head, .meta {
-      color: var(--grey-5);
-      line-height: 1.8;
-    }
-
-    .name {
-      margin-right: .875rem;
-    }
-
-    .tag, .system, .time {
-      display: inline-block;
-      font-size: $font-size-smallest;
-    }
-
-    +mobile-small() {
-      .system span {
-        display: none;
-      }
-    }
-    .tag {
-      border-radius: .125rem;
-      color: var(--grey-1);
-      padding: 0 .3125rem;
-      margin-right: .5rem;
-      background-color: var(--color-grey);
-
-      $tagcolor = hexo-config('valine.tagColor');
-
-      for type in $tagcolor {
-        &.{slice(type, 0, 1)} {
-          background-color: unquote(slice(type, 1));
-        }
-      }
-    }
-
-    .at {
-      color: var(--primary-color);
-
-      &:hover {
-        color: var(--color-aqua);
-      }
-    }
-
-    .meta {
-      line-height: 1;
-      .at {
-        float: right;
-      }
-    }
-
-    .content {
-      margin-bottom: .75em;
-      padding: .625em;
-
-      > .inner {
-        font-size: $font-size-small;
-        word-wrap: break-word;
-        word-break: break-all;
-        line-height: 2;
-        position: relative;
-
-        &.expand {
-          cursor: pointer;
-          max-height: 8em;
-
-          overflow: hidden;
-
-          &::before {
-            display: block;
-            content: "";
-            position: absolute;
-            width: 100%;
-            left: 0;
-            top: 0;
-            bottom: 3.15em;
-            background: linear-gradient(180deg, var(--grey-1-a0), var(--grey-1));
-            z-index: 999;
-          }
-
-          &::after {
-            display: block;
-            content: attr(data-expand);
-            text-align: center;
-            position: absolute;
-            width: 100%;
-            height: 3.15em;
-            line-height: 3.15em;
-            left: 0;
-            bottom: 0;
-            z-index: 999;
-            background: var(--grey-1);
-          }
-        }
-      }
-
-      .form {
-        margin-top: 1rem;
-      }
-    }
-
-    &:last-child .main {
-      border-bottom: none
-    }
-
-    .children {
-      padding-left: 1em;
-      border-left: .0625rem dashed var(--grey-3);
-
-      .avatar {
-        width: 2.225em;
-        height: 2.225em
-      }
-    }
-  }
-
-    .empty {
-      padding: 20px;
-      text-align: center;
-    }
-
-
-  /************ Loading ************/
-  .spinner {
-    margin: 10px auto;
-    width: 50px;
-    height: 30px;
-    text-align: center;
-    font-size: 10px;
-  }
-
-  .spinner>div {
-    background-color: var(--primary-color);
-    height: 100%;
-    width: 6px;
-    margin-right: 3px;
-    display: inline-block;
-    animation: sk-stretchdelay 1.2s infinite ease-in-out;
-  }
-
-  .spinner .r2 {
-    animation-delay: -1.1s;
-  }
-
-  .spinner .r3 {
-    animation-delay: -1s;
-  }
-
-  .spinner .r4 {
-    animation-delay: -0.9s;
-  }
-
-  .spinner .r5 {
-    animation-delay: -0.8s;
-  }
-
-  @keyframes sk-stretchdelay {
-
-    0%,
-    40%,
-    100% {
-      transform: scaleY(0.4);
-    }
-
-    20% {
-      transform: scaleY(1);
-    }
-  }
-}
-
-.hljs-comment,
-.hljs-quote {
-  color: var(--grey-5);
-  font-style: italic;
-}
-
-.hljs-keyword,
-.hljs-selector-tag,
-.hljs-subst,
-.hljs-meta {
-  color: var(--grey-7);
-  font-weight: bold;
-}
-
-.hljs-number,
-.hljs-literal,
-.hljs-variable,
-.hljs-template-variable,
-.hljs-tag .hljs-attr {
-  color: var(--color-green);
-}
-
-.hljs-string,
-.hljs-doctag {
-  color: var(--color-red);
-}
-
-.hljs-title,
-.hljs-section,
-.hljs-selector-id {
-  color: var(--color-pink);
-  font-weight: bold;
-}
-
-.hljs-subst {
-  font-weight: normal;
-}
-
-.hljs-type,
-.hljs-class .hljs-title {
-  color: var(--color-grey);
-  font-weight: bold;
-}
-
-.hljs-tag,
-.hljs-name,
-.hljs-attribute {
-  color: var(--color-orange);
-  font-weight: normal;
-}
-
-.hljs-regexp,
-.hljs-link {
-  color: var(--color-green);
-}
-
-.hljs-symbol,
-.hljs-bullet {
-  color: var(--color-purple);
-}
-
-.hljs-built_in,
-.hljs-builtin-name {
-  color: var(--color-aqua);
-}
-
-.hljs-deletion {
-  background: #fdd;
-}
-
-.hljs-addition {
-  background: #dfd;
-}
-
-.hljs-emphasis {
-  font-style: italic;
-}
-
-.hljs-strong {
-  font-weight: bold;
-}