Preformatted block

[hypest]

Support the Gutenberg "Preformatted" block.

[SergioEstevao]

@iamthomasbishop what font do you want to use for preformatted blocks/html?

Normally we use a monospace font, and in iOS the one available is Courier

@hypest is this font available on Android too?

[iamthomasbishop]

@SergioEstevao What are we using on Aztec/HTML mode? We can use the same font we're using there for consistency. Another option (which I think is available, per this list) could be Menlo.

[iamthomasbishop]

It's hard to tell what the default is on Android, so that could change my answer above 😄 I think Droid Sans Mono was the default at some point but not sure if that's still the case. Roboto Mono is also nice.

[SergioEstevao]

@iamthomasbishop we were using Courier in Aztec, but Menlo looks so much better that I'm going to change in both. What size do you think we should use?

Do you mind to post here a little mockup? and also tell me what colour you want to use for the background of the Pre block.

[iamthomasbishop]

we were using Courier in Aztec, but Menlo looks so much better that I'm going to change in both.

👍 Awesome.

As I understand it, pre should use the same font styling as code block, minus syntax highlighting and additional block settings (code language, show line numbers, etc). So let's match the code block styling that we documented here: #368

Our font-size can match what I mentioned in the issue mentioned above, 14px. If that's a bit too small, we can bump up to our base paragraph sizing of 16px.