Esri / calcite-design-system

A monorepo containing the packages for Esri's Calcite Design System
https://developers.arcgis.com/calcite-design-system/
Other
280 stars 76 forks source link

Avatar: add option to set the background color #4900

Open benelan opened 2 years ago

benelan commented 2 years ago

Description

Add a CSS variable or property that allows users to change the background color of calcite-avatar. That is a pretty common use case in profile configuration. The app developer would have to choose colors that meet contrast ratio guidelines, and then the user could select one of those colors in the profile UI.

Acceptance Criteria

A CSS variable (my preference) or property for changing calcite-avatar's background color.

Relevant Info

From https://community.esri.com/t5/calcite-design-system-questions/avatar-choose-colour-and-3-character-id-display/m-p/1191371

Which Component

calcite-avatar

Example Use Case

Like how Esri Community lets you choose different background colors for globes: image

Only it would be different background colors w/ initials for calcite-avatar.

geospatialem commented 10 months ago

Related to efforts from https://github.com/Esri/calcite-design-system/issues/7180.

Additional consideration: Add a screenshot test to ensure color contrast is part of the effort with sufficient foreground and background contrast.

evan-cx commented 4 months ago

Our team would like this implemented