I see different approaches to breakpoints and responsive design. Most of the time they are over-complicated and only making things worse. So here’s mine suggestion for device breakpoints that are in touch with reality.
Once in a while comes a moment when you decide to change an icon set you have been using. Just a bit of upfront planning goes a long way. Consider a system that turns icons into independent components.
This is extracted from the Github issue created to discuss the approach with my team. Please bear with me if I refer to something that wasn’t mentioned in the text.
Inspired by Ungrid and BASSCSS I have decided to build on top of their shoulders. Welcome the nanogrid.