Dark / Light Mode Automatic Toggle Switch / jsdmat

Dark / Light Mode Automatic Toggle Switch / jsdmat 0.4.0

No permission to download

hstammlerj

Active member
hstammlerj submitted a new resource:

Dark / Light Mode Automatic Toggle Switch / jsdmat - Automatically switches unlimited light & dark styles by JS utilizing browser's prefers-color-scheme.

About jsdmat​

This modification enables a XenForo installation to automatically toggle light and dark styles based on the user browser's UI setting "prefers-color-scheme".
Adding this CSS media feature directly to XenForo CSS definitions is hardly possible for the current architecture. Switching between light and dark UI without major modifications is easier done by switching between...

Read more about this resource...
 

e-Dewan

Member
That's awesome,

I've tested it and works perfectly, one thing which I wish is to let user to switch and keep on in another style (if I am on dark mode and I switch Xenforo style manually to light style then I refresh page it will switch again to dark style).

Regards,
 

hstammlerj

Active member
one thing which I wish is to let user to switch and keep on in another style (if I am on dark mode and I switch Xenforo style manually to light style then I refresh page it will switch again to dark style).
Yes, this is a bit complicated because the current jsdmat script yet isn't able to detect manual style chooser actions. Since the chooser overlay is added dynamically via AJAX call it wasn't that easy in the first attempt to build an additional listener to catch this click action. That click information is necessary because without it the jsdmat script cannot distinguish between a manual ("clicked") style change by the user and a style change pushed via XF due to global acting user settings (e.g. the user changed style at a second device some minutes ago).

Please stay tuned: the upcoming update will be able to handle manual actions much better and hopefully will make the need of separate "non-listed" child styles for "no-toggle-please" users obsolete. :)
 

hstammlerj

Active member
hstammlerj updated Dark / Light Mode Automatic Toggle Switch / jsdmat with a new update entry:

Feature update

  • Added capability to react and incorporate user-driven style changes including lock and release scenarios.
  • Added call method to accept user-driven toggle requests ("light to dark" and vice versa).
  • Rebuilt mandatory template modification sheet (PAGE_CONTAINER) to comply to new jsdmat object structure.
  • Added recommended template modification sheet (style_chooser) to be able to capture user-driven style changes.
  • Added optional public navigation entry example to offer a...

Read the rest of this update entry...
 
Top