Hi,
Is anybody having problems with “fit width to content” with the new responsive engine?
I’ve ticked all the elements inside my reusable popup “collapse when hidden”. In the example below elements have maximum widths set less than the popup’s.
But the popup is not fitting to the width of the elements inside the popup.
Having the same problem in my app. If I give it a fixed width or a max width, those apply just fine; but the fit-to-width (and, more problematically, the fit-to-content-height) features seem to be completely broken.
Any tips for getting my popups to grow instead of just scrolling internally?
Is there going to be an answer to this? I need a reusable element to be responsive to the height of the page I put it on, without having to change anything. @josh@superforge Hoping I tagged the right people.
I had the same issue and found a great way to handle this! After so much time trying different methods, the solution was actually simple to implement.
Ensure the first level under your Popup is a Group (preferably set to Column). You will set this group’s min. width, height, fit to content, background color, etc. as needed.
Next, go to the popup and set the Background style and Shadow style to “None”.
The popup is still there at a greater width, just not visible to the user. This means if the user clicks on the supposedly transparent area which is inside the popup, the popup does not close, because it is still there.
This can be worked around by introducing a click event which closes the popup, but then the cursor is affected while in the popup area (it becomes the “hand” click cursor).
This is a usability issue and a bug, the proposed solution is subpar.
Do you have a better solution to share? Correct, it is not a “solution” as the issue is with Bubble. Calling it a workaround would be more appropriate. I hadn’t seen any other steps that would work, and although yes it is invisible to the user so click to the left or right doesn’t exit, it is better than nothing.
I’m still seeing this issue that fit height to content ticked on a reusable element, just doesn’t consider the content that is present on the reusable element page …