p0lym0rphik/Greenwing

Suggestion: Better Web Notifications

Opened this issue · 3 comments

Hi there

Thank you for your work. we are using your theme in combination with https://github.com/cristidraghici/Kanext and it works just great.

One thing we noticed / changed was the way how the notifications bell behaves. Our team stated that it is near impossible to recognize whether you have unread notifications or not.

Therefore we added this custom css to make it more "visible". Feel free to use it:

6jzaDiKLEY

.web-notification-icon{
color:var(--link-color-primary) !important;
animation: bell 1s 1s both infinite;
}

@keyframes bell {
  0% { transform: rotate(0);  }
  10% { transform: rotate(30deg); }
  20% { transform: rotate(0); }
  80% { transform: rotate(0); }
  90% { transform: rotate(-30deg); }
  100% { transform: rotate(0); }
}

Awesome idea! Did a quick little search to see if there were any animations that had been created that used easing for a smoother animation, and I found https://codepen.io/Mrshcom/pen/bqmFg . Could be worth it to implement either one. I'd also suggest a notification badge. Doesn't really have to show how many notifications, but at least a dot to show that there's something.

Awesome idea! Did a quick little search to see if there were any animations that had been created that used easing for a smoother animation, and I found https://codepen.io/Mrshcom/pen/bqmFg . Could be worth it to implement either one. I'd also suggest a notification badge. Doesn't really have to show how many notifications, but at least a dot to show that there's something.

Thanks so much for this. It is awesome!

Hi, thanks for your comment, i do not have enough time to update this repository. I am open for PR.