forked from astrnox/BioQuest
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathstudy.html
More file actions
168 lines (159 loc) · 8.22 KB
/
Copy pathstudy.html
File metadata and controls
168 lines (159 loc) · 8.22 KB
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
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
<!DOCTYPE html>
<html lang="zh-CN" data-theme="light">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>学习模块 - BioQuest</title>
<meta http-equiv="refresh" content="0; url=index.html#/study">
<script>location.replace('index.html#/study');</script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600;700&family=Noto+Sans+SC:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
<style>@font-face{font-family:'LXGW WenKai';src:url('fonts/lxgw-wenkai.ttf?v=1.522') format('truetype');font-weight:100 900;font-display:swap;}</style>
<link rel="stylesheet" href="css/globals.css">
<link rel="stylesheet" href="css/header.css">
<link rel="stylesheet" href="css/footer.css">
<link rel="stylesheet" href="css/study.css">
<script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js@2"></script>
<script src="js/supabase-client.js?v=20260608d"></script>
<script src="js/supabase.js?v=20260608d"></script>
</head>
<body>
<header class="header">
<a href="index.html" class="header-brand">
<svg width="28" height="28" viewBox="0 0 28 28" fill="none">
<circle cx="14" cy="14" r="12" stroke="#e8a830" stroke-width="2"/>
<circle cx="14" cy="14" r="4" fill="#e8a830"/>
</svg>
BioQuest
</a>
<div class="header-right">
<button class="hamburger" id="hamburgerBtn" aria-label="菜单">
<span class="hamburger-line"></span>
<span class="hamburger-line"></span>
<span class="hamburger-line"></span>
</button>
</div>
</header>
<div class="mobile-nav-overlay" id="mobileOverlay"></div>
<nav class="mobile-nav" id="mobileNav">
<div style="display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-light);">
<div style="display:flex;align-items:center;gap:10px;">
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" aria-hidden="true">
<circle cx="14" cy="14" r="12" stroke="#e8a830" stroke-width="2"/>
<circle cx="14" cy="14" r="4" fill="#e8a830"/>
<path d="M14 2v4M14 22v4M2 14h4M22 14h4" stroke="#5a7d5c" stroke-width="1.5"/>
</svg>
<span style="font-weight:700;font-size:1.1rem;color:var(--color-deep);">BioQuest</span>
</div>
<button id="mobileNavClose" style="background:none;border:none;font-size:22px;cursor:pointer;color:var(--text-muted);padding:4px 8px;">✕</button>
</div>
<div class="mobile-nav-scroll">
<a href="index.html" data-route="/">首页</a>
<a href="index.html#/practice" data-route="/practice" class="nav-highlight">练习</a>
<a href="index.html#/exam" data-route="/exam" class="nav-highlight">模考</a>
<a href="study.html" class="active">学习</a>
<a href="biology-history.html">生物学史</a>
<a href="cards.html">卡片</a>
<a href="quiz.html">试题</a>
<a href="resources.html">资源</a>
<a href="wiki.html">百科</a>
<a href="index.html#/knowledge-graph" data-route="/knowledge-graph">图谱</a>
<a href="index.html#/diagnosis" data-route="/diagnosis">诊断</a>
<a href="index.html#/pomodoro" data-route="/pomodoro">专注</a>
<a href="index.html#/habits" data-route="/habits">习惯</a>
<a href="index.html#/review" data-route="/review">复习</a>
<a href="index.html#/bounties" data-route="/bounties">悬赏</a>
<a href="index.html#/community" data-route="/community">社区</a>
<a href="index.html#/analytics" data-route="/analytics">分析</a>
<a href="index.html#/user" data-route="/user">我的</a>
<div class="theme-toggle-row">
<span>主题模式</span>
<button class="theme-toggle theme-toggle--mobile" id="themeToggleMobile" aria-label="切换主题">
<svg class="icon-moon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/>
</svg>
<svg class="icon-sun" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="display:none;">
<circle cx="12" cy="12" r="5"/><line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/><line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/>
</svg>
</button>
</div>
</div>
</nav>
<main style="padding-top: calc(var(--header-height, 64px) + 40px);">
<section class="section">
<div class="container">
<div class="section-label">STUDY MODULE</div>
<h2 class="section-title">学习模块</h2>
<p class="section-desc">按《普通生物学》章节体系系统学习，追踪掌握进度，推荐下一步学习内容</p>
<!-- 整体进度统计 -->
<div class="study-stats">
<div class="study-stat-card study-stat-card--highlight">
<div class="study-stat-label">总知识点</div>
<div class="study-stat-value"><span id="statTotal">0</span></div>
</div>
<div class="study-stat-card study-stat-card--amber">
<div class="study-stat-label">已学习</div>
<div class="study-stat-value"><span id="statStudied">0</span></div>
</div>
<div class="study-stat-card study-stat-card--deep">
<div class="study-stat-label">已掌握</div>
<div class="study-stat-value"><span id="statMastered">0</span></div>
</div>
</div>
<!-- 整体进度条 -->
<div class="study-overall-progress">
<div class="study-overall-progress-header">
<span class="study-overall-progress-title">整体学习进度</span>
<span class="study-overall-progress-pct" id="overallPct">0%</span>
</div>
<div class="study-progress-bar-track">
<div class="study-progress-bar-fill" id="overallFill" style="width: 0%"></div>
</div>
</div>
<!-- 推荐学习 -->
<div class="study-recommend-section">
<div class="study-recommend-header">
<span class="study-recommend-title">推荐学习</span>
<span class="study-recommend-badge">智能推荐</span>
</div>
<div class="study-recommend-list" id="recommendList"></div>
</div>
<!-- 主布局：左侧树 + 右侧详情 -->
<div class="study-layout">
<aside class="study-sidebar">
<div class="study-sidebar-header">
<span class="study-sidebar-title">知识体系</span>
<button class="study-sidebar-toggle-all" id="toggleAllBtn">全部折叠</button>
</div>
<div class="study-tree" id="studyTree"></div>
</aside>
<div class="study-detail" id="studyDetail">
<div class="study-detail-empty">
<div class="study-detail-empty-icon">—</div>
<div class="study-detail-empty-text">选择左侧知识点开始学习</div>
<div class="study-detail-empty-hint">点击知识体系树中的知识点查看详情</div>
</div>
</div>
</div>
</div>
</section>
</main>
<footer class="footer">
<div class="footer-content">
<div class="footer-brand">BioQuest — 生物竞赛学习平台</div>
<div class="footer-links">
<a href="cards.html">知识卡片</a>
<a href="quiz.html">模拟试题</a>
<a href="ebook.html">笔记</a>
<a href="study.html">学习模块</a>
<a href="resources.html">学习资源</a>
<a href="wiki.html">生物百科</a>
</div>
</div>
</footer>
<noscript>
<p style="text-align:center;padding:40px;">请启用 JavaScript 或直接访问 <a href="index.html#/study">学习模块</a></p>
</noscript>
</body>
</html>