Search code examples
csslessmedia-queriesless-mixins

Send properties as argument for mixin

I'd like to break out all of my Media-queries and pass the CSS properties as arguments instead.

.bp1(@css){
    @media (max-width: 959px){
        @css
    }
}

.bp1(width: 186px;);

Unfortunately, this wont work and makes the Less fail :(

Solution

  • The LESS documentation about mixins says: "Mixins allow you to embed all the properties of a class into another class by simply including the class name as one of its properties. It’s just like variables, but for whole classes. Mixins can also behave like functions, and take arguments, as seen in the example bellow."

    You can't have anything but css properties and their values, either stated or represented by a variable, in a mixin. So what you're trying to do is invalid.