[Bug] Light mode does not persist on title page after refresh

[travisk-codes]

Description:
When light mode is enabled, refreshing the title page will revert it back to dark mode.

To Reproduce:

1. Enable light mode
2. Navigate back to the title page
3. Refresh the page

Expected Behavior:
Light mode to persist after refresh

Environment:

• OS: 5.8.6-arch1-1
• Browser: Firefox 80.0.1 (64-bit)
• Browser: Chromium 85.0.4183.83 (64-bit)

[veksen]

The issue seems to happen on every layout, part of the layout doesn't take account the localStorage value:

https://theprogrammershangout.com/resources/javascript/

[travisk-codes]

I am able to reproduce on prod, but not on develop master. Are you?

prod steps: light mode -> refresh -> switches to dark mode with black text
dev steps: light mode -> refresh -> stays in light mode

[veksen]

I'm feeling like it's related to statically generated generated Gatsby assets

[veksen]

yes 100%: https://joshwcomeau.com/gatsby/dark-mode/ improved solution from what we have

[travisk-codes]

I'll look into it--does it look like a major overhaul?

[veksen]

No we have the majority of the groundwork already for it, it's mainly injecting some JS at runtime before Gatsby runs which is covered by the article.