Notifications look different from the design + are blocking

[tbsbdr]

Steps to reproduce

1. Login to https://ocis.ocis-web.latest.owncloud.works
2. create a new folder
3. Notifications look different from the design and blocks me from entering a search term

Expected behaviour

• Notification design should be in line with the design
• Notification should should non-blocking:
  • move to bottom
  • animation: "slide in" to catch attention since it moved out of focus
  • animation: "instant disappear" after some time or click on close "X"
  • add option "X" to close the notification
• find the exact styles here: https://www.figma.com/file/EqAiB1wY7cYaMaitjyzup3/Current-oC-Web-UI-Kit-(WIP)?node-id=1551%3A276254

In context

Outlines

Shadow and vertically aligned first row (along red line)

Actual behaviour

• Notifications look different from the design + are blocking

[tbsbdr]

@pascalwengerter @lookacat needs assessment on how notifications can stay accessible regarding focusmanagement I guess.

[tbsbdr]

Examples on where might users expect notifications?

[pascalwengerter]

Discussed with @tbsbdr that this ticket will re-scoped to "redesign & reposition" - adding animations, a close button and a potential further button/link as part of the message require more concepting & a11y considerations