Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
40 lines (19 sloc) 1.13 KB
---
layout: "post"
title: "Mixins"
date: 2014-07-21
description: "How to use mixins: with and without parameters; with defaults; with an unknown number of mixin arguments"
---
## Mixin basics
Here is how to include a simple mixin, as you can see, the syntax is rather similar between the preprocessors.
<%- @code('Mixins', 'basic') %>
## Mixin parameters and parameter defaults
Mixins can receive one or multiple parameters.
You can even set defaults for each of the parameters. When a parameter has a default value, you don't need to set one when calling the mixin - see how we can omit the `thickness` parameter.
<%- @code('Mixins', 'params') %>
## Named parameters
If, for whatever reason, you want to set the parameters of a mixin in a particular order that is different that the one set in the mixin, you can do that by calling the mixin and explicitly state each of the parameters you're defining.
<%- @code('Mixins', 'params-named') %>
## Unknown number of parameters
If you want to have a mixin with a varying number of parameters, all CSS preprocessors allow you output all arguments like so:
<%- @code('Mixins', 'arguments') %>