10up / gutenberg-best-practices

Welcome to the 10up Gutenberg Best Practices!
https://gutenberg.10up.com
94 stars 25 forks source link

Increase container max width. #140

Closed proxc closed 3 months ago

proxc commented 1 year ago

Is your enhancement related to a problem? Please describe.

On my 4k display almost all code examples have scrollbar and its kind of annoying to read, when there is plenty of room for this to be expanded out. Currently the max width is set to 80ch increasing the max-width to something like 1140 gives enough room and still maintains the readability.

https://github.com/10up/gutenberg-best-practices/blob/26db8d4556f03e32605c9cd5ef5ba62e4890f96e/src/css/variables.css#L23

image

Designs

increased to 1140px image

Describe alternatives you've considered

No response

Code of Conduct

xavortm commented 3 months ago

I was thinking the same many times (which is why I liked the original issue above). I added the width update but also some styles to the sidebar while at it. I know this merges two things into one, but I hope it's okay. If not, I can cleanup and split :)

I also find it easier to read when the content is wider.

Before:

image

After:

image