Apply dark theme dynamically on toggle button

Question

Hi,I am trying to implement dark theme for my components dynamically. I tried to follow the link below but unfortunately I didn't succeed:https://www.syncfusion.com/forums/155599/how-to-dynamic-toggle-the-dark-model-themeWhen I debug I get the following lines loaded into my template which is the content of the material-dark.css ( which work fine when I import it in a static way in  my global style.css)However I still can't understand why the same file can't be applied to my app.Regards

Jesus Arockia Sankaran S · Accepted Answer

Hi AYMEN, 

Sorry for the inconvenience. 

We have checked this but we are not able to reproduce the reported issue and we request you to check the following sample application for more detailed reference.  

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ej2-sample-1115381197 

Please get back to us if you have any queries. 

Regards, 
Jesus Arockia Sankaran S

Jesus Arockia Sankaran S · Answer

Hi AYMEN, 

Thank you for contacting Syncfusion support and sorry for the inconvenience. 

We hope that you have referred and followed the below KB (Knowledge Base) article for your sample and we are not having any issues as you mentioned. We have created a new sample for your reference that you can download form the following link. 

KB Link: https://www.syncfusion.com/kb/10868/how-to-load-themes-dynamically-in-syncfusion-components 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ej2-sample1122438489 

Please get back to us if you have any queries. 

Regards, 
Jesus Arockia Sankaran S

AYMEN Matador · Answer

Greetings,I finally succeeded to load the dark theme thanks to your response. However, I noticed that the theme didn't get applied to all the components ( as shown in the figure below). Is there other steps to follow to get the dark theme on all my components ?Regards.

AYMEN Matador · Answer

Hi,I am very grateful to your support Sir. Indeed, I get finally to load the dark theme and to apply it to all components. But, I noticed that the loading is  taking too much time to change the theme (around 5 seconds), and this behavior includes also the sample provided in the previous response.Please let me now if there is a fix to this inconvenient.Regards

Jesus Arockia Sankaran S · Answer

Hi AYMEN, 

Thank you for the details. 

We recommend you to generate the Theme files using Theme Studio online utility for required component instead loading CSS of all components.  

Theme Studio: https://ej2.syncfusion.com/themestudio/?theme=material 

Documentation: https://ej2.syncfusion.com/angular/documentation/appearance/theme-studio/ 

Please get back to us if you have any queries. 

Regards, 
Jesus Arockia Sankaran S