ux: Light Theme Accessibility

[alecjacobs5401]

Description

Backstage instances that use a Custom Theme (or the builtin Light Theme) have a few accessibility issues when it comes to some of the component variant usage/colors.

Primarily, the Buttons to Create new Questions blend in with the background and look like they are disabled and not actionable at an immediate glance

Examples

Landing Page with no Questions Asked

• The Go Ahead and Ask One! button looks like just plain text
• The Ask Question in the top right doesn't look actionable and is hard to see immediately

Asking a Question

• The POST button in the bottom left to submit the Form looks like it is disabled and not actionable when the question is properly filled out

Answering a Question

Similar issues, most buttons blend into background or look disabled

Expected Behavior

These buttons should respect the configured primary theme colors defined in a Backstage instance

For example, our theme uses a Lighter Green for Primary actions/buttons

Ideally, this plugin continued using the theme for actions/buttons.

[drodil]

Thanks for the report! Good findings and should be quite easy to fix. The plugin uses the default MUI components and styles with only few exceptions. It's a bit weird that the default theme renders these so badly. Have to try this out with the light theme a bit more and maybe convert these buttons to follow the primary button style, like you suggested.

I will check this tomorrow!

[drodil]

Hm. With the default light theme, the buttons look fine:

Could it be just your theme that messes the font color in the button? I might still try the primary buttons for this.

[drodil]

This is now released in 1.3.1, please try it out!

[alecjacobs5401]

Awesome, thanks @drodil! Updating now - looks great!