I'm sure you know this already, but turning on dark-mode effectively puts an overlay above the rest of the page's interactive components (such as the next episode). This means you have to turn off dark mode to go to the next episode or a different series.
Have you thought about other ways to do this, i.e., changing CSS colors instead of just drawing an overlay? In other words, add a class to the root element and all elements below it with background colors or font colors will have a separate color defined for when they're below an element with the .dark-mode class. (Basically, see this pen https://codepen.io/HarlemSquirrel/pen/NdMebZ)
I'm sure you know this already, but turning on dark-mode effectively puts an overlay above the rest of the page's interactive components (such as the next episode). This means you have to turn off dark mode to go to the next episode or a different series.
Have you thought about other ways to do this, i.e., changing CSS colors instead of just drawing an overlay? In other words, add a class to the root element and all elements below it with background colors or font colors will have a separate color defined for when they're below an element with the
.dark-mode
class. (Basically, see this pen https://codepen.io/HarlemSquirrel/pen/NdMebZ)