86 lines
3.7 KiB
HTML
86 lines
3.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN" data-theme-id="{{INITIAL_THEME_ID}}" data-color-mode="light" data-doc-theme="{{DOC_THEME}}">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{{PAGE_TITLE}}</title>
|
|
<link rel="stylesheet" href="/_webook/style.css">
|
|
<link rel="stylesheet" href="/_webook/themes/{{INITIAL_THEME_ID}}/theme.css" id="themeStylesheet">
|
|
<link rel="stylesheet" href="/_webook/themes/{{INITIAL_THEME_ID}}/highlight-light.css" id="themeHighlightStylesheet">
|
|
{{CUSTOM_THEME_LINK}}
|
|
</head>
|
|
<body>
|
|
<div class="app" id="app">
|
|
<aside class="sidebar" id="sidebar">
|
|
<div class="sidebar-header">
|
|
<a class="sidebar-brand" href="/" aria-label="返回首页">
|
|
<span class="sidebar-brand-mark">W</span>
|
|
<span class="sidebar-brand-text">
|
|
<strong>{{SITE_TITLE}}</strong>
|
|
<small>文档浏览器</small>
|
|
</span>
|
|
</a>
|
|
<div class="search-box">
|
|
<input type="text" id="searchInput" placeholder="搜索文件..." autocomplete="off">
|
|
</div>
|
|
</div>
|
|
<nav class="sidebar-nav" id="sidebarNav"></nav>
|
|
</aside>
|
|
<main class="content">
|
|
<div class="content-toolbar">
|
|
<div class="toolbar-breadcrumb-group">
|
|
<button class="btn-icon btn-sidebar-toggle btn-sidebar-toggle-toolbar" id="btnToggleSidebarToolbar" title="显示侧边栏" aria-label="显示侧边栏"></button>
|
|
<div class="toolbar-breadcrumb" id="toolbarBreadcrumb" aria-label="当前文档路径">
|
|
<span class="toolbar-kicker">Docs</span>
|
|
</div>
|
|
</div>
|
|
<div class="toolbar-actions">
|
|
<label class="theme-select-wrap" for="themeSelect" title="切换主题包">
|
|
<span class="theme-select-label">主题</span>
|
|
<select class="theme-select" id="themeSelect" aria-label="选择主题"></select>
|
|
</label>
|
|
<button class="btn-icon" id="btnToggleTheme" title="切换明暗模式">🌙</button>
|
|
</div>
|
|
</div>
|
|
<div class="content-body" id="contentBody">
|
|
<div class="empty-state" id="emptyState">
|
|
<div class="empty-card">
|
|
<div class="empty-icon">📘</div>
|
|
<h2>选择左侧文件开始阅读</h2>
|
|
<p>支持 Markdown、代码块、图片和基础排版。</p>
|
|
</div>
|
|
</div>
|
|
<article class="markdown-body" id="markdownContent" style="display:none;">
|
|
<div class="article-layout">
|
|
<div class="article-main">
|
|
<header class="article-header" id="articleHeader">
|
|
<h1 class="article-title" id="articleTitle"></h1>
|
|
</header>
|
|
<div class="article-body" id="articleBody"></div>
|
|
<footer class="article-meta-footer" id="articleMeta"></footer>
|
|
</div>
|
|
<aside class="toc-panel" id="tocPanel" aria-label="页面信息与目录">
|
|
<div class="toc-card">
|
|
<div class="toc-card-header">
|
|
<div class="toc-title">目录</div>
|
|
<button class="btn-icon toc-toggle-btn" id="btnToggleToc" type="button" title="收起目录" aria-label="收起目录"></button>
|
|
</div>
|
|
<nav class="toc-nav" id="tocNav"></nav>
|
|
</div>
|
|
</aside>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
<div class="loading-bar" id="loadingBar"></div>
|
|
<button class="mobile-nav-btn" id="mobileNavBtn" aria-label="打开侧边栏"></button>
|
|
<script>
|
|
window.__WEBOOK__ = {{WEBOOK_DATA}};
|
|
</script>
|
|
<script src="/_vendor/lucide/lucide.min.js"></script>
|
|
<script src="/_webook/app.js"></script>
|
|
<script src="/_webook/live-reload.js"></script>
|
|
</body>
|
|
</html>
|