Add a custom selector for dark mode

[davidfischer]

• Adds a new attribute data-ea-dark-selector which when set will be monitored and toggle light/dark mode based on changes to it. This is for sites that use custom themes that don't use html.dark or similar patterns.
• Note that the adaptive-css class is NOT required if this custom attribute is set
• Add docs for the placement
• If the theme toggle attribute is not on body or html, then the ad will correctly load in dark/light mode based on the user's custom attribute/class but if the ad is rotated or the theme is custom toggled, then the watcher won't catch it because it's only watching for changes to html/body and only on attributes. It doesn't look at descendant nodes which should keep this from slowing anything down.

Testing

To test this out manually, you can do the following:

npm run dev

# Open the browser
open http://localhost:8080/

# Open the inspector, add an attribute `data-color-scheme='slate'` on the HTML element
# Observe that the "dark" class was added to the top ad placement
# Remove/change the `data-color-scheme` attribute and observe that the ad changes back to light mode

[ericholscher]

This seems like a good approach to make something a bit more generic, though I doubt many publishers will use it, but at least we have a solution.

[davidfischer]

This seems like a good approach to make something a bit more generic, though I doubt many publishers will use it, but at least we have a solution.

Ya, it would give us a solution for just about any theme.

[davidfischer]

I tested this out, added a few notes, and added testing instructions. I think this is close to merge-ready.

[ericholscher]

Looks great -- AI review only caught this one suggestion.

[ericholscher]

Definitely don't love the mixed quoting here, but unavoidable?

[davidfischer]

Ya, I don't think it's avoidable but should be rare.

[ericholscher]

Suggested change

	div.classList.remove("loaded");
	div.classList.remove("loaded", "dark");

Ai suggested:

applyDarkSelector() toggles the dark class on the placement wrapper itself, but unload_placements() only removes loaded and disconnects the observer. It doesn’t remove dark, so a placement that was previously dark can keep that class across unload/reload cycles and briefly or persistently render with stale theme state.

[davidfischer]

I don't think we want this suggestion. When the placement is explicitly set to dark mode (say, by the user explicitly) and then the ad is rotated for example, we want to keep it dark mode.