Add visual feedback for unread messages in the menu. Implement a pulsing animation and color change for the inbox button when there are unread chats. Also, add sound notification for new messages received, enhancing user experience.

This commit is contained in:
Torsten Schulz (local)
2025-12-05 11:54:33 +01:00
parent 38f7eecfd7
commit 283880dc7d
3 changed files with 32 additions and 1 deletions

View File

@@ -67,6 +67,24 @@ html, body, #app {
background-color: #52a052;
}
.menu button.has-unread {
background-color: #ff6b6b;
animation: pulse 2s infinite;
}
.menu button.has-unread:hover {
background-color: #ff5252;
}
@keyframes pulse {
0%, 100% {
opacity: 1;
}
50% {
opacity: 0.8;
}
}
.menu span {
display: inline-block;
padding: 0.375em 0.4em;