hexo-theme-stellar 1.32.3 → 1.33.0

package/source/css/_components/partial/paginator.styl

@@ -6,7 +6,7 @@
   font-size: 1rem
   font-weight: 700
   background: var(--card)
-  border-radius: $border-card
+  border-radius: $border-card-l
   overflow: hidden
   box-shadow: 0 2px 8px 0px rgba(0, 0, 0, 0.03)
   color: var(--text-p3)

package/source/css/_components/tag-plugins/friends.styl

@@ -13,7 +13,7 @@
     align-items: center
     text-align: center
     line-height: 1.2
-    border-radius: 4px
+    border-radius: $border-button
     overflow: hidden
     position: relative
     padding: 1rem 0.5rem

package/source/css/_components/tag-plugins/image.styl

@@ -22,6 +22,7 @@
     img
       display: block
       object-fit: cover
+      border-radius: $border-image
     .image-download
       position: absolute
       bottom: 8px

package/source/css/_components/tag-plugins/rating.styl

@@ -0,0 +1,39 @@
+.tag-plugin.ds-rating
+  text-align: center
+.tag-plugin.ds-rating .header
+  margin: .5rem
+  font-weight: 500
+  color: var(--text)
+.tag-plugin.ds-rating .body
+  display: flex
+  align-items: center
+  justify-content: center
+  button
+    color: var(--text-p1)
+    font-size: 1rem
+    padding: 0
+    border-radius: $border-button
+    display: flex
+    svg
+      font-size: 1.5em
+      margin: 4px
+    img
+      margin: 4px
+    trans1 all
+    color: var(--theme)
+    opacity: 0.2
+    &:hover,&.hover,&.preview
+      opacity: 1
+  span
+    line-height: 1
+    font-size: 1em
+    margin: 4px
+
+.tag-plugin.ds-rating .footer
+  margin: .5rem
+  color: var(--text-p3)
+  font-weight: 500
+  font-size: $fs-12
+
+.tag-plugin.ds-rating.rated
+  pointer-events: none

package/source/css/_components/tag-plugins/timeline.styl

@@ -102,7 +102,7 @@
   .tag-plugin.copy
     width: 240px
 
-.tag-plugin.timeline[api]
+.tag-plugin.timeline[data-api]
   a.body
     display: block
     color: var(--text-p1)
@@ -112,7 +112,7 @@
     font-size: var(--fsp)
 
 
-.tag-plugin.timeline[api] .body
+.tag-plugin.timeline[data-api] .body
   p.title
     font-weight: 700
     margin: 0.5rem 0 0.75rem
@@ -149,7 +149,10 @@
   pre code 
     font-size: $fs-13
 
-.tag-plugin.timeline[api] .body .footer
+aside .tag-plugin.timeline[data-api] .body .lazy-box
+  border-radius: $border-image-s
+
+.tag-plugin.timeline[data-api] .body .footer
   margin: 0 0 -0.5rem
   padding: 0.5rem 0 1rem
   user-select: none
@@ -170,7 +173,7 @@
   .left+.right
     margin-left: 4px
 
-.tag-plugin.timeline[api] .body .footer
+.tag-plugin.timeline[data-api] .body .footer
   .item
     border-width: 1px
     border-style: solid

package/source/css/_components/tag-plugins/vote.styl

@@ -0,0 +1,49 @@
+.tag-plugin.ds-vote
+  text-align: center
+.tag-plugin.ds-vote .header
+  margin: .5rem
+  font-weight: 500
+  color: var(--text)
+.tag-plugin.ds-vote .body
+  width 50%
+  min-width: 240px
+  max-width: 320px
+  margin: 1rem auto
+  display: grid
+  grid-template-columns: 1fr 1fr
+  grid-gap: 2rem
+  button
+    color: var(--text-p1)
+    font-size: 1rem
+    display: inline-flex
+    flex-direction: column
+    align-items: center
+    justify-content: center
+    padding: .5rem
+    background: var(--block)
+    border-radius: $border-button
+    font-weight: 500
+    svg
+      font-size: 1.5em
+      margin: 8px
+    span
+      line-height: 1
+      font-size: 1em
+      margin-bottom: 4px
+    trans1 all
+    color: var(--theme)
+    background: var(--theme-a10)
+    @media (prefers-color-scheme: dark)
+      background: var(--theme-a20)
+    &.vote-up
+      x-set-theme-with-color($c-green)
+    &.vote-down
+      x-set-theme-with-color($c-red)
+    &:hover,&.active
+      color: white
+      background: var(--theme)
+
+
+// 已经投过票了
+.tag-plugin.ds-vote.voted
+  pointer-events: none

