Sanded down some of the rough edges on my Layout Breakouts Builder
https://layout-breakouts-builder.vercel.app/
Would love for someone to try it out! All feedback welcomed!
Inspired by the work of @hexagoncircle and @kevinpowell combined with my heavy usage of it for the last ~6 months on production sites.
@walpolea @hexagoncircle @kevinpowell
Oh no! That code pyramid... It's callback hell all over again.
Here's how I did it a month ago:
@walpolea @hexagoncircle @kevinpowell
I do like the editor you've made though
@walpolea Visually speaking, it'd be great if you could use (sub)grid to align items in your `.track-definitions`, not critical, just nicer looking.
And the "Add" input below should react to the Enter key if possible.
In the code, I love the indentation to show the track hierarchy! A detail, though `:where(*)` is the same as `*` so you can shave a little cognitive overhead there, but I can understand wanting to keep that for customisation. And a copy to Clipboard would be a nice addition.
@chriskirknielsen Thank you, I appreciate the feedback. I've added the copy button and the `Enter` key support.
And you're right about the `:where(*)`, it was left from pairing back an existing customized solution I have on another project.
As for `subgrid`, I have a to do to see how this pattern changes with it, but have not yet looked into it. I haven't started using `subgrid` in production other than small progressive enhancement situations.
Andrew Walpole
spartanatreyu
Luke Dorny 
Christopher Kirk-Nielsen