SASS Mixins

[Josh]

A question to the people who’ve been doing SASS a long time – would you guys offer any advice on mixins? How is it best to build and use mixins? Should I be using a mixin library to keep things consistent? Or is it best to build and maintain all your own?

[Alen]

You can look at various frameworks and Sass libraries. This is how I built my collection. Modify it to your own needs and you’re done. Or use pre-made library. Really up to you.

https://github.com/search?q=sass+mixins

[__]

using mixins: any time you find a bit of css that you need to use more than once.

building mixins: I assume you’re not askin about syntax, but logical approaches…? As with all programming, this would depend on the context.

mixin libraries: again, depends on context. At the very least, I would recommend putting them in a separate file so they’re isolated from other output and are easily reusable.

rolling vs. pre-made: if there’s a pre-made mixin that does exactly what you need, there’s no reason not to use it. Sometimes, you’ll have something specific to your project where it would be better to make your own.

Is this a purely academic question? or do you have a specific thing that you’re trying to solve?

[TheDoc]

I generally just use Compass and like their mixins (though I have modified a couple of them).

Keep in mind, though, that sometimes you want a mixin and other times you want to use @extend.

For me, mixins are something that you pass a variable to and you would use extend when you don’t need to pass anything to it. This is because using @include duplicates CSS and @extend just adds a new selector. If you use @include a lot you could be seriously bloating your final code.

[__]

My concern was that if there were comprehensive existing libraries everyone uses and someone else might look at it and know what I’m doing that would be great instead of me just wild westing it and ending up with a totally weird set of just my own mixins no one would recognize.

In general, if there is a mixin, I use it. I’m not going to import an entire library or framework just for the one item, though; if it’s “that good” I’ll just pull it out and drop it in my own library. This also has the advantage of being a lot easier to do, when you’re just starting out. Your “custom” library will grow naturally over time.

Some of it is preference, too. I know compass is very popular, and very capable, but it’s too heavy for my taste and feels “clunky.” I use bourbon for the most part.

As @TheDoc says, includes and mixins are different. And don’t forget about functions.

(or at least every cohesive team’s is the same, right?)

lolz, go read this thread

[Author]

Posts