Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merge Proposal: Dark Mode #98

Closed
danieltj27 opened this issue May 21, 2018 · 10 comments
Closed

Merge Proposal: Dark Mode #98

danieltj27 opened this issue May 21, 2018 · 10 comments
Milestone

Comments

@danieltj27
Copy link
Contributor

@danieltj27 danieltj27 commented May 21, 2018

Merge Proposal: Dark Mode

dark-mode-dashboard

Dark Mode has become a rapidly popular feature to many online tools and services in recent years and it's about time WordPress joins in on this trend as well. Many websites such as Twitter, YouTube, Reddit and even macOS Mojave, Apple's newest operating system have adopted this feature as one to help user's who are looking at screens for long periods of time. Traditionally we're use to seeing light backgrounds and dark text in a high contrast environment which can be damaging for the eyes.

If you have ever found yourself working on something late at night and having to make adjustments so the bright light doesn't hurt your eyes so much, you're in for a treat!

Say good evening to... Dark Mode

Dark Mode transforms the colours of the WordPress dashboard from bright white and grey colours to dark grey and black instead. This means you no longer need to squint or turn down your brightness setting trying to avoid things like headaches and eyestrain.

Whilst Dark Mode is a great way to personalise your setup, there's a few things that it's not. These include but is not limited to:

  • It is not a high contrast mode for accessibility needs
  • It is not a new admin colour scheme for WordPress
  • It is not a tool to aid in any health issues you may have (poor vision etc)

Your Questions Answered

1. What is Dark Mode?
Dark Mode is a new option available for each individual user of your WordPress website to change the dashboard style to a darker design, steering away from the classic white and grey design we're all use to.

2. Why should this be in Core?
WordPress has always made use of lighter colours within the dashboard. Whilst this may be fine for many, some users may find it harder to read text on the page and it gives people the opportunity to experience their settings in a much nicer, and more comfortable design.

3. How would this be maintained in Core?
As this effects the entire WordPress experience in the dashboard, it would require at least a small group of people to actively maintain it as a component and would need continuous input between developers and designers when new features are rolled out.

4. Will this support Gutenberg?
No, Dark Mode supports TinyMCE (not the theme editable areas) but will not support Gutenberg right now. This is something that should be worked on in tandem with the Gutenberg core team. It's been decided that a merge proposal with Gutenberg support is the most beneficial way forward at the moment. This is partly due to the nature of rapid weekly updates and changes that Gutenberg is facing which would make it difficult to properly maintain at the moment.

5. Which plugins will be supported? / How can plugins support Dark Mode?
Please refer to the plugin compatibility guide on the GitHub repository for more information on this. For most plugins, this will be a case of using an action hook to include the third party plugin's Dark Mode stylesheet which is triggered when the current user has confirmed they'd like to use Dark Mode.

Currently, the only plugin which is natively supported by the Dark Mode plugin is Gutenberg. This is because Gutenberg is a feature plugin which will become part of the WordPress core and must be supported by default. No other plugins are to be supported at this time. Plugin developers wishing to save themselves time should try to use the default WordPress UI elements as much as possible.

And for the most important and most asked question of all...

6. Why isn't this a colour scheme?
Admin Colour Schemes, since being added in WordPress 3.x change the colour of the admin toolbar and the side menu within the dashboard. Colour schemes, generally (and should only) change these two elements and nothing else. Dark Mode doesn't effect either of these two elements. In fact, the sole purpose of Dark Mode is to change the style of the main content area in the dashboard. This means you can have a custom admin colour scheme enabled along side Dark Mode if you really wanted to.

Testing & Merging

Dark Mode has already been thoroughly tested but should have further testing before merging to ensure that every element is styled just right. As it currently stands, Dark Mode has been designed in a class model which enables it to be placed within core very easily with the use of hooks.

