hexo-theme-gnix 13.0.0 → 14.0.0

package/layout/common/navbar.jsx

@@ -13,7 +13,6 @@ const renderLinkIcon = (link) => {
       </svg>
     );
   }
-  return <iconify-icon icon={link.icon}></iconify-icon>;
 };
 
 function getTargetLanguageKey(config, currentLanguageKey) {
@@ -57,8 +56,7 @@ function getLanguageSwitch(site, page, config, helper) {
   const mode = !url && isDocumentPage ? "missing" : "link";
 
   if (!url && mode === "link") {
-    const targetPath = page?.current > 1 ? "/" : (page?.path || "/");
-    url = helper.localized_url_for(targetPath, targetLanguageKey);
+    url = helper.localized_url_for(page?.path || "/", targetLanguageKey);
   }
 
   return {
@@ -89,7 +87,7 @@ class Navbar extends Component {
       <Fragment>
         <nav class="navbar navbar-main">
           <div class="navbar-container" onclick="toggleNav(event)">
-            <a id="navbar-logo-link" href={siteUrl} style={"font-family: homemade-apple; color: var(--text); display: flex; align-items: center; padding: 0 1em;"}>
+            <a id="navbar-logo-link" class="navbar-logo" href={siteUrl}>
               GnixAij
             </a>
             <div class="navbar-menu">
@@ -119,14 +117,19 @@ class Navbar extends Component {
                   </Fragment>
                 ) : null}
                 {languageSwitch ? (
-                  <Fragment>
-                    <a id="language-switch-link" class="navbar-item" href={languageSwitch.url || '#'} title={languageSwitch.title} aria-label={languageSwitch.title} lang={languageSwitch.locale} hreflang={languageSwitch.locale} style={languageSwitch.mode === 'link' ? '' : 'display:none'}>
-                      {languageIcon}
-                    </a>
-                    <button id="language-switch-button" type="button" class="navbar-item" title={languageSwitch.title} aria-label={languageSwitch.title} lang={languageSwitch.locale} data-toast-message={languageSwitch.unavailableMessage} onclick="window.showSiteToast?.(this.dataset.toastMessage); return false;" style={languageSwitch.mode === 'missing' ? '' : 'display:none'}>
-                      {languageIcon}
-                    </button>
-                  </Fragment>
+                  <a
+                    id="language-switch"
+                    class="navbar-item"
+                    href={languageSwitch.url || "#"}
+                    title={languageSwitch.title}
+                    aria-label={languageSwitch.title}
+                    lang={languageSwitch.locale}
+                    hreflang={languageSwitch.locale}
+                    data-mode={languageSwitch.mode}
+                    data-toast-message={languageSwitch.unavailableMessage}
+                  >
+                    {languageIcon}
+                  </a>
                 ) : null}
                 <button type="button" class="navbar-item" title="Choose Theme" popovertarget="theme-selector-popover">
                   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">

package/layout/common/scripts.jsx

@@ -10,9 +10,9 @@ module.exports = class extends Component {
       <Fragment>
         <Plugins site={site} config={config} page={page} helper={helper} head={false} />
         <Swup head={false} />
-        <script defer src="/js/host/iconify-icon/3.0.2/iconify-icon.min.js"></script>
         <script defer src="/js/theme-selector.js"></script>
         <script defer src="/js/host/medium-zoom/dist/medium-zoom.min.js"></script>
+        <script defer src="/js/components/archive-popup.js"></script>
         <script defer src="/js/main.js"></script>
         {page.encrypt ? <script src="/js/decrypt.js" type="module"></script> : null}
         <script async src="/js/instant-page.min.js" type="module"></script>

package/layout/layout.jsx

@@ -25,22 +25,23 @@ function buildLangSwitchScript(site, page, config, helper) {
         mode: lswitch.mode,
         url: lswitch.url || "",
         locale: lswitch.locale,
+        title: lswitch.title,
+        unavailableMessage: lswitch.unavailableMessage,
       })
     : "null";
 
   return `<script data-swup-reload-script>
     (function() {
       var d = ${payload};
-      var l = document.getElementById('language-switch-link');
-      var b = document.getElementById('language-switch-button');
-      if (l || b) {
-        if (d && d.mode === 'link' && d.url) {
-          if (l) { l.href = d.url; l.style.display = ''; l.setAttribute('lang', d.locale); l.setAttribute('hreflang', d.locale); }
-          if (b) b.style.display = 'none';
-        } else {
-          if (l) l.style.display = 'none';
-          if (b) { b.style.display = ''; b.setAttribute('lang', d.locale); }
-        }
+      var el = document.getElementById('language-switch');
+      if (el && d) {
+        el.href = d.mode === 'link' && d.url ? d.url : '#';
+        el.title = d.title;
+        el.setAttribute('aria-label', d.title);
+        el.setAttribute('lang', d.locale);
+        el.setAttribute('hreflang', d.locale);
+        el.dataset.mode = d.mode;
+        el.dataset.toastMessage = d.unavailableMessage;
       }
       var menu = ${JSON.stringify(menu)};
       Object.keys(menu).forEach(function(name) {
@@ -51,7 +52,7 @@ function buildLangSwitchScript(site, page, config, helper) {
       var logo = document.getElementById('navbar-logo-link');
       if (logo) logo.href = ${JSON.stringify(siteUrl)};
     })();
-  <\/script>`;
+  </script>`;
 }
 
 module.exports = class extends Component {

package/layout/tag.jsx

@@ -1,75 +1,8 @@
-const { Component, Fragment } = require("../include/util/common");
-const Index = require("./index");
-
-const breadcrumb_css = `
-  /* 定义闪烁动画 */
-  @keyframes blink {
-    0%, 100% { opacity: 1; }
-    50% { opacity: 0; }
-  }
-
-  .breadcrumb {
-    color: var(--blue);
-    white-space: nowrap;
-    font-family: var(--font-mono);
-
-    a {
-      align-items: center;
-      display: flex;
-      justify-content: center;
-      padding: 0 0.1em;
-    }
-
-    ul {
-      padding-inline-start: 1em;
-      align-items: flex-start;
-      display: flex;
-      flex-wrap: wrap;
-      justify-content: flex-start;
-    }
-
-    li {
-      align-items: center;
-      display: flex;
-      a {
-        color: var(--yellow);
-      }
-    }
-
-    .cursor {
-      display: inline-block;
-      color: var(--mauve);
-      font-weight: bold;
-      margin-left: 2px;
-      animation: blink 1s step-end infinite;
-    }
-  }`;
+const { Component } = require("../include/util/common");
+const Archive = require("./archive");
 
 module.exports = class extends Component {
   render() {
-    const { config, page, helper } = this.props;
-    const { _p } = helper;
-    const langKey = helper.language_key(page);
-
-    return (
-      <Fragment>
-        <style>{breadcrumb_css}</style>
-        <nav class="breadcrumb" aria-label="breadcrumbs">
-          <ul>
-            <li>
-              <font style="color: var(--green)">$</font>&nbsp;ls&nbsp;
-              <a href={helper.localized_url_for("/tags/", langKey)}>{_p("common.tag", Infinity)}/</a>
-            </li>
-            <li>
-              <a href="#" aria-current="page" style="cursor: default; pointer-events: none; color: var(--mauve);">
-                {page.tag}
-              </a>
-              <span class="cursor">_</span>
-            </li>
-          </ul>
-        </nav>
-        <Index config={config} page={page} helper={helper} />
-      </Fragment>
-    );
+    return <Archive {...this.props} />;
   }
 };

package/layout/tags.jsx

@@ -1,6 +1,23 @@
 const { Component, Fragment, cacheComponent } = require("../include/util/common");
 const { filterByLanguage } = require("../include/util/i18n");
 
+function toRoman(num) {
+  const map = [
+    [1000, "M"], [900, "CM"], [500, "D"], [400, "CD"],
+    [100, "C"], [90, "XC"], [50, "L"], [40, "XL"],
+    [10, "X"], [9, "IX"], [5, "V"], [4, "IV"], [1, "I"],
+  ];
+  let n = num;
+  let out = "";
+  for (const [value, sym] of map) {
+    while (n >= value) {
+      out += sym;
+      n -= value;
+    }
+  }
+  return out;
+}
+
 function getTagSize(count, maxCount) {
   const ratio = maxCount ? count / maxCount : 0;
   return `${(0.95 + ratio * 0.35).toFixed(3)}rem`;
@@ -8,7 +25,7 @@ function getTagSize(count, maxCount) {
 
 class Tags extends Component {
   render() {
-    const { cssUrl, tags, title, showCount, totalPosts, topTag } = this.props;
+    const { cssUrl, tags, title, showCount } = this.props;
 
     return (
       <Fragment>
@@ -16,26 +33,16 @@ class Tags extends Component {
         <main class="tags-page">
           <header class="tags-hero">
             <div>
-              <p class="tags-eyebrow">Topic Index</p>
-              <h1>{title}</h1>
-              <p class="tags-hero__summary">
-                {tags.length ? `Browse ${tags.length} topics across ${totalPosts} tagged ${totalPosts === 1 ? "post" : "posts"}.` : "No tagged posts are available yet."}
+              <p class="tags-eyebrow">
+                <span>Topic Index</span>
+                <span class="tags-hero__sep" aria-hidden="true">·</span>
+                <span>{tags.length} {tags.length === 1 ? "topic" : "topics"}</span>
               </p>
+              <h1>{title}</h1>
             </div>
-            <dl class="tags-stats" aria-label="Tags summary">
-              <div>
-                <dt>Tags</dt>
-                <dd>{tags.length}</dd>
-              </div>
-              <div>
-                <dt>Posts</dt>
-                <dd>{totalPosts}</dd>
-              </div>
-              <div>
-                <dt>Largest</dt>
-                <dd>{topTag ? topTag.name : "None"}</dd>
-              </div>
-            </dl>
+            {tags.length > 0 && (
+              <span class="tags-hero__roman" aria-hidden="true">{toRoman(tags.length)}</span>
+            )}
           </header>
 
           <nav class="tags-index" aria-label={title}>
@@ -87,15 +94,11 @@ Tags.Cacheable = cacheComponent(Tags, "page.tags", (props) => {
     };
   });
   const maxCount = mappedTags.reduce((max, tag) => Math.max(max, tag.count), 0);
-  const totalPosts = mappedTags.reduce((total, tag) => total + tag.count, 0);
-  const topTag = mappedTags.reduce((top, tag) => (tag.count > top.count ? tag : top), mappedTags[0]);
 
   return {
     cssUrl: helper.url_for("/css/tags.css"),
     showCount: show_count,
     title: _p("common.tag", Infinity),
-    totalPosts,
-    topTag,
     tags: mappedTags.map((tag) => ({
       ...tag,
       size: getTagSize(tag.count, maxCount),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-gnix",
-  "version": "13.0.0",
+  "version": "14.0.0",
   "author": "Efterklang <gaojiaxing0220@gmail.com> (https://vluv.space)",
   "license": "MIT",
   "description": "Second generation of Hexo theme Icarus, now with Catppuccin flavor and night mode support.",
@@ -43,9 +43,9 @@
     "markdown-exit": "^1.0.0-beta.9",
     "markdown-exit-mermaid": "^2.2.3",
     "markdown-exit-ratex": "^0.2.2",
-    "@shikijs/colorized-brackets": "^4.0.2",
-    "@shikijs/transformers": "^4.0.2",
-    "shiki": "^4.0.2",
+    "@shikijs/colorized-brackets": "^4.1.0",
+    "@shikijs/transformers": "^4.1.0",
+    "shiki": "^4.1.0",
     "markdown-it-anchor": "^9.2.0",
     "markdown-it-footnote": "^4.0.0",
     "markdown-it-mark": "^4.0.0",