(OUI Next Theme) Alerting

[KrooshalUX]

This issue to be transferred to corresponding repository

I am working on launching new light and dark mode themes provided by OUI component library for a target launch within 2.10. These changes support the vision expressed in Future Vision for Dashboards

I have identified the following front end related issues that prevent the theme from appearing complete and potential solutions within this feature:

Global

• Duplicate breadcrumb appears on page. Breadcrumb should appear within EuiHeader.

Create Monitor flow

• Query section: empty state (before a user selects an index) appears with a border with a manually set color value. In dark mode, this appears as a bright-white border.
  - Resolution Option 1 (best): To align to best practices, EuiEmptyPrompt should be used for empty states.
  - Resolution Option 2 (ok for short term): Remove hard coded color value in favor of using sass variable $ouiColorLightShade that will adjust appropriately across light and dark mode

• Trigger section: Empty state "loading destinations" appears on a background with a manually set background color value. In dark mode, this appears as a bright-white background and the text is not legible.
  - Resolution Option 1 (best): To align to best practices, EuiEmptyPrompt should be used for empty loading state
  - Resolution Option 2 (ok for short term): Remove background

• "Monitor defining method", "You can add up to 9 more triggers.": Description text is set to extra small. This is creating contrast issues and a11y tests fail. The minimum description text size should be m. Only in special cases should s and xs should be used.