补充主题静态资源与归档模板

assets/js/svg-icon-helper.js

@@ -0,0 +1,89 @@
+/**
+ * AKSRT SVG Icon Helper
+ *
+ * Provides utilities for injecting SVG icons from the zib_svgs data array.
+ * Depends on svg-icon.js being loaded first (which defines zib_svgs).
+ *
+ * Usage:
+ *   aksrtSvgIcon('like')                    → returns SVG HTML string
+ *   aksrtInjectIcons()                      → replaces all <i data-svg="name"> in DOM
+ *   aksrtInjectIcons(container)             → replaces within a specific container
+ *
+ * @package AKSRT
+ */
+
+(function () {
+  'use strict';
+
+  /**
+   * Get SVG HTML string by icon name.
+   * @param {string} name Icon key (e.g. 'like', 'view', 'comment')
+   * @param {string} [extraClass] Optional CSS class to add to the SVG element
+   * @returns {string} SVG HTML or empty string
+   */
+  function aksrtSvgIcon(name, extraClass) {
+    if (!window.zib_svgs || !window.zib_svgs[name]) return '';
+    var cls = 'aksrt-svg-icon' + (extraClass ? ' ' + extraClass : '');
+    return '<svg class="' + cls + '" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" aria-hidden="true">' +
+      window.zib_svgs[name] +
+      '</svg>';
+  }
+
+  /**
+   * Inject SVG icons into the DOM by replacing <i data-svg="name"> elements.
+   * @param {Element} [container=document.body] Container to search within
+   */
+  function aksrtInjectIcons(container) {
+    container = container || document.body;
+    var elements = container.querySelectorAll('i[data-svg]');
+    elements.forEach(function (el) {
+      var name = el.getAttribute('data-svg');
+      if (!name || !window.zib_svgs || !window.zib_svgs[name]) return;
+
+      var wrapper = document.createElement('span');
+      wrapper.className = el.className.replace(/fa[sbrl]?\s*/g, '').trim();
+      wrapper.setAttribute('data-svg', name);
+      wrapper.innerHTML = aksrtSvgIcon(name);
+
+      // Copy inline styles
+      if (el.style.cssText) {
+        wrapper.style.cssText = el.style.cssText;
+      }
+
+      el.parentNode.replaceChild(wrapper, el);
+    });
+  }
+
+  // ── Default icon styles ──
+
+  var STYLE_ID = 'aksrt-svg-icon-style';
+
+  function injectStyle() {
+    if (document.getElementById(STYLE_ID)) return;
+    var style = document.createElement('style');
+    style.id = STYLE_ID;
+    style.textContent =
+      '.aksrt-svg-icon{display:inline-block;vertical-align:-0.125em;width:1em;height:1em;flex-shrink:0;}' +
+      '[data-svg]{display:inline-flex;align-items:center;justify-content:center;}';
+    document.head.appendChild(style);
+  }
+
+  // ── Public API ──
+
+  window.aksrtSvgIcon = aksrtSvgIcon;
+  window.aksrtInjectIcons = aksrtInjectIcons;
+
+  // ── Auto-init ──
+
+  function init() {
+    injectStyle();
+    // Auto-inject icons on page load
+    aksrtInjectIcons();
+  }
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', init);
+  } else {
+    init();
+  }
+})();