Create a component with a slot in responsive columns

Ideas and Feedback
1

Trying to make a column section component that would allow our non-technical folks to easily add in columns when using the component.

Problem:
Unable to create a column section component that allows end-users to add additional columns without having to modify any styles.

Currently we have it so that column type is child of a slot target. This work for just desktop but isn’t really supported in responsive breakpoints because slot children share the same column count across all the variants.

Suggestions:
• Allow for usage of slot target as child of the column type.
• Allow for slot target children to be styled individual on different breakpoints.

2

This isn’t a big deal atm since we’re just going to opt-in to using grid instead. But it does mean that we’ll be banning to usage of responsive columns for designers creating sections

3

Hey @responsible_spider,
Please check this thread. I have solved the same issue long ago when we didn’t even have the option for number of columns.

https://plasmiccommunity.slack.com/archives/C01NR9R0MS7/p1628791088031000?thread_ts=1628247102.025600&cid=C01NR9R0MS7

It’s a bit hacky solution where I converted the column to a separate component. Let me know if that helps.

Also, there will surely exists a new solution considering the improvements we have now in Responsive Column element.

4

Thanks @zonal_mammal! There’s another work around that we can use for now without having to override anything in code and that’s with CSS grid. Just reporting this here since there are benefits of using responsive columns over grid, but for the time being the things we’re working on has the flexibility of using either.