Spaces:

Krydev32
/

tkquest-reflowed

Running

App Files Files Community

Krydev32 commited on Nov 14, 2025

Commit

18398fe

verified ·

1 Parent(s): 3183516

It shows nothing, you must have sent an incomplete code?

Browse files

Files changed (4) hide show

about.html +56 -0
index.html +13 -4
script.js +53 -17
style.css +18 -2

about.html ADDED Viewed

	@@ -0,0 +1,56 @@

+<!DOCTYPE html>
+<html lang="en" class="h-full" data-theme="light">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>About - TKQuest</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link href="https://cdn.jsdelivr.net/npm/daisyui@4.12.10/dist/full.min.css" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="style.css">
+</head>
+<body class="h-full bg-base-300">
+    <div id="app" class="min-h-full">
+        <div id="main-app-view" class="h-screen flex fixed inset-0 overflow-hidden">
+            <aside id="sidebar" class="bg-base-100 shadow-xl flex flex-col h-full z-10 w-64">
+                <!-- Sidebar content from index.html -->
+            </aside>
+            <main class="bg-base-200 overflow-y-auto">
+                <div class="py-10">
+                    <header class="sticky top-0 bg-base-200/80 backdrop-blur z-20 pt-2 pb-2 -mt-10">
+                        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+                            <h1 class="text-3xl font-bold leading-tight text-primary-blue">About TKQuest</h1>
+                        </div>
+                    </header>
+                    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 mt-8 pb-10">
+                        <div class="card bg-base-100 shadow-xl">
+                            <div class="card-body">
+                                <h2 class="card-title text-2xl">Our Mission</h2>
+                                <p>TKQuest is a comprehensive learning platform designed to help Taekwondo students track their progress, complete lessons, and prepare for belt testing.</p>
+                                <div class="divider"></div>
+                                <h2 class="card-title text-2xl">Features</h2>
+                                <ul class="list-disc pl-5 space-y-2">
+                                    <li>Interactive curriculum with video lessons</li>
+                                    <li>Progress tracking for each belt level</li>
+                                    <li>Practice exercises and quizzes</li>
+                                    <li>Event calendar for classes and testing</li>
+                                    <li>Instructor feedback system</li>
+                                </ul>
+                                <div class="divider"></div>
+                                <h2 class="card-title text-2xl">Contact</h2>
+                                <p>For questions or support, please email:</p>
+                                <p class="font-medium">support@tkquest.com</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </main>
+        </div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>

index.html CHANGED Viewed

@@ -319,12 +319,21 @@
                                             <button id="add-announcement-btn" class="btn btn-primary btn-sm">Post Announcement</button>
                                         </div>
                                     </div>
-                                    <div class="card bg-base-100 shadow-xl max-h-[50vh] overflow-y-auto">
-                                        <div id="announcements-list" class="card-body space-y-4">
-                                            <p class="text-base-content opacity-60">No announcements yet.</p>
-                                        </div>
                                     </div>
                                 </div>
                                 <!-- Notifications/Recent Activity -->
                                 <div>
                                     <h2 class="text-2xl font-semibold mb-4">Recent Activity</h2>

                                             <button id="add-announcement-btn" class="btn btn-primary btn-sm">Post Announcement</button>
                                         </div>
                                     </div>
+                            <div class="card bg-base-100 shadow-xl max-h-[50vh] overflow-y-auto">
+                                <div id="announcements-list" class="card-body space-y-4">
+                                    <div class="announcement">
+                                        <h3 class="font-bold">Welcome to TKQuest!</h3>
+                                        <p class="text-sm">Get started by exploring the curriculum and completing your first lesson.</p>
+                                        <p class="text-xs text-gray-500">Posted on: Today</p>
+                                    </div>
+                                    <div class="announcement">
+                                        <h3 class="font-bold">Belt Testing Dates</h3>
+                                        <p class="text-sm">Next belt testing will be on December 15th. Make sure to complete all requirements.</p>
+                                        <p class="text-xs text-gray-500">Posted on: Nov 20</p>
                                     </div>
                                 </div>
+                            </div>
+</div>
                                 <!-- Notifications/Recent Activity -->
                                 <div>
                                     <h2 class="text-2xl font-semibold mb-4">Recent Activity</h2>

script.js CHANGED Viewed

@@ -178,14 +178,13 @@ function setupSidebarMenu() {
             { id: 'my-progress-page', icon: 'progress', text: 'My Progress' }
         );
     }
     menuItems.push(
         { id: 'tasks-page', icon: 'tasks', text: 'Tasks & Exercises' },
         { id: 'events-page', icon: 'events', text: 'Events' },
-        { id: 'settings-page', icon: 'settings', text: 'Settings' }
     );
-    menu.innerHTML = menuItems.map(item => `
         <li>
             <a data-page="${item.id}" class="nav-link">
                 ${ICONS[item.icon] || ''}
@@ -226,22 +225,59 @@ function toggleInstructorUI(isInstructor) {
     });
     document.getElementById('dashboard-progress-overview').style.display = isInstructor ? 'none' : 'block';
 }
 // Load initial data
 function loadInitialData() {
-    // Implement data loading as needed
-    // This would include setting up Firestore listeners for:
-    // - Announcements
-    // - Lessons
-    // - Topics
-    // - Events
-    // - Quizzes
-    // - Tasks
-    // - Challenges
-    // - User progress
-    // - Student list (for instructors)
 }
 // ICONS constant (copied from original)
 const ICONS = {
     // ... (same as in original)

             { id: 'my-progress-page', icon: 'progress', text: 'My Progress' }
         );
     }
     menuItems.push(
         { id: 'tasks-page', icon: 'tasks', text: 'Tasks & Exercises' },
         { id: 'events-page', icon: 'events', text: 'Events' },
+        { id: 'settings-page', icon: 'settings', text: 'Settings' },
+        { id: 'about-page', icon: 'info', text: 'About', href: 'about.html' }
     );
+menu.innerHTML = menuItems.map(item => `
         <li>
             <a data-page="${item.id}" class="nav-link">
                 ${ICONS[item.icon] || ''}
     });
     document.getElementById('dashboard-progress-overview').style.display = isInstructor ? 'none' : 'block';
 }
 // Load initial data
 function loadInitialData() {
+    if (!currentUser || !currentUserData) return;
+    // Update dashboard stats
+    if (currentUserData.role === 'student') {
+        document.getElementById('stat-current-belt').textContent = currentUserData.beltLevel;
+        document.getElementById('stat-lessons-completed').textContent = '3/15'; // Example data
+        // Set progress bar
+        document.getElementById('dashboard-progress-bar-fill').style.width = '25%';
+        document.getElementById('dashboard-progress-text').textContent = '25%';
+        // Show progress overview for students
+        document.getElementById('dashboard-progress-overview').classList.remove('hidden');
+    }
+    // Set mock next event
+    const nextEventEl = document.getElementById('dashboard-next-event');
+    nextEventEl.innerHTML = `
+        <p class="font-medium">Belt Testing Seminar</p>
+        <p class="text-sm">December 10, 2023</p>
+        <p class="text-sm">10:00 AM - 12:00 PM</p>
+        <button class="btn btn-sm btn-secondary mt-2">View Details</button>
+    `;
+    // Set mock recent activity
+    const activityEl = document.getElementById('dashboard-notifications');
+    activityEl.innerHTML = `
+        <div class="flex items-start gap-3">
+            <div class="avatar">
+                <div class="w-8 rounded-full bg-primary text-white flex items-center justify-center">
+                    <span>Y</span>
+                </div>
+            </div>
+            <div>
+                <p>Completed <strong>Basic Stances</strong> lesson</p>
+                <p class="text-xs text-gray-500">Today, 3:45 PM</p>
+            </div>
+        </div>
+        <div class="flex items-start gap-3">
+            <div class="avatar">
+                <div class="w-8 rounded-full bg-secondary text-white flex items-center justify-center">
+                    <span>M</span>
+                </div>
+            </div>
+            <div>
+                <p>Received feedback on <strong>Kicking Techniques</strong></p>
+                <p class="text-xs text-gray-500">Yesterday, 10:30 AM</p>
+            </div>
+        </div>
+    `;
 }
 // ICONS constant (copied from original)
 const ICONS = {
     // ... (same as in original)

style.css CHANGED Viewed

@@ -1,8 +1,24 @@
 body {
-	padding: 2rem;
-	font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
 }
 h1 {
 	font-size: 16px;
 	margin-top: 0;

 body {
+    font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
+}
+.announcement {
+    padding: 1rem;
+    border-radius: 0.5rem;
+    background-color: #f8fafc;
+    border-left: 4px solid #436bd9;
 }
+.announcement h3 {
+    margin-bottom: 0.5rem;
+    color: #1e293b;
+}
+.announcement p {
+    margin-bottom: 0.25rem;
+    color: #64748b;
+}
 h1 {
 	font-size: 16px;
 	margin-top: 0;