Dashboard selector color tied to element focus color

andeb31

I would like to change the color of the buttons in a Category Selector without also changing the "focus" indicator color when utilizing keyboard navigation. Currently, both the Selector color and focus color are linked to the "Accent color" in the custom theme settings. This is very restricting when it comes to applying an organization theme and ensuring color contrast meets WCAG compliance. Can we get a color setting directly in the Selector widget? In my example, the accent color is set to black to stand out against the white background, however that makes the black text on the red background non-compliant.

 

 

KlaraSchmitt

Hello @andeb31 

I understand why you are frustrated and while I cannot immediately solve your issue, I thought I might be able to explain why it's happening.

ArcGIS Dashboards uses the Calcite Design System, which means that when an app offers color customization, they still have to map the value you enter to an existing color value in the design system. This ensures that any color you select carries across all the design system components in a way that won't result in unexpected contrast failures down the line. The design system color palette has a limited number of color variables available to make sure all their components interconnect and work in both light and dark modes. This is why accent color is controlling both focus state and selection state. Typically, it is assumed that link color will pass against the fill color and therefore it is also safe for the focus color and selection to use link color.

Dashboards also ties these two values tied together. Set accent color and the link color uses a similar shade that is automatically darkened a bit. But that does not help you with the header. What you might be able to do is make an enhancement request to them that all elements and states within the header only use the values of 'header text color' and 'header foreground color.' They might be able to overwrite the default color values of that component easier than they can separate out focus and selection color variables.