package/source/css/_components/widgets/timeline.styl

@@ -36,7 +36,7 @@
         background: var(--bg-a50)
       
       
-  .tag-plugin.timeline[api] .body .footer
+  .tag-plugin.timeline[data-api] .body .footer
     background: none
 
 .l_left .widget-wrapper.timeline

package/source/css/_defines/theme_base.styl

@@ -13,6 +13,7 @@ x-set-theme-with-color($color)
   --light: lightness($color)
   --alpha: alpha($color)
   --theme: x-theme-alpha(1)
+  --theme-a10: x-theme-alpha(0.1)
   --theme-a20: x-theme-alpha(0.2)
   --theme-a30: x-theme-alpha(0.3)
 

package/source/css/_plugins/comments/artalk.styl

@@ -8,6 +8,8 @@
       border-bottom: 1px dashed var(--block-border)
       padding: 0.5rem 1rem
       margin: 0
+      .atk-editor-user
+        padding: 0
     .atk-editor-user-wrap:empty
       visibility: hidden
       padding: 0
@@ -67,6 +69,10 @@
       height: 3rem
       width: 12rem
       margin: -1.5rem auto 0
+      &:hover
+        background: var(--card)
+  .atk-list-footer .atk-copyright
+    padding: 1rem
   .atk-error-layer
     background: none
 
@@ -95,16 +101,52 @@
     --at-color-green: $c-green
     --at-color-gradient: linear-gradient(180deg, transparent, var(--card), 50%, var(--card))
 
-.md-text .atk-comment>.atk-main>.atk-body
-  overflow: visible
-.md-text .artalk pre code, .atk-layer-wrap pre code
-  background: none
-.md-text .atk-main-editor>.atk-textarea-wrap>.atk-textarea
-  background: none
 
-.md-text .atk-notify-wrap .atk-notify
-  border-radius: $border-bar
-  margin: 8px
+// fix style
+.cmt-body.artalk
+  .atk-comment>.atk-main>.atk-body
+    overflow: visible
+  .artalk pre code, .atk-layer-wrap pre code
+    background: none
+  .atk-main-editor>.atk-textarea-wrap>.atk-textarea
+    background: none
+    padding: 1rem
+    margin: 0
+    border: none
+
+  .atk-loading
+    border-radius: $border-card
+  .atk-main-editor .atk-editor-user-wrap .atk-editor-user .atk-user-profile-btn
+    padding: 0
+  &:hover
+    background: none
+  
+  .artalk>.atk-list>.atk-list-header 
+    padding: .5rem 1rem
+    .atk-comment-count
+      display: flex
+      align-items: baseline
+  .artalk>.atk-list>.atk-list-header .atk-dropdown-wrap .atk-arrow-down-icon
+    height: 8px
+  .artalk>.atk-list>.atk-list-header .atk-text
+    display: block
+
+  .atk-notify-wrap .atk-notify
+    border-radius: $border-bar
+    margin: 8px
+  
+  // emoticons
+  .atk-editor-plug-emoticons>.atk-grp-wrap>.atk-grp
+    padding: .5rem
+    margin-bottom: 32px
+  .atk-editor-plug-emoticons>.atk-grp-wrap>.atk-grp[data-type=image]>.atk-item
+    width 3rem
+    height: 3rem
+    margin: 0
+    border-radius: 4px
+    padding: .5rem
+    >img
+      border-radius: 4px
 
 
 // override
@@ -118,11 +160,12 @@
       border-radius: $border-image-s
   a>img
     display: inline
-  p>img[atk-emoticon]
+  img[atk-emoticon]
     max-height: 1.5em
     transform: scale(1.2)
     margin: 0 4px
     vertical-align: bottom
+    border-radius: 4px
   ul li, ol li
     font-size: $fs-14
   blockquote

package/source/css/_plugins/lazyload.styl

