Theming documentation (also when using react) - Calcite web

1005
5
08-22-2021 06:06 PM
David_Wilton
New Contributor II

I have tried setting the theme by specifying the theme attribute on the  body but this does appear to work with the react components. Only way I can get it to work is by adding the css class. Can we get it documented how we should be doing this correctly? TBH I couldn't even see it documented on how to apply the theme when using standard, I got it from the youtube video below

https://youtu.be/R-J_xsYGRKg

Attached is a gif which shows the body attribute not working:

Tags (1)
0 Kudos
5 Replies
BenElan
Esri Contributor

Hi @David_Wilton, You mentioned Calcite Web in the title, however that product is deprecated. The Calcite Design System is the newest iteration, which is the one discussed in the video you provided. The theme attribute was deprecated in version 1.0.0-beta.56, here is the changelog information:

https://github.com/Esri/calcite-components/blob/master/CHANGELOG.md#-breaking-changes-3

 

Using the class is the correct way to set the theme. Let me know if you have any additional questions!

Ben

David_Wilton
New Contributor II

Apologies, yes I mean calcite design system.

 

Would it be possible to get it added to the documentation? There is a section on themes which shows the differences, but no documentation yet on how to apply them.

https://developers.arcgis.com/calcite-design-system/foundations/colors/#themes

Thanks for the clarification

 

 

0 Kudos
BenElan
Esri Contributor

Yeah I'll add some documentation for this on the colors foundation page. It is described in the conventions readme but it is a bit hidden.

https://github.com/Esri/calcite-components/tree/master/conventions#light-themedark-theme

Thanks for the feedback.

0 Kudos
BenElan
Esri Contributor

I was able to add a few sections to the FAQ about some of the concepts used in Calcite Components. Here is the one on theming: 

https://developers.arcgis.com/calcite-design-system/faq/#how-do-i-change-themes

Is that what you were looking for?

David_Wilton
New Contributor II

Perfect many thanks for that Ben

0 Kudos