As we saw in the animation example, we can pass the whole block of style in the @mixin rules.
The block of style called a “content block” in SassScript.
How to pass the content block?
Just include @content at-rule in @mixin body to pass the entire content block.
Just like this:
@mixin hover {
&:not([disabled]):hover {
@content;
}
}
Examples: pass the content block
Checkout the working example:
@include multiple @content
A Content Block can only see (has access to) the local variables, only where the @mixin is included. In other words, a Content Block is lexically scoped.
How to pass arguments to Content Blocks?
Passing arguments in content blocks is same as passing arguments to any function.
Just add arguments to @content() when you include it in @mixin.
How to accept the arguments?
Just write the @include using ().
Examples: pass arguments to Content Blocks
Here’s the example above with passing arguments and taking it to apply style.
If you pass arguments to content blocks using mixin then the content blocks must accept the arguments.
content blocks parameters sass style
