[openstreetmap/openstreetmap-website] Change the way notifications about messages appear (PR #4070)

[cmoffroad]

Great idea, @Dimitar5555! 

When it comes to UX, using red for notification badges is a standard approach in popular design systems such as Android, iOS, and [Material.io](https://m3.material.io/components/badges/overview)

@gravitystorm It's important to note that red doesn't necessarily mean an error. Instead, it signifies the need for user attention and action, which is a perfect fit for notifications. While red has historically been associated with errors in forms and dialogs (alerts) and classified as a danger/error color in style sheets, many design systems continue to use it for notifications.

On the other hand, blue (specifically, the "bg-info" shade) typically denotes information that doesn't require action. Using blue for notifications would contradict the purpose of making this feature more prominent.

That being said, I would love to see a more modern design with rounded avatars and aligned badges, something like:

<img width="225" alt="Screen Shot 2566-07-10 at 22 52 56" src="https://github.com/openstreetmap/openstreetmap-website/assets/2485196/c3cf5936-afb5-4d4a-919c-5df6bd00d922">



-- 
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/pull/4070#issuecomment-1629242772
You are receiving this because you are subscribed to this thread.

Message ID: <openstreetmap/openstreetmap-website/pull/4070/c1629242772 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20230710/f4d1a4e2/attachment.htm>