eZ Platform Discussions

Implementing a dark mode?


#1

Hey guys,

I was wondering if anyone had already thought about implementing a dark mode for admin ui ?
I made a basic stylesheet but was wondering if this was already something inteded for 2.x or 3.x ?

Based on https://ezsystems.github.io/ui-guidelines/ and https://doc.ezplatform.com/en/latest/guidelines/Introduction/ i didn’t found a any hint that tell it can’t be added (knowing that it could be disable to preserve accessibility) but what about current dev in eZ or in the community ?

Thank you in advance for your thoughts and/or advice :slight_smile:

Regards,


#2

Hi @alexandre.andrieux!

I don’t find this feature listed on productboard but we already discussed this topic internally and we never prioritized this feature.
Here is the idea: we would like to have this feature connected to the user preferences. So every user of the platform would be able to define the theme he/she wants to have for the admin interface.
If you want to contribute we can definitely help you (design, wireframes, code review). Please keep in mind that this contribution will be on eZ Platform 3.x not on 2.5.

In the meantime, if you want to include your CSS in the admin interface of 2.5, you can definitely take advantage of webpack encore: https://doc.ezplatform.com/en/latest/guide/bundles/#importing-assets-from-a-bundle.


#3

Hello,

Thank you for the feedback!

I made a rough PoC to test my thoughts and currently have :

  • AdminUI “customize” tab containing form with “dark mode” boolean (saved in a basic Sf entity)
  • On “Save” action,
    • 1st attempt: twig {% if ... %} will load/remove custom basic style tag in my @ezdesign/layout.html.twig override (src/appbundle/resources/views/themes/admin/layout.html.twig)
    • 2nd attempt: apply custom class on body and then load dedicated stylesheet (added to ezplatform-admin-ui-layout-css through eZConfigManager.add({...}) )

I intend to use webpack for a possible release and making it a feature by user would definitely be great!
I am also trying to think to make it as light as possible (replace entity to browser cookie/session/cache for example)

I would really appreciate to get some help on that in any case ! And if you would find it good enough to get it for 3.x that would be awesome :smiley:

Thanks again!


#4

Hi @alexandre.andrieux!

This is great. If you need help from us, feel free to ping me.

Thanks.