@@ -1,9 +1,13 @@
 $lazyTransitionType = hexo-config('plugins.lazyload.transition')
 $loadingImageSize = 2rem
 
+img:not([src])
+  visibility: hidden
+
 .lazy-box
   position: relative
   overflow: hidden
+  line-height: 0
   &.async // 通过 data-service 异步创建的懒加载元素，没办法知道宽高
     background: var(--block)
     min-height: 4rem

package/source/js/main.js

@@ -229,20 +229,27 @@ const init = {
       document.body.appendChild(notice);
     }
     if (!canonical.originalHost) return;
+    const currentURL = new URL(window.location.href);
+    const currentHost = currentURL.hostname.replace(/^www\./, '');
+    if (currentHost == 'localhost') return;
+    const encodedCurrentHost = window.btoa(currentHost);
+    const isCurrentHostValid = canonical.encoded === encodedCurrentHost;
     const canonicalTag = document.querySelector('link[rel="canonical"]');
     if (!canonicalTag) {
+      if (isCurrentHostValid) {
+        return;
+      }
+      if (canonical.officialHosts?.includes(currentHost)) {
+        showTip(true);
+        return;
+      }
       showTip(false);
       return;
     }
     const canonicalURL = new URL(canonicalTag.href);
-    const currentURL = new URL(window.location.href);
     const canonicalHost = canonicalURL.hostname.replace(/^www\./, '');
-    const currentHost = currentURL.hostname.replace(/^www\./, '');
-    if (currentHost == 'localhost') return;
     const encodedCanonicalHost = window.btoa(canonicalHost);
-    const encodedCurrentHost = window.btoa(currentHost);
     const isCanonicalHostValid = canonical.encoded === encodedCanonicalHost;
-    const isCurrentHostValid = canonical.encoded === encodedCurrentHost;
     if (isCanonicalHostValid && isCurrentHostValid) {
       return;
     }

package/source/js/search/local-search.js

