What is planned in the roadmap to handle responsive in Gutenberg ?

[webexpr-dhenriet]

Hello, First of all, I would like to thank you for all the things that have been put in place.

I use Gutenberg with a hybrid theme (theme.json) on all the WordPress sites we offer to our clients. But I must admit that it is becoming increasingly complicated to tell them that their layout is responsive because their fonts, margins, padding, and gaps are fluid, and that you have a "stacked on mobile" style for your columns.
It still seems minimalist to me, what can you say when someone tells you: "we can do it with Elementor, Divi": "we can do it with Elementor, Divi, ..."
You will understand that it is becoming complicated to explain to them that their back office is modern.
So yes, you might say that we can create styles for columns, for example, or make variations, but the customer can't do it himself. In the end, without having better control over responsive, Gutenberg's perceived image with our customers is very poor.

About styles, I don't understand why styles work like radio buttons and why we can't select multiple styles like checkboxes and thus be able to combine them?

For example :
I want the columns to take 100% width starting from the tablet and I also want to be able to reverse the image and text on the tablet (left/right, right/left on desktop). I can't ... Because I can only apply one style, I have to create styles that group styles together, just because I can only select one style...
Or I have to create my own block variations, in short, all of this is very complex for not much, I mean a person who doesn't develop (a client) is not capable of doing this and it's tiring to have to invent styles for each new site or to have to set them up, explain them because it's not native.

The result of adding a style is the addition of a CSS class in a text input, so technically when I add a style I retrieve those already added in the input and merge them all with the new ones separated by spaces ? Why is implementing this logic a problem ?

Following the latest versions a bit, I constantly see new features, but I don't see many bugs being fixed, improvements on blocks, or existing issues being addressed. There are more than 6000 open issues, undoubtedly some are no longer relevant, but in any case, I don't see any progress on responsive. Fluid fonts, margin helpers, it's good but it's not enough.
I have the impression that most of the issues concerning responsive are closed, as if it were a bother, or we are told that we are waiting for the latest CSS evolution because it will become the new way of doing things. I don't understand the problem, a page has a container, how long does it take to grasp the flex/grid logic and Bootstrap's SCSS to manage columns ? Certainly, mapping all of this into React will take more time, but why refuse a system that many are asking for and that has been working for years ?

To go a bit further than responsive, I now have the impression that the development of Gutenberg is designed by developers for developers and that FSE is the priority. I'm not against FSE, but for sites with around ten pages that would be quite simple, because do you think people who don't have an advanced knowledge of HTML/CSS/JS are really capable of using Gutenberg easily, and especially of creating advanced layouts easily? I think not, unless you install block plugins, or builders like Elementor, Divi, or others...
I think that before being able to manage everything from the back office in FSE, it would be more important to stabilize/improve the existing blocks, finally have custom fields like ACF (I know it's in progress), and have much more control over the responsive.
Today, without ACF custom fields, ACF blocks, and shortcodes, it's too complicated, even impossible, to create a site (more complex than simple pages). Creating a site is good, but then you have to maintain it (especially since each new version can also bring bugs via theme.json).
It is simpler to modify the HTML of an ACF block included in 50 pages from the theme once than to go and modify the HTML of a pattern in each of the 50 pages 50 times...

I am not here to criticize, and I know that WordPress 6.7 is coming with new features, and thanks to everyone for that, but please finally give us the ability to properly manage at least the responsive design of the columns, if not more, and in a simple way.
Because it is becoming really complicated to defend Gutenberg when there are other solutions, builders, CMS, Webflow, or others.

So, back to my initial question since we are at the end of 2024, what is planned in the roadmap to manage responsive in Gutenberg (or in the back office editor) ?

[carolinan]

Hi

Please use the Discussions area in the repository for discussions.

For feature requests to be actionable, they need to be limited in scope. It becomes very difficult for contributors to narrow down and work towards solving the problems when the requests are bundled together like in this issue.
The more specific the issue is, the easier it is to reply to and address. For example, if you write "I don't understand why styles work like radio buttons", then it helps greatly to clarify which styles, since this concept exists in several places in the editors. Including detailed descriptions and screenshots help.
Once that is clarified, someone can usually point you to an open GItHub issue where that is already being discussed.

[annezazu]

Hey there! Thanks for asking these questions and wanting to know more about this important area of work. I've heard for years now how much of a blocker not having more responsive options and controls in Core has been. Various efforts have begun to help like fluid typography (with options to control those settings directly), grid layout with responsive controls, built-in navigation block options, etc.

To go a bit further than responsive, I now have the impression that the development of Gutenberg is designed by developers for developers and that FSE is the priority.

This isn't the case. Gutenberg has a whole team of designers who help contribute! You can see their priorities here . In terms of what's next for responsive options, I'd recommend checking out the following:

• Grid Layout Improvements
• Responsive previewing and device-specific editing
• Responsive blocks & intrinsic web design
• Block-specific responsive controls

I'm going to close this out as a result to focus discussion on what's in progress and what's being done.