Bugzilla

We would like to create a new `moz-message-bar` reusable web component to replace the existing [message-bar](https://searchfox.org/mozilla-central/source/toolkit/content/widgets/message-bar.js) custom element.

The current `message-bar` implementation has a few issues that we would like to address:

* It has an [explicit dependency](https://searchfox.org/mozilla-central/source/toolkit/content/widgets/message-bar.js#34-36) on `in-content/common.css` and ends up pulling those styles into the chrome via it's inclusion in [notificationbox.js](https://searchfox.org/mozilla-central/source/toolkit/content/widgets/notificationbox.js#611-614) and in the [unified extensions](https://searchfox.org/mozilla-central/source/browser/base/content/browser-addons.js#1877-1908) UI.
* The colors/styles haven't been updated in a while and don't really match the rest of the Firefox UI.
* We have redundant message bar implementations - i.e. elements that look and act almost exactly like message bars, but which have re-implemented the markup and styling in different ways instead of using the `message-bar` element.

In order to be able to address these issues incrementally we will take the approach of first building a new `moz-message-bar` component then gradually using it to replace current instances of `message-bar` and `message-bar`-like elements.

We would like to create a new `moz-message-bar` reusable web component to replace the existing [message-bar](https://searchfox.org/mozilla-central/source/toolkit/content/widgets/message-bar.js) custom element.

The current `message-bar` implementation has a few issues that we would like to address:

* It has an [explicit dependency](https://searchfox.org/mozilla-central/source/toolkit/content/widgets/message-bar.js#34-36) on `in-content/common.css` and ends up pulling those styles into the chrome via it's inclusion in [notificationbox.js](https://searchfox.org/mozilla-central/source/toolkit/content/widgets/notificationbox.js#611-614) and in the [unified extensions](https://searchfox.org/mozilla-central/source/browser/base/content/browser-addons.js#1877-1908) UI.
* The colors/styles haven't been updated in a while and don't really match the rest of the Firefox UI. There are also accessibility issues with the contrast between the buttons and the message bar background for a few of the variants.
* We have redundant message bar implementations - i.e. elements that look and act almost exactly like message bars, but which have re-implemented the markup and styling in different ways instead of using the `message-bar` element.

In order to be able to address these issues incrementally we will take the approach of first building a new `moz-message-bar` component then gradually using it to replace current instances of `message-bar` and `message-bar`-like elements.