outl1ne / nova-notes-field

This Laravel Nova package adds a notes field to Nova's arsenal of fields.
MIT License
51 stars 36 forks source link

Dark theme MutationObserver fails when system is set to dark mode #52

Closed rjksn closed 1 year ago

rjksn commented 2 years ago

Hello,

When using the notes field with Nova with the System (OSX) set to Dark mode. I do not get the proper background color class in the NotesField.

    'notes-field o1-bg-slate-100 dark:o1-bg-slate-800 o1-px-4 o1-pt-4 o1-pb-2 o1-rounded-b-lg o1-overflow-hidden o1-border-b o1-border-gray-200 dark:o1-border-gray-700';

I get the 01-bg-slate-100 style and not the dark:o1-bg-slate-800. However if I switch to dark mode through the drop down I do get the dark mode as .o1-dark .dark\:o1-bg-slate-800.

--

Issue Source:

https://github.com/outl1ne/nova-notes-field/blob/main/resources/js/entry.js#L6-L19

It looks like the issue is in this observer's initialization scripts, maybe that it runs too fast? After a refresh I am able to run document.documentElement.classList and I see dark however it does not have o1-dark.

Toggling the theme switcher fixes the issue even if you return to System theme, until you refresh.

Simply refreshing and executing: document.documentElement.classList.add('o1-dark') fixes the dark issue.

I feel the solution is to just use the default .dark class instead of .o1-dark but I must be missing something.

Tarpsvo commented 1 year ago

You're indeed correct. It's now fixed in version 3.0.2. Thanks for reporting this!