I've been using sass and going kind of mixin crazy in my latest project. Once you discover all the various CSS3 generators online, creating good-looking mixins is absolutely trivial and a lot of fun.
A couple of comments:
1. Aside from my dislike of CamelCase on a few classes, it might be simpler to call the .borderRadius helper "round"? .borderRadius(@radius) is not the best naming, IMHO.
2. As mentioned below, click-stops on gradients really make for nice looking gradients.
3. For the button, I suppose you could make it into a helper method where it can take @buttonColor as a parameter. I'm not loving the almost brown color for the active state. What I did was the reverse the gradient for the active state - so light to dark becomes dark to light when clicked on.
Lastly, what I'm finding is that all these gradients, mixins, shadows, etc. do add up, but I supposed if we compress our assets it will in most cases be less than using images. Anyway, nice work.
I just updated the script with 3- and 4-color gradients, and with the call to action button as a helper method with color as a parameter. Thanks for the suggestions!
Comments
I've been using sass and going kind of mixin crazy in my latest project. Once you discover all the various CSS3 generators online, creating good-looking mixins is absolutely trivial and a lot of fun.
A couple of comments:
1. Aside from my dislike of CamelCase on a few classes, it might be simpler to call the .borderRadius helper "round"? .borderRadius(@radius) is not the best naming, IMHO. 2. As mentioned below, click-stops on gradients really make for nice looking gradients. 3. For the button, I suppose you could make it into a helper method where it can take @buttonColor as a parameter. I'm not loving the almost brown color for the active state. What I did was the reverse the gradient for the active state - so light to dark becomes dark to light when clicked on.
Lastly, what I'm finding is that all these gradients, mixins, shadows, etc. do add up, but I supposed if we compress our assets it will in most cases be less than using images. Anyway, nice work.
I just updated the script with 3- and 4-color gradients, and with the call to action button as a helper method with color as a parameter. Thanks for the suggestions!