hexo-theme-gnix 5.0.5 → 5.0.6

package/layout/comment/twikoo.jsx

@@ -5,17 +5,6 @@ const {
   lazy_load_css,
 } = require("../../include/util/common");
 
-/**
- * Twikoo comment JSX component.
- *
- * @see https://twikoo.js.org/quick-start.html
- * @example
- * <Twikoo
- *     envId="env_id"
- *     region="ap-guangzhou"
- *     lang="zh-CN"
- *     jsUrl="/path/to/Twikoo.js" />
- */
 class Twikoo extends Component {
   render() {
     const { envId, region, lang, jsUrl } = this.props;
@@ -36,21 +25,6 @@ twikoo.init(window.twikooConfig);
   }
 }
 
-/**
- * Cacheable Twikoo comment JSX component.
- * <p>
- * This class is supposed to be used in combination with the <code>locals</code> hexo filter
- * ({@link module:hexo/filter/locals}).
- *
- * @see module:util/cache.cacheComponent
- * @example
- * <Twikoo.Cacheable
- *     comment={{
- *         env_id: "env_id",
- *         region: "ap-guangzhou",
- *         lang: "zh-CN",
- *     }} />
- */
 Twikoo.Cacheable = cacheComponent(Twikoo, "comment.twikoo", (props) => {
   const { comment, helper, page, config } = props;
 

package/layout/common/navbar.jsx

@@ -21,7 +21,6 @@ function isSameLink(a, b) {
 
 const renderLinkIcon = (link) => {
   if (!link.icon) return null;
-  // start with '<' means svg icon
   if (link.icon === "travellings") {
     return (
       <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
@@ -37,7 +36,7 @@ const renderLinkIcon = (link) => {
 
 class Navbar extends Component {
   render() {
-    const { siteUrl, menu, links, showSearch, searchTitle } = this.props;
+    const { siteUrl, menu, links, searchTitle } = this.props;
 
     return (
       <nav class="navbar navbar-main" onclick="handleNavbarClick(event);">
@@ -65,19 +64,6 @@ class Navbar extends Component {
               </div>
             ) : null}
             <div class="navbar-end">
-              <button
-                type="button"
-                class="navbar-item"
-                title="Choose Theme"
-                onclick="window.openThemeModal?.()"
-              >
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-                  <title>brightness_fill</title>
-                  <g id="brightness_fill" fill="currentColor">
-                    <path d="M12 18.5a1.5 1.5 0 0 1 1.493 1.356L13.5 20v1a1.5 1.5 0 0 1-2.993.144L10.5 21v-1a1.5 1.5 0 0 1 1.5-1.5m4.596-1.904a1.5 1.5 0 0 1 2.008-.103l.114.103.707.707a1.5 1.5 0 0 1-2.008 2.225l-.114-.103-.707-.707a1.5 1.5 0 0 1 0-2.122m-11.314 0a1.5 1.5 0 0 1 2.225 2.008l-.103.114-.707.707a1.5 1.5 0 0 1-2.225-2.008l.103-.114zM12 6a6 6 0 1 1 0 12 6 6 0 0 1 0-12m0 3a3 3 0 0 0-.176 5.995L12 15zm-8 1.5a1.5 1.5 0 0 1 .144 2.993L4 13.5H3a1.5 1.5 0 0 1-.144-2.993L3 10.5zm17 0a1.5 1.5 0 0 1 .144 2.993L21 13.5h-1a1.5 1.5 0 0 1-.144-2.993L20 10.5zM4.575 4.575a1.5 1.5 0 0 1 2.008-.103l.114.103.707.707a1.5 1.5 0 0 1-2.008 2.225l-.114-.103-.707-.707a1.5 1.5 0 0 1 0-2.122m12.728 0a1.5 1.5 0 0 1 2.225 2.008l-.103.114-.707.707a1.5 1.5 0 0 1-2.225-2.008l.103-.114zM12 1.5a1.5 1.5 0 0 1 1.493 1.356L13.5 3v1a1.5 1.5 0 0 1-2.993.144L10.5 4V3A1.5 1.5 0 0 1 12 1.5"></path>
-                  </g>
-                </svg>
-              </button>
               {Object.keys(links).length ? (
                 <Fragment>
                   {Object.keys(links).map((name) => {
@@ -96,20 +82,32 @@ class Navbar extends Component {
                   })}
                 </Fragment>
               ) : null}
-              {showSearch ? (
-                <button
-                  type="button"
-                  class="navbar-item search"
-                  title={searchTitle}
-                >
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-                    <title>search_line</title>
-                    <g id="search_line" fill="currentColor">
-                      <path d="M10.5 2a8.5 8.5 0 1 0 5.262 15.176l3.652 3.652a1 1 0 0 0 1.414-1.414l-3.652-3.652A8.5 8.5 0 0 0 10.5 2M4 10.5a6.5 6.5 0 1 1 13 0 6.5 6.5 0 0 1-13 0"></path>
-                    </g>
-                  </svg>
-                </button>
-              ) : null}
+              <button
+                type="button"
+                class="navbar-item"
+                id="theme-selector-trigger"
+                title="Choose Theme"
+                onclick="window.openThemeModal?.()"
+              >
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                  <title>brightness_fill</title>
+                  <g id="brightness_fill" fill="currentColor">
+                    <path d="M12 18.5a1.5 1.5 0 0 1 1.493 1.356L13.5 20v1a1.5 1.5 0 0 1-2.993.144L10.5 21v-1a1.5 1.5 0 0 1 1.5-1.5m4.596-1.904a1.5 1.5 0 0 1 2.008-.103l.114.103.707.707a1.5 1.5 0 0 1-2.008 2.225l-.114-.103-.707-.707a1.5 1.5 0 0 1 0-2.122m-11.314 0a1.5 1.5 0 0 1 2.225 2.008l-.103.114-.707.707a1.5 1.5 0 0 1-2.225-2.008l.103-.114zM12 6a6 6 0 1 1 0 12 6 6 0 0 1 0-12m0 3a3 3 0 0 0-.176 5.995L12 15zm-8 1.5a1.5 1.5 0 0 1 .144 2.993L4 13.5H3a1.5 1.5 0 0 1-.144-2.993L3 10.5zm17 0a1.5 1.5 0 0 1 .144 2.993L21 13.5h-1a1.5 1.5 0 0 1-.144-2.993L20 10.5zM4.575 4.575a1.5 1.5 0 0 1 2.008-.103l.114.103.707.707a1.5 1.5 0 0 1-2.008 2.225l-.114-.103-.707-.707a1.5 1.5 0 0 1 0-2.122m12.728 0a1.5 1.5 0 0 1 2.225 2.008l-.103.114-.707.707a1.5 1.5 0 0 1-2.225-2.008l.103-.114zM12 1.5a1.5 1.5 0 0 1 1.493 1.356L13.5 3v1a1.5 1.5 0 0 1-2.993.144L10.5 4V3A1.5 1.5 0 0 1 12 1.5"></path>
+                  </g>
+                </svg>
+              </button>
+              <button
+                type="button"
+                class="navbar-item search"
+                title={searchTitle}
+              >
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                  <title>search_line</title>
+                  <g id="search_line" fill="currentColor">
+                    <path d="M10.5 2a8.5 8.5 0 1 0 5.262 15.176l3.652 3.652a1 1 0 0 0 1.414-1.414l-3.652-3.652A8.5 8.5 0 0 0 10.5 2M4 10.5a6.5 6.5 0 1 1 13 0 6.5 6.5 0 0 1-13 0"></path>
+                  </g>
+                </svg>
+              </button>
             </div>
           </div>
           <button
@@ -131,7 +129,7 @@ class Navbar extends Component {
 module.exports = cacheComponent(Navbar, "common.navbar", (props) => {
   const { config, helper, page } = props;
   const { url_for, _p, __ } = helper;
-  const { logo, title, navbar, widgets, search } = config;
+  const { logo, title, navbar, widgets } = config;
 
   const hasTocWidget =
     Array.isArray(widgets) && widgets.find((widget) => widget.type === "toc");
@@ -169,7 +167,6 @@ module.exports = cacheComponent(Navbar, "common.navbar", (props) => {
     links,
     showToc,
     tocTitle: _p("widget.catalogue", Infinity),
-    showSearch: search?.type,
     searchTitle: __("search.search"),
   };
 });

package/layout/common/scripts.jsx

@@ -26,6 +26,7 @@ module.exports = class extends Component {
         <script
           defer
           src="/js/host/medium-zoom/dist/medium-zoom.min.js"
+          onLoad={`const zoom = mediumZoom(".article img", { background: "hsla(from var(--mantle) / 0.9)" })`}
         ></script>
         <script async src="/js/shiki/shiki.js"></script>
         <script async src="/js/instant-page.min.js" type="module"></script>

package/layout/common/theme_selector.jsx

@@ -3,7 +3,6 @@ class ThemeSelector extends Component {
   render() {
     return (
       <div
-        class="theme-selector-modal"
         id="theme-selector-modal"
         onclick="window.handleThemeModalClick?.(event)"
       >

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-gnix",
-  "version": "5.0.5",
+  "version": "5.0.6",
   "author": "Efterklang <gaojiaxing0220@gmail.com>",
   "license": "MIT",
   "description": "Second generation of Hexo theme Icarus, now with Catppuccin flavor and night mode support.",

package/source/css/default.css

@@ -476,7 +476,7 @@ body {
 
 /* #region Theme Selector */
 
-.theme-selector-modal {
+#theme-selector-modal {
   position: fixed;
   inset: 0;
   z-index: 100;
@@ -504,7 +504,7 @@ body {
     opacity 0.2s ease;
 }
 
-.theme-selector-modal.is-active {
+#theme-selector-modal.is-active {
   opacity: 1;
   visibility: visible;
   pointer-events: auto;
@@ -1023,40 +1023,36 @@ body {
 }
 
 table {
-  table-layout: fixed;
-  word-wrap: break-word;
   width: 100%;
-  border-collapse: separate;
+  border-collapse: collapse;
   border-spacing: 0;
-  border-radius: 8px;
-  overflow: hidden;
+  overflow: auto;
   margin: 1rem 0;
   font-size: 1rem;
-  border: 1px solid var(--surface0);
 }
 
-table td,
-table th {
+td,
+th {
   vertical-align: middle;
   padding: 0.75em 1em;
 }
 
-table thead th {
+thead th {
   font-weight: 700;
   border-bottom: 1px solid var(--surface0);
   padding: 1em;
 }
 
-table td:not([align]),
-table th:not([align]) {
+td:not([align]),
+th:not([align]) {
   text-align: left;
 }
 
-table tbody tr td {
+tbody tr td {
   border-bottom: 1px solid var(--surface0);
 }
 
-table tbody tr:last-child td {
+tbody tr:last-child td {
   border-bottom: none;
 }
 

package/source/css/responsive/mobile.css

@@ -13,7 +13,6 @@ span.year {
 
 table {
   font-size: 14px;
-  word-wrap: break-word;
 }
 
 table th,
@@ -52,4 +51,4 @@ table td {
 .pagination-list li {
   flex-grow: 1;
   flex-shrink: 1;
-}
+}

package/source/js/main.js

@@ -92,21 +92,10 @@ function syncRelatedTabs(syncId) {
 
 // #region Keyboard Shortcuts
 
-function initKeyboardShortcuts() {
-  // 移除旧事件（防止PJAX重复绑定）
-  document.removeEventListener("keydown", handleKeyDown);
-  document.addEventListener("keydown", handleKeyDown, {
-    capture: true, // 捕获阶段监听，优先于浏览器默认处理
-    passive: false, // 允许调用 preventDefault
-  });
-}
-
-// 抽离键盘事件处理函数
 function handleKeyDown(e) {
   const isModifier = e.metaKey || e.ctrlKey;
   if (!isModifier) return;
 
-  // 性能优化 2: 如果用户在输入框内输入，不触发快捷键
   const tag = e.target.tagName;
   if (tag === "INPUT" || tag === "TEXTAREA" || e.target.isContentEditable) {
     return;
@@ -118,10 +107,7 @@ function handleKeyDown(e) {
     if (searchBtn) searchBtn.click();
   } else if ((e.shiftKey && e.code === "KeyP") || e.code === "KeyP") {
     e.preventDefault();
-    const themeBtn = document.querySelector(
-      "button.navbar-item.theme-selector-trigger",
-    );
-    if (themeBtn) themeBtn.click();
+    window.openThemeModal?.();
   }
 }
 
@@ -150,7 +136,7 @@ function initializeTableOfContents() {
   });
 
   if (headers.length > 0) {
-    // 先移除旧的滚动事件（防止PJAX重复绑定）
+    // 先移除旧的滚动事件
     window.removeEventListener("scroll", handleTocScroll, { passive: true });
 
     function handleTocScroll() {
@@ -192,13 +178,10 @@ function initializeTableOfContents() {
 // #endregion
 
 function initLogic() {
-  initKeyboardShortcuts();
   initializeTableOfContents();
   initializeTabs();
-  if (typeof mediumZoom === "function") {
-    mediumZoom(".article img", {
-      background: "hsla(from var(--mantle) / 0.9)",
-    });
+  if (document.getElementById("twikoo")) {
+    twikoo?.init(window.twikooConfig);
   }
 }
 
@@ -210,14 +193,6 @@ document.addEventListener("DOMContentLoaded", () => {
 if (typeof swup !== "undefined") {
   swup.hooks.on("page:view", () => {
     initLogic();
-
-    // Re-initialize Twikoo if available
-    if (typeof twikoo !== "undefined" && window.twikooConfig) {
-      const twikooContainer = document.getElementById("twikoo");
-      if (twikooContainer) {
-        twikoo.init(window.twikooConfig);
-      }
-    }
   });
 }
 
@@ -245,3 +220,22 @@ function handleNavbarClick(e) {
     }
   }
 }
+
+function tableWrapFix() {
+  document.querySelectorAll(".content table").forEach((table) => {
+    // if width exceeds container, wrap it
+    const wrapper = document.createElement("div");
+    Object.assign(wrapper.style, {
+      width: "100%",
+      overflowX: "auto",
+    });
+    table.parentNode.insertBefore(wrapper, table);
+    wrapper.appendChild(table);
+  });
+}
+
+tableWrapFix();
+document.addEventListener("keydown", handleKeyDown, {
+  capture: true, // 捕获阶段监听，优先于浏览器默认处理
+  passive: false, // 允许调用 preventDefault
+});