Element: Grid
complete
Louis Reingold
complete
The Grid element is now available in Breakdance 1.4.
Louis Reingold
This is coming to Breakdance 1.4, and you can play with it right now since we already shipped the beta: https://www.youtube.com/watch?v=n9GiFe_ITbA
Louis Reingold
We would love to remove the "Advanced" controls for the Grid element and move all that stuff to https://breakdance.canny.io/features/p/css-grid-controls
Give me legitimate real-world use cases for them to convince us to keep them in the Grid element.
Louis Reingold
Breakdance 1.4 Beta 1 with the Grid element is now available: https://www.youtube.com/watch?v=n9GiFe_ITbA
We're requesting your feedback.
Please note we also have a separate feature request for CSS grid: https://breakdance.canny.io/features/p/css-grid-controls
Dustin Dauncey
I wonder if this would effectively replace the columns element or if it’d just be a different use-case completely. If you can achieve everything in the new grid element that you could in columns then I’d almost suspect the grid element should just replace the columns element.
Louis Reingold
Dustin Dauncey: Grid element - all elements have same width. Columns element - 60/40, 70/30, 50/25/25, 12.4328 + 29.38 + x = 100, etc.
Louis Reingold
Column has layout controls. You can put multiple children in a single Column. To do that with Grid, you'd need to add a Div.
J
John Marrington
Is there an ETA on this release?
Louis Reingold
Shortly after we ship 1.3 final (we're on RC 1 right now) we'll ship this in 1.4 Beta 1.
Louis Reingold
Sneak preview
J
John Marrington
Louis Reingold: nice nice 👍
Andrzej Dubiel
in progress
T. T.
or a grid overlay like in figma, would be awesome.
J
Jeusu
Louis Reingold will this make it so we can create similar columns like in Oxygen as in many cases I am finding the current columns unusable and having to resort to coding my own columns from scratch to get desired layouts between breakpoints.
Renato Ćorluka
Louis Reingold
Auto-grid idea suggestion.
Element controls could be based on the div (only 100% width default) with new layout controls:
Types: Auto-fit, Auto-fill
Gap should like border control (XY locked, XY separate)
Users sets just desired cell width, and it will be fluid across all screen sizes.
CSS mechanism behind:
Louis Reingold
Cool concept if you know CSS. But 99.9% of users don't know what auto-fit or auto-fill means without reading the CSS tricks article, and most would give up 1/100th of the way through the article.
Everyone knows what "Items Per Row" and "Space Between Items" means.
That said, option for creating grid the way you described is likely to be at least somewhat a part of https://breakdance.canny.io/features/p/css-grid-controls
Renato Ćorluka
Louis Reingold:
Agree about your points, saw beta implementation in group looks good and intuitive.
Load More
→