webiny-js
webiny-js copied to clipboard
feat: add fluid container layout
Changes
Implements issue "Add fluid container layout".
How Has This Been Tested?
Manual
Documentation
None
@neatbyte-vnobis - I've tested this one, but I don't really understand how it works. I see the cell has a toggle saying absolute positioning, but when I toggle that the cell just collapses. How do I actually position something?
@neatbyte-vnobis - I've tested this one, but I don't really understand how it works. I see the cell has a toggle saying absolute positioning, but when I toggle that the cell just collapses. How do I actually position something?
After toggling "Absolute positioning" all elements inside cell become absolute positioned, that is why cell looks "collapsed". To make it look better you can set grid height some value in px. Then you can change position of elements inside cell by selecting element and changing values under the "Position" tab.
I see, I missed the "Position" property in the sidebar. To improve the UX, can we do a few things:
- When a cell is set to "absolute" positioning, set a fixed height on the Grid element to 200px, only if the current height on the grid is not defined in "px".
- When we place an element inside an absolutely positioned cell, set the width of that element's container to "auto". So that it doesn't go outside the borders of the cell element to avoid situations as in this example:

@SvenAlHamad @adrians5j
Any updates on this PR?
Maybe it worth to merge latest next into it and retest it
@SvenAlHamad Is this feature still relevant? Should we resolve conflicts and retest it, or close this PR?
It's still relevant, but we'll de-prioritize this one for now until we have more time to think about the approach.