MD2PPT-Evolution/index.html at main · eric861129/MD2PPT-Evolution · 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
<!DOCTYPE html>
<html lang="zh-TW">
<head>
    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-E4RLE1PDJK"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());

      gtag('config', 'G-E4RLE1PDJK');
    </script>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>MD2PPT-Evolution | Turn Markdown into PowerPoint</title>
    <meta name="description" content="Free online Markdown to PowerPoint (PPTX) converter. Create professional slides instantly from simple text. Features advanced layouts, dark mode, and real-time preview." />
    <meta name="keywords" content="Markdown to PPT, PPTX converter, Markdown to Slides, Presentation Tool, Web-based PPT Maker, EricHuang, MD2PPT" />
    <meta name="author" content="EricHuang" />

    <!-- GoatCounter Analytics -->
    <script data-goatcounter="https://eric861129.goatcounter.com/count" async src="//gc.zgo.at/count.js"></script>

    <!-- Open Graph / Facebook -->
    <meta property="og:type" content="website" />
    <meta property="og:url" content="https://huangchiyu.com/MD2PPT-Evolution/" />
    <meta property="og:title" content="MD2PPT-Evolution | Turn Markdown into PowerPoint" />
    <meta property="og:description" content="Transform your Markdown notes into professional PowerPoint presentations in seconds. No sign-up required." />
    <meta property="og:image" content="https://huangchiyu.com/MD2PPT-Evolution/logo.svg" />

    <!-- Twitter -->
    <meta property="twitter:card" content="summary_large_image" />
    <meta property="twitter:url" content="https://huangchiyu.com/MD2PPT-Evolution/" />
    <meta property="twitter:title" content="MD2PPT-Evolution | Turn Markdown into PowerPoint" />
    <meta property="twitter:description" content="Transform your Markdown notes into professional PowerPoint presentations in seconds." />
    <meta property="twitter:image" content="https://huangchiyu.com/MD2PPT-Evolution/logo.svg" />

    <script src="https://cdn.tailwindcss.com"></script>
    <script>
        tailwind.config = {
            darkMode: 'class'
        }
    </script>
    <style>
        /* 核心排版策略：英數強制 Consolas，中文微軟正黑體 */
        :root {
            --font-main: "Consolas", "Microsoft JhengHei", "微軟正黑體", sans-serif;
        }

        body {
            font-family: var(--font-main);
            background-color: #f1f5f9;
            margin: 0;
            color: #1e293b;
        }

        .manuscript-font {
            font-family: var(--font-main);
        }

        /* 程式碼塊強制等寬 */
        code, pre, .font-mono {
            font-family: "Consolas", monospace !important;
        }

        /* 自定義捲軸 */
        ::-webkit-scrollbar { width: 8px; height: 8px; }
        ::-webkit-scrollbar-track { background: #f8fafc; }
        ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
        ::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

        /* Shiki 預覽樣式優化 */
        .shiki-preview pre {
            padding: 1.5rem !important;
            margin: 0 !important;
            background-color: transparent !important;
            white-space: pre-wrap !important;
            word-break: break-all !important;
            font-size: 1.125rem !important; /* text-lg */
        }

        /* 在深色投影片中微調背景 */
        .shiki-preview {
            background-color: rgba(255, 255, 255, 0.05);
        }
        .dark .shiki-preview {
            background-color: rgba(0, 0, 0, 0.2);
        }
    </style>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/buffer/6.0.3/buffer.min.js"></script>
    <script>
        // 關鍵：將 Buffer 掛載到全局，部分 Node.js 依賴庫 (如 pptxgenjs, qrcode) 可能需要
        // 修正：檢查 window.buffer 是否存在，避免直接引用導致 ReferenceError
        if (window.buffer) {
            window.Buffer = window.Buffer || window.buffer.Buffer;
        }
        // 確保 process.env 存在，避免 Gemini SDK 報錯
        window.process = window.process || { env: { API_KEY: "" } };
    </script>
</head>
<body class="manuscript-font">
    <div id="root"></div>
    <script type="module" src="/index.tsx"></script>
</body>
</html>