I have now done about five sites with Sass implemented. I've noticed a trend of either going back and forth with my custom styles like buttons and forms and then hooking in vendor files like susy.
But now I have a break from projects and I want to develop a simple sass framework for myself. Basically I want to have an absolute definition for a class, a size class and then a style class for each one of my components. With the hopes that as I develop I can apply different "themes" as I go.
An example:
.btn { Text-align: center; Display: inline-block; Text-decoration: none; //you get the idea }
.btn-sm { Font-size: .8em; Padding: 3px 5px; Margin: 2px; // we can also include styles for large full width etc }
.btn-red-outline { Border: 1px solid red; Color: red; }
Of course I can use mapping for colors and loop through them and then for the sizing I can set up variables like $btn-sm-padding: 3px 5px; etc....
So when I call class"btn btn-sm btn-red-outline" it will get all those and can easily be seen through Hmtl and know what they do.
How does everyone feel about this approach? Any other suggestions to make it a little easier to expand newer styles in the future for theme purposes?
Epic visual tool
Epson 5030UB 2D/3D 1080p 3LCD Projector
No comments:
Post a Comment