Define solution to resolve button requirement for System Status

[bhoppers2008]

Description Currently the System Status component is misusing sentiment buttons in order to provide inline actions. Salt provides guidance that sentiment buttons should be used/ considered independantly of status (i.e., just because an 'error' status is used, does not mean a 'negative' sentiment button is the correct choice).

Furthermore, two problems exist:

1. In current theme, sentiment solid buttons are not the same color as the status background.
2. In Next theme, status is currently not wired up to accent palette group in the same way that sentiment is wired up to accent. This means in Ligh/Dark Teal modes, teal buttons are displayed on the Info System Status.

Requirement Identify a holistic solution which enables actions to be displayed inline within the System Status component and doesn't conflict with our guidance on use of sentiment buttons relative to status.

Stakeholder Global banking/ Pepper pattern library.

Goal The goal of this issue is to agree a written proposition that we can confidently move into design and development.

[origami-z]

Scope to define before thinking about visual implementation (notes for myself)

• Where; can/can't
  • used within certain type of component? (e.g. system banner, grid)
  • with characteristics? (e.g. yes for status, never for sentiment, variant? appearance?)
• What styling options needs to be "concerned" / designed around? (e.g. mode, accent, anything else?)
• What; is Button the only component will have this problem? Any other potential "nesting" / inline interactive problem?
• Props; which of Button props this "shouldn't" have. appearance/sentiment

---

Token consideration: Actionable - >

Contrast: there isn't an universal formular to calculate contrast with transparency. Can we only use eye drop on our existing status strong colors to test?

[dplsek]

Salt Next design proposal

Salt Current design proposal