Breakpoint helpers / markers#237

There is disassociation between selectors and different breakpoints / media-queries. In that, when viewing selectors (for example in ‘All breakpoints’) you are not made aware that there might be matching selectors set in other breakpoints.

I therefore suggest, it would be really helpful, if there were visual indicators just beneath each selector (on whichever current breakpoint you’re currently in) to show that this selector also exists on one or more others.

This marker could either be a colored, circular marker; or a small visual icon (as seen on most other responsive design UI’s, this is most likely to be a mobile, tablet, laptop, desktop icon …but could just as easily be symbolic of small, medium, large, extra-large). This marker would correspond to breakpoints in the dropdown breakpoint selector.

In addition, markers could be made clickable - taking the user to that breakpoint, scrolling until the selector (highlighted) is in view …making it even easier.

This is good quality feedback, thank you very much! We have just made a working prototype for this.

Thank you Luke.

I’m really enjoying what you’ve built so far / very excited for the direction of CF / and so happy to help with suggestions. I personally plan to use CF as the permanent backbone to most of my workflows, moving forwards.

Kudos to the whole team for working on this (and for the way you encourage community involvement).
While I’ve not long become a member of the community - it is fair to say I am very much an ambassador / supporter of the project.

Looking forward to following your roadmap / plans more closely, and of course, to see what amazing things you will do with CF!! 👍🏻