File structure
File structure is very important when you are planning a system/framework. When you start creating something, it needs an evolution. So according to development process your system is evolving. It changes a lot when your system is evolving. So, let's create a simple structure:
Useful mixins:
Short forms of useful elements
Inline list
Primitives
Clearfix
Simple gradient generators
Grid mixins:
n of n grid
Forms:
Input/textarea styling helpers
Input placeholders
Buttons:
Inline (with auto-width)
Full-width
Standard navigation:
One level
Two level
We will use mixins instead of already created classes. Why? We want to reduce CSS code as much as we can so that, when we generate full 12 grid, we will produce 12 classes in each breakpoint in media queries. As frontend developers, we want to create as much code as needed. Of course, we can reuse some classes and extend them with SASS, but the main approach of this framework is simple and reusable mixins.