search

ksucpea / bettercanvas

Dark mode, better todo list, GPA calculator, and more for Canvas
MIT License
86 stars 23 forks source link

Add class to body when dark mode is enabled #60

Closed HexaCubist closed 3 months ago

HexaCubist commented 4 months ago

This will help plugins and other canvas extensions support Better Canvas when their changes break support for the default dark mode settings.

ksucpea commented 3 months ago

Sounds good! Thanks

ksucpea commented 3 months ago

Hey, so I just realized that I'm getting an error thats saying the document.body is null so it can't add the class to the body. I'm not sure if this is happening for you, but I think this is happening because the dark mode is being toggled before the body even loads, so it doesn't actually exist yet. I added a class to the style element named "bettercanvas-darkmode-enabled" so you could check if dark mode is enabled by using querySelector and determining if it's null. Does that work?

HexaCubist commented 3 months ago

Good catch! I've just pushed an update to the patch PR (https://github.com/HexaCubist/bettercanvas/tree/patch-1), which will fix that case with a very quick check to see if the page is loaded. If it isn't it binds a listener to the page to run when things are set up.

This will work better as it means that CSS-only themes can just wrap BetterCanvas-specific tweaks in a body.bettercanvas--darkmode--enabled and not have to interface with any javascript queries. It will also handle the situation where the user toggles dark mode on/off without reloading the page.

This second change seems to work when I tested the extension locally, but happy to adjust if it's still not working on your end.