Initial 'Phases' implementation finding SASS variables prefixed $bp-

[benedfit]

Basic feature to traverse /css/scss folder structure and find SASS variables prefixed '$bp-', then render as a 'Phases' tab in the menu bar, using remainder of variable name and value for control e.g. $bp-small become SMALL > 24em

Basic support provided for detecting whether px or em value has been specified.

TODO:

• Provide configuration to allow user to set pattern to match variable name on.
• Possibly order the options based on size rather than order of declaration
• Confirm this works with .sass as well as .scss
• Deal with other browser units of measure

[dmolsen]

I'll let @bradfrost merge this if he feels it fits the project but it looks really cool. I saw the blog post and I'm glad you're hacking on the project. It's a really fantastic idea. I'm going to merge it with the stuff I've developed as an expansion on Brad's ideas.

[bradfrost]

I'm going to give this a shot. Seems interesting!