-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathdashboard.html
More file actions
141 lines (132 loc) · 7.49 KB
/
Copy pathdashboard.html
File metadata and controls
141 lines (132 loc) · 7.49 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Track your APUSH progress and mastery across all periods">
<title>Student Dashboard | APUSH Learning Hub</title>
<link rel="stylesheet" href="styles.css?v=museum1">
</head>
<body class="museum-site">
<nav class="navbar" role="navigation" aria-label="Main navigation">
<div class="nav-container">
<a href="index.html" class="logo" aria-label="APUSH HUB Home">
<span class="logo-mark" aria-hidden="true"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M4 19V5l8-3 8 3v14"/><path d="M8 10h8M8 14h5"/></svg></span>
<span class="logo-text">APUSH HUB</span>
</a>
<button class="nav-toggle" aria-label="Toggle navigation menu" aria-expanded="false">
<span></span>
<span></span>
<span></span>
</button>
<ul class="nav-menu">
<li><a href="index.html" class="nav-link">Home</a></li>
<li><a href="units.html" class="nav-link">Units</a></li>
<li><a href="resources.html" class="nav-link">Resources</a></li>
<li><a href="schedule.html" class="nav-link">Schedule</a></li>
<li><a href="dashboard.html" class="nav-link active" aria-current="page">Dashboard</a></li>
</ul>
<div class="nav-controls">
<div data-theme-toggler-root class="theme-toggler-root" hidden aria-hidden="true"></div>
<button type="button" class="settings-gear-btn" aria-label="Open settings" title="Settings">
<span>⚙️</span>
</button>
</div>
</div>
</nav>
<main class="main-content">
<section class="dashboard-header page-hero" aria-labelledby="dashboard-heading">
<div class="container">
<span class="section-label">Your Progress</span>
<h1 id="dashboard-heading" class="page-title display-heading">Your Study Archive</h1>
<p class="page-subtitle">Track your progress, continue your units, and review what matters most.</p>
</div>
</section>
<section class="dashboard-content">
<div class="container">
<div class="dashboard-grid">
<div class="dashboard-card overview-card">
<h2 class="card-title">Overall Progress</h2>
<div class="overall-stats">
<div class="stat-circle">
<svg class="progress-ring" width="120" height="120">
<defs>
<linearGradient id="progress-gradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:var(--primary-color);stop-opacity:1" />
<stop offset="100%" style="stop-color:var(--secondary-color);stop-opacity:1" />
</linearGradient>
</defs>
<circle class="progress-ring-circle" cx="60" cy="60" r="54" fill="transparent" stroke="currentColor" stroke-width="8" stroke-dasharray="339.292" stroke-dashoffset="0"></circle>
<circle class="progress-ring-progress" cx="60" cy="60" r="54" fill="transparent" stroke="url(#progress-gradient)" stroke-width="8" stroke-dasharray="339.292" stroke-dashoffset="0"></circle>
</svg>
<div class="stat-circle-content">
<span class="stat-circle-value" id="overall-mastery">0%</span>
<span class="stat-circle-label">Mastery</span>
</div>
</div>
<div class="overall-details">
<div class="detail-item">
<span class="detail-label">Periods Completed:</span>
<span class="detail-value" id="periods-completed-count">0/8</span>
</div>
<div class="detail-item">
<span class="detail-label">Skills Mastered:</span>
<span class="detail-value" id="skills-mastered-count">0/24</span>
</div>
<div class="detail-item">
<span class="detail-label">Practice Questions:</span>
<span class="detail-value" id="total-practice-questions">0</span>
</div>
</div>
</div>
</div>
<div class="dashboard-card mastery-card">
<h2 class="card-title">Mastery by Period</h2>
<div class="mastery-list" id="mastery-list" role="list">
<!-- Period mastery items will be dynamically generated -->
</div>
</div>
<div class="dashboard-card recommendation-card">
<h2 class="card-title">Study Next</h2>
<div class="recommendation-content" id="recommendation-content">
<p class="recommendation-text">Complete a period to get personalized recommendations</p>
</div>
</div>
<div class="dashboard-card weaknesses-card">
<h2 class="card-title">Weakest Themes</h2>
<div class="weaknesses-list" id="weaknesses-list" role="list">
<!-- Weak themes will be dynamically generated -->
</div>
</div>
<div class="dashboard-card skills-card">
<h2 class="card-title">AP Exam Skills Progress</h2>
<div class="skills-grid" id="skills-grid" role="list">
<!-- Skills will be dynamically generated -->
</div>
</div>
<div class="dashboard-card activity-card">
<h2 class="card-title">Recent Activity</h2>
<div class="activity-list" id="activity-list" role="list">
<!-- Activity items will be dynamically generated -->
</div>
</div>
</div>
</div>
</section>
</main>
<footer class="footer" role="contentinfo">
<div class="container">
<p>© 2026 APUSH Learning Hub. Designed for AP U.S. History exam preparation.</p>
</div>
</footer>
<script src="user-session.js"></script>
<script src="auth-guard.js"></script>
<script src="apush-data.js"></script>
<script src="openai-api.js"></script>
<script src="script.js"></script>
<script src="theme-toggler.js"></script>
<script src="settings-modal.js"></script>
<script src="museum-reveal.js" defer></script>
<script src="dashboard.js"></script>
</body>
</html>