padreug/web-app
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: Enhance Navbar and IdentityDialog components with improved functionality and logging

Browse source 
- Update Navbar to close the mobile menu when opening the identity dialog.
- Add debug logging to IdentityDialog to track changes in the dialog's open state.
- Adjust styling for mobile menu and dialog content for better responsiveness.
This commit is contained in:
padreug 2025-07-07 01:09:03 +02:00
parent 236a8a59b9
commit 5175c20d82
2 changed files with 7 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/layout/Navbar.vue
View file

@ -36,6 +36,8 @@ const toggleTheme = () => {
const openIdentityDialog = () => {
showIdentityDialog.value = true
// Close mobile menu when opening dialog
isOpen.value = false
}
</script>
@ -119,11 +121,11 @@ const openIdentityDialog = () => {
<!-- Mobile menu -->
<div v-show="isOpen"
class="absolute left-0 right-0 top-14 z-[100] border-b bg-background/95 backdrop-blur-sm md:hidden">
class="absolute left-0 right-0 top-14 z-40 border-b bg-background/95 backdrop-blur-sm md:hidden">
<div class="space-y-1 p-4">
<!-- Identity in mobile menu -->
<div class="mb-4 px-2">
<Button v-if="!identity.isAuthenticated.value" variant="outline" size="sm" @click="openIdentityDialog; isOpen = false" class="w-full gap-2">
<Button v-if="!identity.isAuthenticated.value" variant="outline" size="sm" @click="openIdentityDialog" class="w-full gap-2 min-h-[44px] touch-manipulation">
<User class="h-4 w-4" />
Connect Identity
</Button>
@ -134,7 +136,7 @@ const openIdentityDialog = () => {
<Badge variant="secondary" class="text-xs ml-auto">Connected</Badge>
</div>
<div class="space-y-1">
<Button variant="ghost" size="sm" @click="openIdentityDialog; isOpen = false" class="w-full justify-start gap-2">
<Button variant="ghost" size="sm" @click="openIdentityDialog" class="w-full justify-start gap-2">
<User class="h-4 w-4" />
Profile
</Button>

3
src/components/nostr/IdentityDialog.vue
View file

@ -23,6 +23,7 @@ interface Emits {
const props = defineProps<Props>()
const emit = defineEmits<Emits>()
// Form states
const importKey = ref('')
const usePassword = ref(false)
@ -145,7 +146,7 @@ function initializeProfileForm() {
<template>
<Dialog :open="isOpen" @update:open="handleClose">
<DialogContent class="sm:max-w-[600px] max-h-[80vh] overflow-y-auto">
<DialogContent class="w-[95vw] sm:max-w-[600px] max-h-[90vh] overflow-y-auto p-4 sm:p-6">
<DialogHeader>
<DialogTitle class="flex items-center gap-2">
<Key class="w-5 h-5" />