Description
monday.com sync: #9434628486
Description
Currently, the majority of our components can have their font set by simply setting a font-family
on an element. However, some require an additional rule to be set with --calcite-sans-family
, for example, Action and List:
Suggest having all components inherit from a font-family
set on a parent component.

Acceptance Criteria
As a user, I can easily override all fonts in my Calcite application with a single declaration.
Relevant Info
Codepen: https://codepen.io/mac_and_cheese/pen/NWExrER?editors=1000
The story for --calcite-sans-family
is also unclear to me, do we need this variable, or could it be a more generic `--calcite-ui-font-family"?
For instances where text defined via prop is desired to have different fonts within the same component, that's really a story for css parts - which we do want to tackle but as part of a larger effort in the ... future.
Which Component
It's defined in a handful of components - Action, List, etc.
Example Use Case
As a user, I want to be able to easily override the font for my entire application with one declaration.
Priority impact
p3 - want for upcoming milestone
Esri team
Calcite (design)