[ISSUE] Why when I group two elements in a group, bubble create the new group with fixed width and convert the child elementes to fixed width too?
I tested a bit with the new engine. I guess that if you start from scratch and you have the hang of it, it will be working perfectly. But I am experiencing som major problems. If I change a complicated page to the new engine, I only see dimensions of the main containers. All other elements have no dimensions anymore, they only have minimum dimensions. So basically if I don’t have an exact copy of the page next to it on my screen I have no idea how pixel perfect the original page was.
Is this really the way? Forget about pixel perfect positions and dimensions? I can live with that but it means I have to spend days again to go through all my pages. Or am I missing something and elements do still show original dimensions?
Another feature what seems to be missing is to copy and paste the formatting. That would save tons of time. I thought it’s the copy style function but that doesn’t do anything with the formatting.
2 Likes
Freehand drag-n-drop Legacy responsive is good for no-coders to start - its better to keep it that way. Legacy also encourages freehand designing, so bubble should also consider moving in that direction, instead of boxing out all the ideas in rows and columns.
Row/Column boxed New responsive is good for coders and is good for sure.
I could switch to new responsive (with the help of old dusty calculator) being a no-coder since i started on Legacy responsive,
There needs to be some better placement in Appearance/Layout/conditions
it sorts of stop the flow of hand, I hope bubble team will eventually improve on it.
I have figured out why there is whitespace under my page… my Group Focus items that are attached to my navigation header are appearing down there. If I open each menu, the groups go back up where they are meant to be and the space disappears. I’m not sure if this is the same issue others are reporting with Group Focus items.
I had been hoping for this for a few years. Now that its here I am glad I copied my site before trying it. I’m sorry but its not doing it for me. Trying to recover my design from the copied site is proving very hard. The fundamental problems are:
- CSS containers are visual elements to help you position things but Bubble groups are data elements. When you start using bubble groups like CSS containers your access to the parents data type gets messy. WE NEED A NEW CLASS OF PURELY VISUAL ORGANISING WITH NO DATA CLASS BUT INVISIBLE CONTAINERS. Data goups or other elements would fit inside the containers.
- In CSS it’s easy to see in the code whether you have a row broken into columns or a column broken into rows. THE NEW PURELY VISUAL CONTAINERS NEED TO BE CLEARLY ROWS OR COLUMNS AND THEY NEED TO BE STACKABLE/ NESTABLE.
- In CSS you can layer things by setting the z-value. Here’s its very hard to visually determine what is bound to what and what layer its on.
I am afraid Bubble is running the risk of creating a no-code environment even more complex, arcane and difficult to use than a coding environment.
Another bug regarding the new responsive engine. I have now spend roughly 50+ hours converting all my pages to the new engine. So, I do have a bit of expierience now.
Bug with Repeating Groups:
When you uncheck “set fix number of rows” it seems the RG is turned into an infinite repeating group. Even though, e.g. I have a filter (on the search) which limits the number of entries to lets say 5 it shows 100s of entries in the editor. Now that would not be a problem if, for whatever reason, the editor would not immediately become extremely slow (i.e. delay of 3-4 seconds after one click)
Connected to that: Why can’t we (like with the old engine) define the number of rows and STILL enable vertical scrolling? With the new one, that option becomes only visible after unchecking the above mentioned setting. This cannot be intended? What if I want to have a RG with 5 rows (100s entries) which is scrollable? Yes, I could play around with the height but I much more prefer the legacy solution.
P.S. Also, let me say that just converting legacy pages to the new engine is crap. Even with simple pages. After converting you get an extremely “messy” page with 100s of “Rows” and the editor becomes super slow. I have now manually created a new, blank page or reusable element for each legacy element. Then I copy the old element to the new engine. Still a hell lot of work. But better than the bubble solution.
Another note: Never has the editor (even with “vanilla” new responsive engine pages) been SO slow.
To end on a positive note: The new engine gives so much more flexibility and power. Much easier to build beautiful pages IMHO.
4 Likes
This is great feedback, thank you.
1 Like
Definitely here you on the difficulty of adding new elements to a page that is already “full”. We will be working on some UX improvements to make that process easier.
Min height defines the shortest height this element is allowed to get. For example, if you have a group with no content inside, but a min height of 100px, the group will render at 100px. If content is added that needs more space, the group will grow accordingly, within the bounds of its parent container and any max height settings. Max height defines how tall an element is allowed to get. If left blank, it will grow as tall as its parent container will allow it to grow.
Regarding your question on group scrollbars with overflowing content - not yet, though it is definitely a reasonable feature request!
Do you mind sharing more details or a repro case on the “Group B is not an option issue”?
1 Like
I can’t give you an estimate on timing unfortunately, but I can tell you that we do intend to support all layout controls in conditionals. This can quickly become cumbersome when designing, however, so the real win would be fully supporting breakpoints. At each breakpoint, you set your layout settings in the PE and smaller screen-sizes will inherit those settings unless otherwise specified. This scope of work is currently being defined 
.
8 Likes
We do show the current screen size in the responsive tab in the left toolbar right underneath the elements tree.
3 Likes
Question about this - if we have an updated page and use a reusable element (pop up) that isn’t updated is that an issue?
I have a test page that is the updated engine and it has a reusable element on page that is a pop up, when live and the pop up is pulled up, no content is shown - but when I use the reusable element on a legacy responsive designed page it shows data.
1 Like
I’m running into the same issue here. I agree that adding an Edit or Select option to the menu would be really helpful.
I did mention it in my original post that I was getting it the moment I group two elements. And that error won’t go away until I ungroup them. Even if I click on the error in the error box, it doesn’t show any measures to be taken etc.
More than this I am not sure what exactly is causing it. Don’t know if it comes on grouping certain types of elements etc. I can share my editor if required.
I had given a screenshot. That may probably help coders as they can check when does that error come?
Hello again everyone. I released another video just now in which I build an entire signup page from scratch using the new responsive engine. You can watch it on YouTube here: https://youtu.be/Okobpne9v-E
The page that I build in the video was modelled after this image that I found on Dribble
Hope you find the video helpful! Have a good weekend. Happy Bubbling to you all.
8 Likes
Breakpoints for the win 
3 Likes
@nickc Third party elements, like tables, charts, icons and so on, are randomly taking a 0px height. They also don’t seem to adjust to alignment rules. I urge you to make this a priority.
Perhaps a hotfix is in order?
3 Likes
WOW. Just took 10 mins to play around with it and it is AMAZING!
The Align to Parent is a lifesaver, soooo easy to use and I was able to build a full responsive sidebar in 60 seconds.
Great job
5 Likes
Nice! I was thinking the Align to Parent layout mode might be good for that as well as various “dashboard-like” layouts, since elements can basically be “pinned” to various locations around the edges of the container.
Seems like the new layout engine brings a ton of flexibility with respect to how to achieve a given UI.
3 Likes
It’s so powerful, and it was mobile ready out of the box just using that align to parent system. Truly a huge leap forward