From 13ad2097df646f708496f6aac263e87e1b531502 Mon Sep 17 00:00:00 2001
From: supalerk-ar66 <supalerk_ar66@live.rmutl.ac.th>
Date: Fri, 20 Feb 2026 15:18:30 +0700
Subject: [PATCH] feat: Implement default authenticated user layout and initial
 dashboard pages for 'My Courses' and 'Profile'.

---
 Frontend-Learner/layouts/default.vue            | 8 +-------
 Frontend-Learner/pages/dashboard/my-courses.vue | 2 +-
 Frontend-Learner/pages/dashboard/profile.vue    | 6 +++---
 3 files changed, 5 insertions(+), 11 deletions(-)

diff --git a/Frontend-Learner/layouts/default.vue b/Frontend-Learner/layouts/default.vue
index cd8e6b9e..55479ed9 100644
--- a/Frontend-Learner/layouts/default.vue
+++ b/Frontend-Learner/layouts/default.vue
@@ -48,13 +48,7 @@ const shouldHideSidebar = computed(() => {
       </q-page>
     </q-page-container>
 
-    <!-- Mobile Bottom Nav -->
-    <q-footer
-      v-if="$q.screen.lt.md"
-      class="!bg-white dark:!bg-[#1e293b] text-primary"
-    >
-       <MobileNav />
-    </q-footer>
+
   </q-layout>
 </template>
 
diff --git a/Frontend-Learner/pages/dashboard/my-courses.vue b/Frontend-Learner/pages/dashboard/my-courses.vue
index f95fcba0..703803a7 100644
--- a/Frontend-Learner/pages/dashboard/my-courses.vue
+++ b/Frontend-Learner/pages/dashboard/my-courses.vue
@@ -200,7 +200,7 @@ const validCourseId = computed(() => {
     <div v-if="isLoading" class="flex justify-center py-20">
        <q-spinner size="3rem" color="primary" />
     </div>
-    <div v-else class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+    <div v-else class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
       <template v-for="course in filteredEnrolledCourses" :key="course.id">
         <!-- In Progress Course Card -->
         <CourseCard 
diff --git a/Frontend-Learner/pages/dashboard/profile.vue b/Frontend-Learner/pages/dashboard/profile.vue
index 76663e97..be58fc39 100644
--- a/Frontend-Learner/pages/dashboard/profile.vue
+++ b/Frontend-Learner/pages/dashboard/profile.vue
@@ -294,7 +294,7 @@ onMounted(async () => {
         <!-- View Details Content -->
         <div class="p-8 md:p-12 flex-grow">
            <div class="max-w-3xl mx-auto h-full fade-in">
-              <h3 class="text-sm font-black text-slate-400 dark:text-slate-500 uppercase tracking-widest flex items-center gap-2 mb-8">
+              <h3 class="text-sm font-black text-slate-700 dark:text-slate-300 uppercase tracking-widest flex items-center gap-2 mb-8">
                  <span class="w-2 h-2 bg-blue-600 rounded-full"></span> {{ $t('profile.accountDetails') }}
               </h3>
               <div class="grid grid-cols-1 md:grid-cols-2 gap-x-12 gap-y-8">
@@ -303,7 +303,7 @@ onMounted(async () => {
                        <q-icon name="smartphone" size="24px" />
                     </div>
                     <div>
-                       <div class="text-[10px] font-black text-slate-400 dark:text-slate-500 uppercase tracking-wider mb-0.5">{{ $t('profile.phone') }}</div>
+                       <div class="text-[10px] font-black text-slate-500 dark:text-slate-400 uppercase tracking-wider mb-0.5">{{ $t('profile.phone') }}</div>
                        <div class="text-lg font-bold text-slate-900 dark:text-white tracking-tight">{{ userData.phone || '-' }}</div>
                     </div>
                  </div>
@@ -312,7 +312,7 @@ onMounted(async () => {
                        <q-icon name="calendar_today" size="24px" />
                     </div>
                     <div>
-                       <div class="text-[10px] font-black text-slate-400 dark:text-slate-500 uppercase tracking-wider mb-0.5">{{ $t('profile.joinedAt') }}</div>
+                       <div class="text-[10px] font-black text-slate-500 dark:text-slate-400 uppercase tracking-wider mb-0.5">{{ $t('profile.joinedAt') }}</div>
                        <div class="text-lg font-bold text-slate-900 dark:text-white tracking-tight">{{ formatDate(userData.createdAt) }}</div>
                     </div>
                  </div>