Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Introduce $ouiInfoColor and $ouiInfoLinkColor #1161

Open
canascar opened this issue Nov 20, 2023 · 7 comments
Open

Introduce $ouiInfoColor and $ouiInfoLinkColor #1161

canascar opened this issue Nov 20, 2023 · 7 comments
Assignees
Labels
enhancement New feature or request ux/ui

Comments

@canascar
Copy link
Member

canascar commented Nov 20, 2023

Is your feature request related to a problem? Please describe.

Currently OpenSearch UI currently maps information link colors to ouiColorPrimary or ouiLinkColor. This creates a conflict in color indication when we move to Next dark/light as Primary and Secondary/Success colors map to a green tone which makes it difficult and confusing for a customer user to differentiate between the meaning of the indicated color, primarily in callouts and information related links.

Describe the solution you'd like

We would like to introduce two new variables:
$ouiInfoColor - using a color that is significantly different from $ouiColorPrimary
$ouiInfoColorLink - using a color that is significantly different from $ouiLinkColor

$ouiLinkColor / $ouiInfoLinkColor:
Next Dark: #0FABFF
Next Light: #1390E6

Describe alternatives you've considered

Additional context

Components that should map to this color:
Callout (Info)
Info button type in all styles and sizes
Health - Active state
(May add more to this list - progress?)

Adding @kgcreative for visibility

@canascar canascar added the enhancement New feature or request label Nov 20, 2023
@canascar canascar added ux/ui and removed untriaged labels Nov 20, 2023
@kgcreative
Copy link
Member

We should start with callout (info) and add a new option to toast (info)

@kgcreative
Copy link
Member

Button & Link i would want to consider a bit more

@xeniatup
Copy link

One more request for mapping for $ouiInfoColor- informational severity level badge.
See opensearch-project/security-analytics-dashboards-plugin#760 for more details.

@canascar
Copy link
Member Author

One more request for mapping for $ouiInfoColor- informational severity level badge. See opensearch-project/security-analytics-dashboards-plugin#760 for more details.

Badging colors are currently unaffected by this as "primary" badge color still displays as blue but we can certainly consider updating the naming schema for badging.

@canascar
Copy link
Member Author

canascar commented Nov 20, 2023

We should start with callout (info) and add a new option to toast (info)

There is currently an Info toast, we just need to modify and add the indicator top border to it. I can add an issue for follow-up.

@canascar
Copy link
Member Author

canascar commented Nov 21, 2023

This issue is for adding the color variables $ouiInfoColor and $ouiInfoLinkColor. I will make separate detailed issues for components that will use these new color styles.

@BSFishy BSFishy removed the untriaged label Nov 27, 2023
@tanupa
Copy link

tanupa commented Nov 27, 2023

I can take this on!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request ux/ui
Projects
None yet
Development

No branches or pull requests

6 participants