[Carbon 10: Notification] Inline notification visual issues

Detailed description

Describe in detail the issue you’re having.

1. The warning notification has a transparent background so if it’s applied to any thing other than a white background the color doesn’t stay consistent (could use the sass mix function to blend it with white to make it opaque if it’s not in the IBM DL color palette)
2. Timestamp styling is not supported in inline notifications but is in toast notifications. I’d like to apply the same styles for both notification types without having to copy and past Carbon’s code in to my style sheets.

Is this issue related to a specific component?

Notification

What did you expect to happen? What happened instead? What would you like to see changed?

1. The background on the information notification is opaque
2. I don’t have to copy and paste Carbon’s code to style a timestamp

What browser are you working in?

Chrome

What version of the Carbon Design System are you using?

v10.0.0

What offering/product do you work on? Any pressing ship or release dates we should be aware of?

Watson Health Pattern & Asset Library (PAL)

Steps to reproduce the issue

Issue 1

1. Change the page background color when using a warning notification

Issue 2

1. Add a time stamp to an inline notification

Additional information

[janedepgen]

@elizabethsjudd we should update to align to Carbon - thinking about the use case of inline notifications vs toast notifications, it makes more sense to just include timestamps for the toast variant 👍

[aagonzales]

The inline notifications were not originally designed to have a time stamp. We can maybe add it as a optional feature for inline but I’d like to see some research and guidelines around when and where a timestamp should be used with notifications before making it part of the default. If you have any information or thoughts around this topic we’d love to hear it.