We use TinyMCE as in-place editors to let user live edit contents. However, when using a dark background with light text, TinyMCE uses this text colour instead of using black.
(Note: please ignore the theme colours, this is only for demo purposes.)
How can the font styles menu use black font colour instead of the one defined in the content?
>Solution :
Take a look at the preview_styles configuration option for TinyMCE:
https://www.tiny.cloud/docs/tinymce/6/user-formatting-options/#preview_styles
You can stop any/all types of previews with
preview_styles: false
…or you can control what parts of it to preview with a string such as:
preview_styles: 'font-size font-weight'
The default for this value in TinyMCE 6 is:
font-family font-size font-weight font-style text-decoration text-transform color background-color border border-radius outline text-shadow
so you can use any subset of those values if you opt to pass a string.