feat: Implement initial e-learning platform frontend structure including dashboard, course management, authentication, and common UI components.

Frontend-Learner/layouts/default.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
 /**
  * @file default.vue
- * @description Master layout for the EduLearn platform.
+ * @description เลย์เอาต์หลัก (Master Layout) สำหรับผู้ใช้งานที่เข้าสู่ระบบแล้ว 
+ * ประกอบด้วยแถบเมนูด้านบน (Header), แถบเมนูด้านข้าง (Sidebar) และพื้นที่เนื้อหา
  */
 
 useThemeMode()
@@ -13,7 +14,7 @@ const toggleLeftDrawer = () => {
 }
 
 const route = useRoute()
-// Show sidebar for these routes
+// ระบุว่า path ไหนบ้างที่ให้แสดงแถบเมนูด้านข้าง (Sidebar)
 const isDashboardRoute = computed(() => {
   const routes = ['/dashboard', '/browse', '/classroom', '/course']
   return routes.some(r => route.path.startsWith(r))
@@ -23,14 +24,14 @@ const isDashboardRoute = computed(() => {
 <template>
   <q-layout view="lHh Lpr lFf" class="bg-[#F8FAFC] dark:!bg-[#020617] text-slate-900 dark:!text-slate-50">
     
-    <!-- Header -->
+    <!-- ส่วนหัว (Header) -->
     <q-header
       class="bg-transparent text-slate-900 dark:!text-white border-none shadow-none"
     >
       <AppHeader @toggleSidebar="toggleLeftDrawer" />
     </q-header>
 
-    <!-- Navigation Sidebar -->
+    <!-- แถบเมนูด้านข้าง (Navigation Sidebar) -->
     <q-drawer
       v-model="leftDrawerOpen"
       show-if-above
@@ -42,7 +43,7 @@ const isDashboardRoute = computed(() => {
       <AppSidebar />
     </q-drawer>
 
-    <!-- Main Content Area -->
+    <!-- พื้นที่แสดงเนื้อหาหลัก (Main Content Area) -->
     <q-page-container>
       <q-page class="px-3 py-6 md:p-8">
         <div class="max-w-[1600px] mx-auto">