remix-run / remix-website

354 stars 81 forks source link

Dark mode via system preferences is not persistent across navigations #128

Closed brookslybrand closed 12 months ago

brookslybrand commented 1 year ago

As you can see, dark mode via system preferences does not persist well

https://github.com/remix-run/remix-website/assets/12396812/2c26782d-7ca8-45ad-b72e-c303e7cec27c

I believe it's due to this script, which can get unsynchronized on navigation changes.

kiliman commented 1 year ago

You should probably consider using the client-hints feature in Epic Stack.

https://github.com/epicweb-dev/epic-stack/blob/main/docs/client-hints.md

brookslybrand commented 1 year ago

You should probably consider using the client-hints feature in Epic Stack.

https://github.com/epicweb-dev/epic-stack/blob/main/docs/client-hints.md

Thanks @kiliman, I don't believe that's the issue. We already have a cookie setup to track the the users preference, defaulting to system. So I don't believe this is actually the problem. Briefly poking around this morning the loader seemed to always give the correct value, what I think is happening is that the script that's setting the "dark" class is getting stale.

I'm not totally sure why it was setup the way it was, so I'm hoping to simplify it and get rid of the bug.

rptrainor commented 1 year ago

Hello! I'm new here, but excited to contribute to Remix! I just assigned this one to myself. I'm going to take a look at the bug this week.

brookslybrand commented 1 year ago

Hello! I'm new here, but excited to contribute to Remix! I just assigned this one to myself. I'm going to take a look at the bug this week.

Thanks @rptrainor! Appreciate you reaching out to help :)