topic Re: Theming documentation (also when using react) - Calcite web in Calcite Design System Questions

Theming documentation (also when using react) - Calcite web

David_Wilton — Mon, 23 Aug 2021 01:19:30 GMT

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:

Re: Theming documentation (also when using react) - Calcite web

BenElan — Mon, 27 Sep 2021 19:41:16 GMT

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

Re: Theming documentation (also when using react) - Calcite web

David_Wilton — Mon, 27 Sep 2021 22:30:32 GMT

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

Re: Theming documentation (also when using react) - Calcite web

BenElan — Mon, 27 Sep 2021 22:43:47 GMT

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.

Re: Theming documentation (also when using react) - Calcite web

BenElan — Thu, 28 Oct 2021 17:04:16 GMT

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?

Re: Theming documentation (also when using react) - Calcite web

David_Wilton — Fri, 29 Oct 2021 04:47:26 GMT

Perfect many thanks for that Ben