Node form layout looks squeezed

We stumbled on this problem when developing a premium plugin for CKEditor 5. The space is not wide enough to fit the editor with two side panels (e.g. comments and document outline). Adding screens for reference. It would be great if we could have the possibility to increase somehow the width.

Thanks for the screenshots, @witeksocha!

This is soft-blocking https://www.drupal.org/project/ckeditor5_premium_features → — they need this CSS work-around right now:

There are also few more reports on 📌 Node form layout looks awkward on wide screens since #3158854 Fixed about how this is causing issues with vertical tabs.

Claro sets a max width on the main column because there were many elements causing issues related legibility on the content edit form if it was rendered as full width. We tried to implement a solution that balances different needs but it certainly fails to take into account some of these special cases where CKEditor itself has multiple layouts, or the cases where vertical tabs are being used. In both of these cases the layout could be wider without suffering from these issues.

The current width was set based on 1366x768 screen size which at the time was one of the most popular screen size people used to browse web. This meant that developers would have to pay attention to this screen size when creating UI elements, because even if they were doing development with a larger screen, the width of the main container would appear as if you were on that resolution. We could increase the width of the main content area again but that would mean that we leave people using these screen sizes behind, because it seems that we would be doing it because we know that our UIs cannot accommodate these screen sizes.

The patch from #11 addresses #10 as long as you are using large enough screen, but also re-introduces the legibility issues with larger screens. This is probably still a step forward for the module because at least it makes these UIs usable for users who are using large enough screen. To also fix this for smaller screens, we would have to allow toggling the meta column.

We should take this into account in 📌 [META] Layout redesign Active but we could try to find a solution we could implement in the meanwhile.

Patch for Drupal 10.1.x

I personally find it too narrow as well. We wrap Claro in our own version to allow for minor CSS tweaks like this so it's not a huge deal for me to manually make the change there. We have some content types on out platform with paragraph fields which can get pretty complicated, so the extra width helps.

Thanks y'all for reporting.

I'm closing this issue as duplicate in favor of 🐛 Claro content editing area is too narrow Needs review as this uses an MR instead of patches and linking similar issues.

We are working towards solving this problem in a more holistic way on a design perspective in 📌 [META] Layout redesign Active

See also https://www.drupal.org/project/drupal/issues/3398277#comment-15361838 🐛 Claro content editing area is too narrow Needs review

Cross-posting of the latest movement on this topic here for those interested: https://www.drupal.org/project/drupal/issues/3398277#comment-15362136 🐛 Claro content editing area is too narrow Needs review

Patch for 10.2.x

Patch for 10.2.x