Website Structure

Frontend-Learner/components/common/MobileNav.vue

@@ -0,0 +1,29 @@
+<script setup lang="ts">
+const route = useRoute()
+
+const navItems = [
+  { to: '/dashboard', icon: '🏠', label: 'หน้าหลัก' },
+  { to: '/browse/discovery', icon: '🔍', label: 'รายการคอร์ส' },
+  { to: '/dashboard/my-courses', icon: '📚', label: 'คอร์สของฉัน' }
+]
+
+const isActive = (path: string) => {
+  if (path === '/') return route.path === '/'
+  return route.path.startsWith(path)
+}
+</script>
+
+<template>
+  <nav class="mobile-nav">
+    <NuxtLink
+      v-for="item in navItems"
+      :key="item.to"
+      :to="item.to"
+      class="mobile-nav-item"
+      :class="{ active: isActive(item.to) }"
+    >
+      <span>{{ item.icon }}</span>
+      <span>{{ item.label }}</span>
+    </NuxtLink>
+  </nav>
+</template>