Popup notification icon

Background / User story

As ABP I would like to make the popup notification visible so user will understand why we animated the task icon

What to change

• Design: https://gitlab.com/eyeo/adblockplus/abpui/adblockplusui/uploads/408f6f070afbfdcf2de96dfe66ba6a2f/notifications.mp4
• Research: None.
• Spec: eyeo/specs/spec!301

Hints for testers

Either try to simulate real notifications or simply copy and paste the following JS within the bubble-ui (popup) inspector:

dispatchEvent(new CustomEvent("extension:notification", {
  detail: {
    type: "information", // or "critical"
    texts: {
      title: "Title for a notification",
      message: "There is something to read here"
    }
  }
}));

Feel free to use a title that spans over 2 lines to see the icon is still centered, but also be sure longer text messages don't overflow anywhere.

Hints for translators

N/A

Integration notes

N/A