feat: Add logo and enhance login functionality

- Introduce a new logo asset for branding.
- Update LoginDialog.vue to include routing for successful login and registration.
- Modify Navbar.vue to integrate LoginDialog and manage its visibility.
- Revise Login.vue to update the logo and welcome title, along with routing enhancements post-login and registration.

src/components/layout/Navbar.vue

@@ -7,6 +7,7 @@ import { Badge } from '@/components/ui/badge'
 import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from '@/components/ui/dropdown-menu'
 import { Sun, Moon, Menu, X, User, LogOut } from 'lucide-vue-next'
 import LanguageSwitcher from '@/components/LanguageSwitcher.vue'
+import LoginDialog from '@/components/auth/LoginDialog.vue'
 import { auth } from '@/composables/useAuth'
 
 interface NavigationItem {
@@ -17,6 +18,7 @@ interface NavigationItem {
 const { t } = useI18n()
 const { theme, setTheme } = useTheme()
 const isOpen = ref(false)
+const showLoginDialog = ref(false)
 
 const navigation = computed<NavigationItem[]>(() => [
   { name: t('nav.home'), href: '/' },
@@ -32,6 +34,11 @@ const toggleTheme = () => {
   setTheme(theme.value === 'dark' ? 'light' : 'dark')
 }
 
+const openLoginDialog = () => {
+  showLoginDialog.value = true
+  isOpen.value = false // Close mobile menu
+}
+
 const handleLogout = async () => {
   try {
     await auth.logout()
@@ -89,7 +96,7 @@ const handleLogout = async () => {
             </DropdownMenuContent>
           </DropdownMenu>
 
-          <Button v-else variant="outline" size="sm" class="gap-2">
+          <Button v-else variant="outline" size="sm" @click="openLoginDialog" class="gap-2">
             <User class="h-4 w-4" />
             Login
           </Button>
@@ -124,6 +131,7 @@ const handleLogout = async () => {
         <!-- Authentication in mobile menu -->
         <div class="mb-4 px-2">
           <Button v-if="!auth.isAuthenticated.value" variant="outline" size="sm"
+            @click="openLoginDialog"
             class="w-full gap-2 min-h-[44px] touch-manipulation">
             <User class="h-4 w-4" />
             Login
@@ -168,5 +176,7 @@ const handleLogout = async () => {
       </div>
     </div>
 
+    <!-- Login Dialog -->
+    <LoginDialog v-model:is-open="showLoginDialog" />
   </nav>
 </template>