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

style: Update Badge colors in Navbar and ChatComponent for better visibility

Browse source 
- Change Badge background color from red to blue in both Navbar and ChatComponent to enhance visual consistency and improve user experience.
- Ensure that unread message indicators are more visually appealing and aligned with the overall design theme.
This commit is contained in:
padreug 2025-08-09 23:51:35 +02:00
parent 9b280be1a1
commit 147cf31f0f
2 changed files with 7 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/nostr/ChatComponent.vue
View file

@ -13,7 +13,7 @@
Disconnected
</Badge>
<!-- Total unread count -->
<Badge v-if="totalUnreadCount > 0" variant="destructive" class="text-xs">
<Badge v-if="totalUnreadCount > 0" class="bg-blue-500 text-white text-xs">
{{ totalUnreadCount }} unread
</Badge>
</div>
@ -91,7 +91,7 @@
</div>
<!-- Unread message indicator -->
<div v-if="getUnreadCount(peer.pubkey) > 0" class="flex-shrink-0">
<Badge variant="destructive" class="h-6 w-6 rounded-full p-0 flex items-center justify-center text-xs font-bold">
<Badge class="bg-blue-500 text-white h-6 w-6 rounded-full p-0 flex items-center justify-center text-xs font-bold">
{{ getUnreadCount(peer.pubkey) > 99 ? '99+' : getUnreadCount(peer.pubkey) }}
</Badge>
</div>
@ -133,7 +133,7 @@
Disconnected
</Badge>
<!-- Unread count for current peer -->
<Badge v-if="selectedPeer && getUnreadCount(selectedPeer.pubkey) > 0" variant="destructive" class="text-xs">
<Badge v-if="selectedPeer && getUnreadCount(selectedPeer.pubkey) > 0" class="bg-blue-500 text-white text-xs">
{{ getUnreadCount(selectedPeer.pubkey) }} unread
</Badge>
</div>
@ -198,7 +198,7 @@
Disconnected
</Badge>
<!-- Total unread count -->
<Badge v-if="totalUnreadCount > 0" variant="destructive" class="text-xs">
<Badge v-if="totalUnreadCount > 0" class="bg-blue-500 text-white text-xs">
{{ totalUnreadCount }} unread
</Badge>
</div>
@ -278,7 +278,7 @@
</div>
<!-- Unread message indicator -->
<div v-if="getUnreadCount(peer.pubkey) > 0" class="flex-shrink-0">
<Badge variant="destructive" class="h-6 w-6 rounded-full p-0 flex items-center justify-center text-xs font-bold">
<Badge class="bg-blue-500 text-white h-6 w-6 rounded-full p-0 flex items-center justify-center text-xs font-bold">
{{ getUnreadCount(peer.pubkey) > 99 ? '99+' : getUnreadCount(peer.pubkey) }}
</Badge>
</div>