ソースを参照

web: Fix 浠艾福 typo(爱→艾), fix knowledge.html title padding, shift markers up 10%, max-3 articles with >> reveal

asus 1 ヶ月 前
コミット
3f5f5b03f0
2 ファイル変更36 行追加14 行削除
  1. 4 4
      web/js/footer.js
  2. 32 10
      web/knowledge.html

+ 4 - 4
web/js/footer.js

@@ -10,8 +10,8 @@
     '  <div class="container">' +
     '    <div class="footer-inner">' +
     '      <div class="footer-brand">' +
-    '        <img src="logo.png" alt="\u6D60\u7231\u798F" class="footer-logo-img" width="48" height="48">' +
-    '        <span class="logo-text">\u6D60\u7231\u798F</span>' +
+    '        <img src="logo.png" alt="\u6D60\u827E\u798F" class="footer-logo-img" width="48" height="48">' +
+    '        <span class="logo-text">\u6D60\u827E\u798F</span>' +
     '        <span class="logo-tag">\u4E3B\u52A8\u5065\u5EB7</span>' +
     '        <p>\u4EE5 AI \u79D1\u6280\u8D4B\u80FD\u6BCF\u4E2A\u5BB6\u5EAD\uFF0C\u8BA9\u5065\u5EB7\u4E0E\u5E78\u798F\u89E6\u624B\u53EF\u53CA\u3002</p>' +
     '      </div>' +
@@ -19,7 +19,7 @@
     '        <div class="footer-col">' +
     '          <h4>\u4EA7\u54C1</h4>' +
     '          <ul>' +
-    '            <li><a href="index.html#product">\u6D60\u7231\u798F\u5E73\u53F0</a></li>' +
+    '            <li><a href="index.html#product">\u6D60\u827E\u798F\u5E73\u53F0</a></li>' +
     '            <li><a href="index.html#dimensions">\u4E94\u7EF4\u5E78\u798F</a></li>' +
     '            <li><a href="index.html#features">\u6838\u5FC3\u529F\u80FD</a></li>' +
     '            <li><a href="index.html#ai-tech">AI \u6280\u672F</a></li>' +
@@ -50,7 +50,7 @@
     '      </div>' +
     '    </div>' +
     '    <div class="footer-bottom">' +
-    '      <p>&copy; 2026 \u6D60\u7231\u798F\u4E3B\u52A8\u5065\u5EB7\u7814\u7A76\u9662. All rights reserved.</p>' +
+    '      <p>&copy; 2026 \u6D60\u827E\u798F\u4E3B\u52A8\u5065\u5EB7\u7814\u7A76\u9662. All rights reserved.</p>' +
     '      <p class="footer-legal">' +
     '        <a href="#">\u9690\u79C1\u653F\u7B56</a>' +
     '        <a href="#">\u7528\u6237\u534F\u8BAE</a>' +

+ 32 - 10
web/knowledge.html

@@ -30,8 +30,8 @@
       --c-action: #10B981;
       --c-heart: #FF6B9D;
     }
-    html.kb-page, .kb-page body { height: 100vh; overflow: hidden; }
-    .kb-page body { display: flex; flex-direction: column; padding-top:64px; background: linear-gradient(135deg, #FAFBFC 0%, #F0F4F8 100%); }
+    html.kb-page { height: 100vh; overflow: hidden; }
+    .kb-page body { height: 100vh; overflow: hidden; box-sizing:border-box; display: flex; flex-direction: column; padding-top:64px; background: linear-gradient(135deg, #FAFBFC 0%, #F0F4F8 100%); }
 
     .kb-main { flex:1; display:flex; flex-direction:column; max-width:1200px; width:100%; margin:0 auto; padding:0 var(--space-lg); overflow:hidden; position:relative; z-index:1; }
     .kb-header { text-align:center; flex-shrink:0; padding:var(--space-lg) 0 var(--space-md); }
@@ -58,6 +58,11 @@
     .kb-marker-card a .ma-arrow { flex-shrink:0; font-size:0.75rem; opacity:0.3; transition:transform var(--transition-fast); }
     .kb-marker-card a:hover .ma-arrow { transform:translateX(3px); opacity:0.7; }
     .kb-marker-card .ma-coming { opacity:0.5; cursor:default; pointer-events:none; font-size:0.75rem; padding:4px 0; }
+    .kb-marker-card .kb-more-wrap { position:relative; }
+    .kb-marker-card .kb-more-btn { display:block; text-align:center; font-size:0.875rem; font-weight:700; color:var(--m-color); padding:2px 0 0; cursor:pointer; opacity:0.5; transition:opacity .2s; letter-spacing:1px; user-select:none; }
+    .kb-marker-card .kb-more-btn:hover { opacity:1; }
+    .kb-marker-card .kb-hidden-items { max-height:0; overflow:hidden; transition:max-height .25s ease; }
+    .kb-marker-card .kb-more-wrap:hover .kb-hidden-items { max-height:300px; }
 
     .kb-m-pos-brain  { top:13%; left:56%; }
     .kb-m-pos-heart  { top:33%; right:54%; }
@@ -176,11 +181,11 @@
     };
 
     var MARKER_POS = {
-      brain: { top:'11%', side:'left', offset:'55%' },
-      heart: { top:'31%', side:'right', offset:'52%' },
-      gut:   { top:'46%', side:'left', offset:'53%' },
-      hands: { top:'62%', side:'right', offset:'52%' },
-      feet:  { top:'81%', side:'left', offset:'53%' }
+      brain: { top:'1%', side:'left', offset:'55%' },
+      heart: { top:'21%', side:'right', offset:'52%' },
+      gut:   { top:'36%', side:'left', offset:'53%' },
+      hands: { top:'52%', side:'right', offset:'52%' },
+      feet:  { top:'71%', side:'left', offset:'53%' }
     };
 
     (function buildDesktop() {
@@ -198,8 +203,25 @@
         hd.className = 'kb-marker-head';
         hd.innerHTML = '<span class="kb-marker-label">'+d.label+' · '+d.subtitle+'</span>';
         card.appendChild(hd);
+        var maxVis = 3;
         for (var j = 0; j < arts.length; j++) {
-          var a = arts[j], el;
+          if (j === maxVis && arts.length > maxVis) {
+            var moreWrap = document.createElement('div');
+            moreWrap.className = 'kb-more-wrap';
+            var btn = document.createElement('div');
+            btn.className = 'kb-more-btn';
+            btn.textContent = '>>';
+            moreWrap.appendChild(btn);
+            var hiddenDiv = document.createElement('div');
+            hiddenDiv.className = 'kb-hidden-items';
+            moreWrap.appendChild(hiddenDiv);
+            card.appendChild(moreWrap);
+          }
+          var a = arts[j], el, container = card;
+          if (j >= maxVis && arts.length > maxVis) {
+            var mw = card.querySelector('.kb-hidden-items');
+            if (mw) container = mw;
+          }
           if (a.coming) {
             el = document.createElement('div');
             el.className = 'ma-coming';
@@ -207,9 +229,9 @@
           } else {
             el = document.createElement('a');
             el.href = a.url;
-            el.innerHTML = '<span class="ma-icon">'+a.icon+'</span><span class="ma-title">'+a.title+'</span><span class="ma-arrow"></span>';
+            el.innerHTML = '<span class="ma-icon">'+a.icon+'</span><span class="ma-title">'+a.title+'</span><span class="ma-arrow">\u2192</span>';
           }
-          card.appendChild(el);
+          container.appendChild(el);
         }
         var dot = document.createElement('div');
         dot.className = 'kb-marker-dot';