Change new notification dot in Notification center

I using the react plugin and have been trying to change the colour of the small red dot that appears on the react notification centre and the dot on unread notifications (they seem to be the same)

I've try using the props on the NotificationBell

<NotificationBell
  unseenBadgeColor={"#283CD7"}
  unseenBadgeBackgroundColor={"#283CD7"}
  colorScheme={"light"}
  unseenCount={unseenCount}
/>

<NotificationBell
  unseenBadgeColor={"#283CD7"}
  unseenBadgeBackgroundColor={"#283CD7"}
  colorScheme={"light"}
  unseenCount={unseenCount}
/>

and using the

INotificationCenterStyles

INotificationCenterStyles

styles.I can change the background colour but not the actual dot.

Inspecting element i can see I need to change the fill on this

<rect x="1.5" y="1.5" width="13" height="13" rx="6.5" fill="url(#paint0_linear_1722_2699)" stroke="#FFFFFF" stroke-width="3"></rect>

<rect x="1.5" y="1.5" width="13" height="13" rx="6.5" fill="url(#paint0_linear_1722_2699)" stroke="#FFFFFF" stroke-width="3"></rect>

Any one had some luck changing this icon or colour?

Novu•4y ago•

3 replies

turtles

Change new notification dot in Notification center

<NotificationBell
  unseenBadgeColor={"#283CD7"}
  unseenBadgeBackgroundColor={"#283CD7"}
  colorScheme={"light"}
  unseenCount={unseenCount}
/>

<NotificationBell
  unseenBadgeColor={"#283CD7"}
  unseenBadgeBackgroundColor={"#283CD7"}
  colorScheme={"light"}
  unseenCount={unseenCount}
/>

and using the

INotificationCenterStyles

INotificationCenterStyles

styles.I can change the background colour but not the actual dot.

Inspecting element i can see I need to change the fill on this

<rect x="1.5" y="1.5" width="13" height="13" rx="6.5" fill="url(#paint0_linear_1722_2699)" stroke="#FFFFFF" stroke-width="3"></rect>

<rect x="1.5" y="1.5" width="13" height="13" rx="6.5" fill="url(#paint0_linear_1722_2699)" stroke="#FFFFFF" stroke-width="3"></rect>

Any one had some luck changing this icon or colour?

Change new notification dot in Notification center

Similar Threads

Change new notification dot in Notification center

Similar Threads

Similar Threads

Similar Threads