diff --git a/scss/api/_declare.scss b/scss/api/_declare.scss index e58af0c..850bfbd 100644 --- a/scss/api/_declare.scss +++ b/scss/api/_declare.scss @@ -23,9 +23,9 @@ /// @output The declarations as CSS property-value pairs. /// @example scss /// .foo { -/// $rules: ('height': 50px, 'padding': 1rem 5rem); +/// $foo-declarations: ('height': 50px, 'padding': 1rem 5rem); /// -/// @include _declare($rules); +/// @include _declare($foo-declarations); /// } /// /// // Output CSS: diff --git a/scss/api/_module.scss b/scss/api/_module.scss index daf02c0..bd2c467 100644 --- a/scss/api/_module.scss +++ b/scss/api/_module.scss @@ -75,6 +75,7 @@ @import 'result'; @import 'rest'; @import 'reverse'; +@import 'rules'; @import 'sample'; @import 'shuffle'; @import 'size'; diff --git a/scss/api/_rules.scss b/scss/api/_rules.scss new file mode 100644 index 0000000..e0d33fa --- /dev/null +++ b/scss/api/_rules.scss @@ -0,0 +1,55 @@ + + +@mixin __rules($rules: ()) { + @if not __is-map($rules) + or not __every($rules, '__is-map') { + @error 'Rules for _rules mixin must be key-value pairs, where value is a declaration map.'; + } @else { + @each $selector, $declarations in $rules { + #{$selector} { + @include __declare($declarations); + } + } + } + + @content; +} + + +/// +/// Includes a ruleset for each selector-declarations pair in the map. +/// +/// +/// @access public +/// @group Map +/// @param {Map} $rules [()] The rules map. +/// @output The rulesets for each selector key. +/// @example scss +/// $test-rules: ( +/// '.foo': ( +/// 'height': 50px, +/// 'padding': 1rem 5rem +/// ), +/// '.bar .baz': ( +/// 'width': 50px, +/// 'margin': 2rem 6rem +/// ) +/// ); +/// +/// @include _rules($test-rules); +/// +/// // Output CSS: +/// .foo { +/// height: 50px; +/// padding: 1rem 5rem; +/// } +/// +/// .bar .baz { +/// width: 50px; +/// margin: 2rem 6rem; +/// } + +@mixin _rules($args...) { + @include __rules($args...); +} +