sosokker/B2D-Ventures
1
0
Fork 0
mirror of https://github.com/Sosokker/B2D-Ventures.git synced 2025-12-19 05:54:06 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: add notification badge with animated ping effect to navigation bar

Browse Source
This commit is contained in:
Pattadon 2024-11-11 11:08:36 +07:00
parent 2d79e5d898
commit 3d77bd59ba
1 changed files with 3 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/navigationBar/AuthenticatedComponents.tsx
View File

@ -32,6 +32,9 @@ export const AuthenticatedComponents = ({ uid, avatarUrl }: AuthenticatedCompone
<Link href={"/notification"}> <Link href={"/notification"}>
<div className="relative inline-block"> <div className="relative inline-block">
<Bell className="h-6 w-6 " /> <Bell className="h-6 w-6 " />
<span className="absolute -top-1 -right-1 inline-flex items-center justify-center w-4 h-4 text-xs font-bold text-white bg-red-600 rounded-full">
{displayValue}
</span>
<span className="absolute -top-1 -right-1 inline-flex items-center justify-center w-4 h-4 text-xs font-bold text-white bg-red-600 rounded-full animate-ping"> <span className="absolute -top-1 -right-1 inline-flex items-center justify-center w-4 h-4 text-xs font-bold text-white bg-red-600 rounded-full animate-ping">
{displayValue} {displayValue}
</span> </span>