@@ -48,7 +48,9 @@ var searchFunc = function(path, filter, wrapperId, searchId, contentId) {
         var dataContent = data.content;
         var dataContentLowerCase = dataContent.toLowerCase();
         var dataUrl = data.path.startsWith('//') ? data.path.slice(1) : data.path;
-
+        dataUrl = dataUrl.replace(/\/?index\.html$/, '/'); // index.html → /
+        dataUrl = dataUrl.replace(/\.html$/, '/'); // xxx.html → xxx/
+        
         var indexTitle = -1;
         var indexContent = -1;
         var firstOccur = -1;

package/source/js/services/artalk_latest_comment.js

@@ -5,7 +5,7 @@ utils.jq(() => {
         const el = els[i];
         const limit = parseInt(el.getAttribute('limit')) || 10;
   
-        const api = el.getAttribute('api') + '&limit=' + limit;
+        const api = el.dataset.api + '&limit=' + limit;
         if (api == null) {
           continue;
         }

package/source/js/services/contributors.js

@@ -0,0 +1,56 @@
+utils.jq(() => {
+  $(function () {
+    function parseGithubFileContributors(data) {
+      // 去重贡献者（按 login）
+      const contributorsMap = new Map();
+
+      for (const commit of data) {
+        const author = commit.author;
+        if (author) {
+          const login = author.login;
+          if (!contributorsMap.has(login)) {
+            contributorsMap.set(login, {
+              login: login,
+              avatar_url: author.avatar_url,
+              html_url: author.html_url,
+              count: 1
+            });
+          } else {
+            contributorsMap.get(login).count++;
+          }
+        }
+      }
+      // 转为数组并按提交次数排序（降序）
+      const sortedContributors = Array.from(contributorsMap.values())
+        .sort((a, b) => b.count - a.count);
+      return sortedContributors;
+    }
+
+    const els = document.getElementsByClassName('ds-contributors');
+    for (var i = 0; i < els.length; i++) {
+      const el = els[i];
+      const api = el.dataset.api;
+      if (api == null) {
+        continue;
+      }
+      const default_avatar = def.avatar;
+      // layout
+      utils.request(el, api, async resp => {
+        const data = await resp.json();
+        const list = parseGithubFileContributors(data);
+        for (let item of list) {
+          var cell = `<div class="grid-cell user-card">`;
+          cell += `<a class="card-link" target="_blank" rel="external nofollow noopener noreferrer" href="${item.html_url || item.url}">`;;
+          cell += `<img src="${item.avatar_url || item.avatar || item.icon || default_avatar}" onerror="javascript:this.removeAttribute(\'data-src\');this.src=\'${default_avatar}\';"/>`;
+          cell += `<div class="name image-meta">`;
+          cell += `<span class="image-caption">${item.title || item.login}</span>`;
+          cell += `</div>`;
+          cell += `</a>`;
+          cell += `</div>`;
+          $(el).find('.grid-box').append(cell);
+        }
+        window.wrapLazyloadImages(el);
+      });
+    }
+  });
+});

package/source/js/services/fcircle.js

@@ -3,7 +3,7 @@ utils.jq(() => {
     const els = document.getElementsByClassName('ds-fcircle');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
-      const api = el.getAttribute('api');
+      const api = el.dataset.api;
       if (api == null) {
         continue;
       }

package/source/js/services/friends.js

@@ -3,7 +3,7 @@ utils.jq(() => {
     const els = document.getElementsByClassName('ds-friends');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
-      const api = el.getAttribute('api');
+      const api = el.dataset.api;
       if (api == null) {
         continue;
       }

package/source/js/services/friends_and_posts.js

@@ -3,7 +3,7 @@ utils.jq(() => {
     const els = document.getElementsByClassName('ds-friends_and_posts');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
-      const api = el.getAttribute('api');
+      const api = el.dataset.api;
       if (api == null) {
         continue;
       }

package/source/js/services/ghinfo.js

@@ -3,7 +3,7 @@ utils.jq(() => {
     const els = document.getElementsByClassName('ds-ghinfo');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
-      const api = el.getAttribute('api');
+      const api = el.dataset.api;
       if (api == null) {
         continue;
       }

package/source/js/services/giscus_latest_comment.js

@@ -3,7 +3,7 @@ utils.jq(() => {
       const els = document.getElementsByClassName('ds-giscus');
       for (var i = 0; i < els.length; i++) {
         const el = els[i];
-        const api = el.getAttribute('api');
+        const api = el.dataset.api;
         if (api == null) {
           continue;
         }

package/source/js/services/memos.js

@@ -2,7 +2,7 @@ utils.jq(() => {
   const els = Array.from(document.getElementsByClassName('ds-memos'));
 
   els.forEach(el => {
-    const api = el.getAttribute('api');
+    const api = el.dataset.api;
     if (!api) return;
 
     const default_avatar = el.getAttribute('avatar') || def.avatar;

package/source/js/services/rating.js

@@ -0,0 +1,142 @@
+function getRatingKey(id) {
+  return `rating-${id}`;
+}
+
+function hasRated(id) {
+  return !!localStorage.getItem(getRatingKey(id));
+}
+
+function getRatedValue(id) {
+  return parseInt(localStorage.getItem(getRatingKey(id)) || '0');
+}
+
+function storeRating(id, value) {
+  localStorage.setItem(getRatingKey(id), value);
+}
+
+function clearHover(el) {
+  el.querySelectorAll('.star').forEach(s => s.classList.remove('hover'));
+}
+
+function updatePreview(el, avg) {
+  const rounded = Math.floor(avg);
+  el.querySelectorAll('.star').forEach(s => {
+    const v = parseInt(s.dataset.value);
+    s.classList.toggle('preview', v <= rounded);
+  });
+}
+
+function setupHoverEffect(el) {
+  const stars = el.querySelectorAll('.star');
+  if (!stars.length) return;
+
+  stars.forEach(star => {
+    const value = parseInt(star.dataset.value);
+
+    star.addEventListener('mouseenter', () => {
+      stars.forEach(s => {
+        s.classList.remove('preview');
+        const v = parseInt(s.dataset.value);
+        s.classList.toggle('hover', v <= value);
+      });
+    });
+
+    star.addEventListener('mouseleave', () => {
+      clearHover(el);
+      // 恢复平均分预览
+      const avg = parseFloat(el.querySelector('.avg')?.textContent.replace(/[()]/g, '') || '0');
+      updatePreview(el, avg);
+    });
+  });
+}
+
+function calculateAverage(rating = {}) {
+  const validScores = Object.entries(rating).filter(([k]) => !isNaN(Number(k)));
+  const total = validScores.reduce((sum, [k, c]) => sum + Number(k) * c, 0);
+  const votes = validScores.reduce((sum, [, c]) => sum + c, 0);
+  return votes > 0 ? (total / votes).toFixed(1) : '0.0';
+}
+
+async function loadRating(el) {
+  const id = el.dataset.id;
+  const api = el.dataset.api;
+  if (!id || !api) return;
+
+  try {
+    const res = await fetch(`${api}/info?id=${encodeURIComponent(id)}`);
+    const data = await res.json();
+    const rating = data.rating || {};
+    const avg = calculateAverage(rating);
+
+    // 计算评分人数
+    const validScores = Object.entries(rating).filter(([k]) => !isNaN(Number(k)));
+    const totalVotes = validScores.reduce((sum, [, c]) => sum + c, 0);
+
+    // 设置平均分
+    let avgEl = el.querySelector('.avg');
+    if (!avgEl) {
+      avgEl = document.createElement('span');
+      avgEl.className = 'avg';
+      el.appendChild(avgEl);
+    }
+    avgEl.textContent = `(${avg})`;
+
+    // 设置评分人数
+    let countEl = el.querySelector('.count');
+    if (!countEl) {
+      countEl = document.createElement('span');
+      countEl.className = 'count';
+      el.appendChild(countEl);
+    }
+    countEl.textContent = `${totalVotes}`;
+
+    updatePreview(el, avg);
+  } catch (e) {
+    console.warn(`[rating] 加载失败: id=${id}`, e);
+  }
+}
+
+async function submitRating(el, value) {
+  const id = el.dataset.id;
+  const api = el.dataset.api;
+  if (!id || !api || hasRated(id)) return;
+
+  storeRating(id, value);
+  el.classList.add('rated');
+
+  try {
+    await fetch(`${api}/update?id=${encodeURIComponent(id)}&value=${value}`, {
+      method: 'POST'
+    });
+    loadRating(el);
+  } catch (e) {
+    console.warn(`[rating] 提交失败: id=${id}`, e);
+  }
+}
+
+function initRatings() {
+  document.querySelectorAll('.ds-rating').forEach(el => {
+    const { id, api } = el.dataset;
+    if (!id || !api) return;
+
+    loadRating(el);
+    setupHoverEffect(el);
+
+    if (hasRated(id)) {
+      el.classList.add('rated');
+    }
+
+    el.querySelectorAll('.star').forEach(star => {
+      const value = star.dataset.value;
+      star.addEventListener('click', () => {
+        if (!hasRated(id)) submitRating(el, value);
+      });
+    });
+  });
+}
+
+if (document.readyState === 'loading') {
+  window.addEventListener('DOMContentLoaded', initRatings);
+} else {
+  initRatings();
+}

package/source/js/services/siteinfo.js

@@ -6,7 +6,7 @@ function setCardLink(nodes) {
     // If it is not a tag element then it is not processed
     if (el.nodeType !== 1) return;
     el.removeAttribute('cardlink');
-    const api = el.getAttribute('api');
+    const api = el.dataset.api;
     if (api == null) return;
     fetch(api).then(function(response) {
       if (response.ok) {

package/source/js/services/sites.js

@@ -3,7 +3,7 @@ utils.jq(() => {
     const els = document.getElementsByClassName('ds-sites');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
-      const api = el.getAttribute('api');
+      const api = el.dataset.api;
       if (api == null) {
         continue;
       }

package/source/js/services/timeline.js

@@ -13,7 +13,7 @@ utils.jq(() => {
     const timelines = document.getElementsByClassName('ds-timeline');
     for (var i = 0; i < timelines.length; i++) {
       const el = timelines[i];
-      const api = el.getAttribute('api');
+      const api = el.dataset.api;
       if (api == null) {
         continue;
       }

package/source/js/services/twikoo_latest_comment.js

@@ -3,7 +3,7 @@ utils.jq(() => {
       const el = document.querySelector('.ds-twikoo');
       utils.onLoading(el); // 加载动画
   
-      const api = el.getAttribute('api');
+      const api = el.dataset.api;
       const limit = parseInt(el.getAttribute('limit')) || 10;
       const reply = el.getAttribute('hide') !== 'reply';
       if (!api) return;