Whilst there may be some changes required to port it over into the core stack, the current files required for it to actually work are only 2. The PHP code to check the user preference and the CSS file containing the styles meaning the task of actually merging could be relatively quick.

If you do find any issues, please report them by opening a new issue on GitHub.

Thanks

I would like to give a big thank you to everyone who has helped get Dark Mode to where it is today. The development of the the plugin started on the 3rd October 2017. Since then, the plugin has seen contributors of various levels assist in testing, coding and designing the product we have now. Yay for open source communities!

@danieltj27 danieltj27 added the META label May 21, 2018
@danieltj27 danieltj27 added this to the Core Release milestone May 21, 2018
@danieltj27

This comment was marked as outdated.

Copy link
Contributor Author

@danieltj27 danieltj27 commented May 21, 2018

Use this issue as the basis for the WordPress Core Merge Proposal. Please reply below with any feedback/changes you might have and I'll edit them into the first post in this issue. Here are some of the things that need to be mentioned:

  • What is Dark Mode?
  • Why can't/isn't this a colour scheme? (this gets asked a lot).
  • What's it's purpose/use cases?
  • Examples of other dark modes (Twitter, Reddit or YouTube)
  • Coding Standards & Security
  • The future updates in Core
  • Thanks to contributors

This list will probably change going forward. It's also worth looking at other merge proposals that have been submitted to Make/Core as well. I'll list some quickly below.

That's just a few of the latest ones so far. Hopefully this is the next one!

@danieltj27

This comment was marked as resolved.

Copy link
Contributor Author

@danieltj27 danieltj27 commented May 22, 2018

Note to self and contributors:

The codebase is now in a feature freeze state. No new features are being added and only bugs will be addressed. Please do not request new features until further notice. Thanks!

We're one step closer to getting the merge proposal sorted (just need to write it now).

@danieltj27

This comment was marked as outdated.

Copy link
Contributor Author

@danieltj27 danieltj27 commented Jun 22, 2018

Released commit c03247f as version 3.0 which is the RC for merging.

@danieltj27

This comment was marked as resolved.

Copy link
Contributor Author

@danieltj27 danieltj27 commented Jul 2, 2018

I've updated the proposal and am happy that's it's pretty much there now. There's only two things that need doing though as I needed to sort of write this with the future in mind.

  • Gutenberg needs to be supported, TinyMCE already is though. link
  • The plugin compatibility guide needs to be written.

I think that's about it.

@danieltj27

This comment was marked as resolved.

Copy link
Contributor Author

@danieltj27 danieltj27 commented Jul 2, 2018

Plugin compatibility guide is here: https://github.com/danieltj27/Dark-Mode/wiki/Help:-Plugin-Compatibility-Guide


Edit

The plugin guide has been finished. The only thing left is Gutenberg support.

@iLenTheme

This comment was marked as resolved.

Copy link

@iLenTheme iLenTheme commented Aug 21, 2018

Hi, I already install the plugin but I can not make it work, how does it work?

@danieltj27

This comment was marked as resolved.

Copy link
Contributor Author

@danieltj27 danieltj27 commented Aug 21, 2018

Hi, please take a look at the installation instructions: https://wordpress.org/plugins/dark-mode/#installation.

@iLenTheme

This comment was marked as resolved.

Copy link

@iLenTheme iLenTheme commented Aug 21, 2018

@danieltj27 thank you! 😄

@danieltj27

This comment was marked as resolved.

Copy link
Contributor Author

@danieltj27 danieltj27 commented Aug 22, 2018

Updated proposal to include bit about Gutenberg.

Refer to issue #108 and #119 for more info.

@danieltj27

This comment has been minimized.

Copy link
Contributor Author

@danieltj27 danieltj27 commented Aug 30, 2018

The merge proposal is now scheduled to go live very soon!

Link: https://make.wordpress.org/core/?p=34501

Woo 😄

@danieltj27 danieltj27 closed this Aug 30, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
2 participants
You can’t perform that action at this time.