From 4a3e56c4b15253e64e26035801343e949b37e863 Mon Sep 17 00:00:00 2001
From: Thiti Yamsung <mr.thiti@icloud.com>
Date: Thu, 5 Oct 2023 22:23:09 +0700
Subject: [PATCH] fix: notification count is overlap (#437)

---
 src/js/components/header/NotificationsButton.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/js/components/header/NotificationsButton.tsx b/src/js/components/header/NotificationsButton.tsx
index 582961683..a0c5a787c 100644
--- a/src/js/components/header/NotificationsButton.tsx
+++ b/src/js/components/header/NotificationsButton.tsx
@@ -22,13 +22,13 @@ export default function NotificationsButton() {
         className={`relative inline-block rounded-full ${isMyProfile ? 'hidden md:flex' : ''}`}
       >
         <Show when={activeRoute === '/notifications'}>
-          <HeartIconFull width={28} />
+          <HeartIconFull class={unseenNotificationCount ? 'mr-3' : ''} width={28} />
         </Show>
         <Show when={activeRoute !== '/notifications'}>
-          <HeartIcon width={28} />
+          <HeartIcon class={unseenNotificationCount ? 'mr-3' : ''} width={28} />
         </Show>
         <Show when={unseenNotificationCount}>
-          <span className="absolute top-0 right-0 transform translate-x-1/2 -translate-y-1/2 bg-iris-purple text-white text-sm rounded-full h-5 w-5 flex items-center justify-center">
+          <span className="absolute top-1 right-3 transform translate-x-1/2 -translate-y-1/2 bg-iris-purple text-white text-sm rounded-full h-5 w-5 flex items-center justify-center">
             {unseenNotificationCount > 99 ? '' : unseenNotificationCount}
           </span>
         </Show>