[Resolved] Disable Editor color override

[Martin]

Hi, I saw that it would be possible in GP 2.3 to disable the theme from picking up the front end colors in the editor. I’m using a dark background which is pretty buggy in the editor. Is there any interim thing one can do to disable the color changes?

GeneratePress 2.2.2

GP Premium 1.7.7

[David]

Hi there,

not currently as Tom mentions here:

https://generatepress.com/forums/topic/gutenburg-editor-style/#post-814074

Can you share a screen shot of the issue? We added a color detector script to switch the editor UI to dark mode if the text is lighter then the background, we may need to finetune so any feedback would be helpful.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Martin]

There’s no issues with Generatepress itself and dark mode is activated as it should be. The issues lies with dark mode itself which I feel needs more work from the Gutenberg team. It’s also other issues, mostly related to ACF that becomes way more apparent when you have a dark background.

Anyhow, I saw this in the other thread which I can use as a temp solution:

Try this:
“add_action( ‘enqueue_block_editor_assets’, function() {
$css = ‘.editor-post-title__block .editor-post-title__input {text-transform: none;}’;
$css .= ‘.editor-block-list__block a, .editor-block-list__block a:visited {color: #000000;}’;

wp_add_inline_style( ‘generate-block-editor-styles’, $css );
}, 100 );”

Thanks!

[David]

Ah ok – thanks for explaining. Yes the Dark UI does need a lot of love. Glad you found a solution.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Martin]

Hmm, one more quick followup, realised that I still need to disable dark mode, is that possible? I’m willing to change stuff in the parent theme if necessary.

[Tom]

We initiate dark mode using javascript if we detect that your text color is light.

You can try disabling it like this:

add_action( 'enqueue_block_editor_assets', function() {
    wp_add_inline_script( 'generate-block-editor-scripts', 
        "jQuery( window ).on( 'load', function() {
            jQuery( 'body' ).removeClass( 'is-dark-theme' );
        } );"
    );
}, 100 );

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts