Add handling of white-space css property

[GilCatt]

Just like "underline" is handled. Required non-wrapping pairs or sets of words are as common as "underline", if not more, in terms of frequency and usefulness.

[phpbits]

Thanks a lot for the suggestion @GilCatt. Would you mind explaining it more? I can't seem to understand the feature you are requesting. Thanks again!

[GilCatt]

Ok :) I realize my explanation was a bit short. Thanks for asking.

Let's take the underline feature as an example.

Using your plugin, all you need to do is to select the text to be underlined, choose underline in the contextual menu, and voilà, done ! Inline css is added - "text-decoration:underline;"

The same would be great for the white-space css property - adding "white-space:nowrap" as inline css. This property and this attribute allow for a specific group of words not to break at the end of a line. (If they do wrap, it is together).

A typical use case : numbers and currency symbols in a price list.

Typographic rules differ from country to country, in some languages there is a required white space between the currency symbol and the number.

In a price list, that pair is typically at the end of the line. Depending on the screen resolution, especially on mobile phones, that pair will sometimes break.

example :

Instead of one line as intended Pizza with pepperoni, mushrooms and cheese : 10 €

The end result might be on two lines Pizza with pepperoni, mushrooms and cheese : 10 €

It looks ugly. To prevent this nasty side effect, you have to add "white-space:nowrap" inline style to all pairs of price+symbol, editing the html. Incredibly time consuming. Even more with Gutenberg, where html is broken down at block level.

You might thing it is quite specific, but the need of non breakable white space is key in typography. You do have some tools which parse the text and add the proper white space rules (or any other typographic rules), but it is heavy, not flexible, and ressources hungry.

More generally it would be great to be able to add any specific text-related css property as inline css with your great little plugin. Being able to save your own preferred properties.
Yes I understand it is already customizable, adding some code to your plugin. And I understand it would be far more complex to allow for such customization from the front end.

In any case I do hope to see a plugin dedicated to typography for Gutenberg blocks one day. Yours is the best exemple of what it could be.