Flyout notifications can have a status

[nfiniteset]

Work w/ Isabela
https://wiki.autodesk.com/display/HIG/Notifications+Flyout

[IsabelaKlaus]

@aneyzberg Hi there, I've updated the Sketch for this item on master. Wiki is also up to date
Latest changes were:
• replaced dots with bars
• rounded edges of thumbnails
• added dark themes

[aneyzberg]

Here is the storybook story link - https://hig-features-notifications-into-react.surge.sh/?knob-Name=Jon%20Snow&knob-Size=large&knob-Unread%20count=3&knob-Loading%20Indicator=false&selectedKind=Notifications&selectedStory=interactive%20V1&full=0&addons=1&stories=1&panelRight=0&addonPanel=storybook%2Factions%2Factions-panel

Notifications v1 is the one that is interactive. so if you click on the icon it will open the flyout. This maintains the current read/unread behavior - where if a link is clicked, the notification is marked as read and the left hand border will change to the grey default color.

@nfiniteset @eskfung Design for this version is close except:

1. Header font: should be Body Bold 14px
2. Header height: 50 px
3. Notification counter font: Bold 11 px
4. All around internal cell padding: 16 px (except for right margin next to close button which is 12 px), see screen shots below

5. Time stamping should follow content patterns described here (consistent through all notifications): https://wiki.autodesk.com/display/HIG/Notifications+Flyout