Buggy theme animation while switching tabs

[AbhayVAshokan]

Link: goodjob-demo.herokuapp.com/
Arc Browser: Version 1.25.1 (45028) Chromium Engine Version 120.0.6099.216
OS: macOS 14.2.1 (23C71) M1

[bensheldon]

Thanks for reporting! That looks bad. I can look into that unless you have a theory already.

[bensheldon]

hmmm, I'm having trouble reproducing this.

• Does that happen on any link navigation or just when using the tabbed navbar?
• Am I correct in assuming that your operating system is in Dark Mode, and you've set the Dashboard to light mode? (maybe that's related to the problem, though I think that shouldn't have a flash either)

[AbhayVAshokan]

1. It happens for every link navigation
2. Correct.

Every navigation reloads the entire website. It briefly defaults to theme="auto" before going to theme="light".

[bensheldon]

Note to self: maybe related twbs/bootstrap#39224

[carlosmintfan]

@bensheldon From a quick look, I think that isn't related because it only fixes an edge case for light OSes with "default" color mode. Anyway, make sure that the color-modes.js is included BEFORE the bootstrap CSS/JS (not only before the bootstrap js, but even before the bootstrap css) to make sure that color modes classes are applied to the page DOM before Bootstrap CSS styles it.

[carlosmintfan]

Note to self: maybe related twbs/bootstrap#39224

Ah, yeah, related if it defaults to auto...but anyway we have a fix now 😄