teodosii / react-notifications-component

Delightful and highly customisable React Component to notify your users
https://teodosii.github.io/react-notifications-component/
MIT License
1.27k stars 73 forks source link

Notification blinks when it appears #172

Open FanManutd opened 1 year ago

FanManutd commented 1 year ago

Hi! Notification blinks when it appears with minimum settings.

1

This does not happen on the demo page.

Sandbox here

Any idea how to fix this?

teodosii commented 1 year ago

That is indeed very odd, I will need to try to debug this behavior, it seems there's something going on in the codebox environment, even the samples I use on demo don't work there apparently but I have no clue why atm.

cjpgaspar commented 1 year ago

I had the same issue, fixed it temporarily with a transition like so:

div[class^="rnc__notification-container--"] {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.5s linear;
}
div[class^="rnc__notification-container--"]:has(> .rnc__notification) {
  visibility: visible;
  opacity: 1;
}