adding darkMode : class is breaking UI on mobile.

[MohammadHarisZia]

Summary:

I refactored mmkv and softtouchinput to use expo go app but when I use the latest fix darkmode on web commit it breaks styles on mobile. Specifically Text , settings menu and modal options, I am using the setup from 5.2.0 release and seems like dark: style are applied on mobile despite it being light mode on mobile

Light Theme:

Dark Theme:

Steps to reproduce:

From changelog 5.2.0 I used your dark mode support commit to change tailwind config and root layout

Expected behavior:

Additional notes:

Tasks

• [ ] Task 1
• [ ] Task 2
• [ ] Task 3

[Hessuew]

I think I'm on the latest version and noticed the same. I just added the theme button from the settings screen to test it in my new home screen and find out every text and button remained white while the background turned white.

Btw thank you for the super great starter/template. I have tested some and I think this is the best. Specifically the workflow + husky section is super nice. Keep up the good work 😄👍💯🥇

[tlebeitsuk]

Same here.

[ElenaBitire]

What tailwindcss version do you have? In case you have a different version than 3.3.2 (the one we have on the template), then changing the darkMode: 'class' to darkMode: 'media' in the tailwind.config.js file should solve this issue on mobile, while on web isn't going to work as expected.

[MohammadHarisZia]

Hey @ElenaBitire thank you so much for bringing this up! It was the tailwind version issue. For everyone else getting this issue kindly downgrade your tailwind CSS to 3.3.2 from whatever version you are using and you will be good to go using the darkMode: class in tailwind config.

[minhdangoz]

What tailwindcss version do you have? In case you have a different version than 3.3.2 (the one we have on the template), then changing the darkMode: 'class' to darkMode: 'media' in the tailwind.config.js file should solve this issue on mobile, while on web isn't going to work as expected.

Thanks, it solved my problem

[Hessuew]

Yes, ensuring that the version is 3.3.2, not any above, solved the problem for me also.

Thank you very much.