Icather.github.io/notes.html at main · Icather/Icather.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
  <meta http-equiv="Pragma" content="no-cache" />
  <meta http-equiv="Expires" content="0" />
  <title>文章 - 一氯氢化物的博客</title>
  <link rel="icon" href="./static/img/logo.jpg" type="image/jpeg" />
  <link rel="stylesheet" href="./static/css/root.css" />
  <!-- GitHub 风格 Markdown（锁定版本） -->
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/github-markdown-css@5.1.0/github-markdown.min.css">
  <style>
    body { background: var(--main_bg_color); color: var(--main_text_color); font-family: sans-serif; }
    .page-header {
      display:flex; align-items:center; justify-content:space-between;
      padding:16px 20px; color: var(--main_text_color);
      max-width: 960px; margin: 0 auto;
    }
    .back-link {
      color: var(--purple_text_color); font-weight:600;
      text-decoration: none; border-radius: 8px;
      padding: 6px 14px; transition: background 0.2s;
    }
    .back-link:hover { background: var(--nav_tab_hover, rgba(0,0,0,0.04)); }
    .container {
      max-width: 960px; margin: 0 auto; padding: 10px 20px 40px;
    }
    .markdown-body {
      box-sizing: border-box;
      min-width: 200px; max-width: 100%;
      padding: 24px; border-radius: 14px;
      background: var(--item_bg_color);
      border: 1px solid rgba(255,255,255,0.6);
      box-shadow: 0 3px 10px rgba(0,0,0,0.06);
      color: var(--main_text_color);
    }
    .markdown-body h1, .markdown-body h2, .markdown-body h3,
    .markdown-body h4, .markdown-body h5, .markdown-body h6 {
      color: var(--main_text_color);
      border-bottom-color: var(--divider_color, rgba(0,0,0,0.08));
    }
    .markdown-body code {
      background: var(--nav_tab_active_bg, rgba(0,0,0,0.06));
      border-radius: 6px; padding: 2px 6px;
    }
    .markdown-body pre {
      background: var(--nav_tab_active_bg, rgba(0,0,0,0.06));
      border-radius: 10px;
    }
    .file-badge {
      display: inline-block; font-size: 12px; padding: 2px 10px;
      border-radius: 6px; opacity: 0.6;
      background: var(--nav_tab_active_bg, rgba(0,0,0,0.06));
      margin-left: 10px; vertical-align: middle;
    }
    @media (max-width: 800px) { .markdown-body { padding: 18px; } }
  </style>
</head>
<body>
  <div class="page-header">
    <div style="display:flex;align-items:center;gap:10px;">
      <div style="width:36px;height:36px;border-radius:50%;background-size:cover;background-image:url('./static/img/logo.jpg');border:1px solid rgba(255,255,255,0.7);flex-shrink:0;"></div>
      <span id="file-info" class="file-badge"></span>
    </div>
    <a class="back-link" href="./index.html">← 返回首页</a>
  </div>
  <div class="container">
    <article id="md" class="markdown-body">加载中…</article>
  </div>

  <!-- Marked.js（锁定版本） -->
  <script src="https://cdn.jsdelivr.net/npm/marked@9.1.0/marked.min.js"></script>
  <!-- 共享工具函数 -->
  <script src="./static/js/utils.js?v=3"></script>
  <script>
    (function() {
      const params = new URLSearchParams(window.location.search);
      let fileName = params.get('file');
      const docKey = params.get('doc');

      // 旧方式兼容映射
      const legacyMap = { 'note-1': 'note-1.md', 'note-2': 'note-2.md' };
      if (!fileName && docKey) {
        fileName = legacyMap[docKey] || null;
      }

      if (!fileName) {
        document.getElementById('md').innerHTML = '<p>未指定文章文件。请从首页选择一篇文章。</p>';
        return;
      }

      // 安全检查：防止路径遍历
      if (fileName.indexOf('..') !== -1 || fileName.indexOf('/') !== -1 || fileName.indexOf('\\') !== -1) {
        document.getElementById('md').innerHTML = '<p>无效的文件路径。</p>';
        return;
      }

      const ext = fileName.split('.').pop().toLowerCase();

      // 显示文件信息
      document.getElementById('file-info').textContent = fileName + ' (' + ext.toUpperCase() + ')';
      document.title = fileName.replace(/\.(md|mdx)$/, '') + ' - 一氯氢化物的博客';

      // 使用 fetchFile 加载文章（兼容 file:// 协议）
      fetchFile('./static/md/' + encodeURIComponent(fileName))
        .then(function(content) {
          content = stripFrontmatter(content);
          if (ext === 'mdx') {
            content = degradeMDX(content);
          }
          const safeTitle = escapeHTML(fileName.replace(/\.(md|mdx)$/, ''));
          document.getElementById('md').innerHTML = '<h1>' + safeTitle + '</h1>' + marked.parse(content);
        })
        .catch(function() {
          document.getElementById('md').innerHTML = '<p>抱歉，内容加载失败。请确认文件存在。</p>';
        });
    })();
  </script>
</body>
</html>