bootstrap/mixins/_utilities.scss

0001 // Utility generator
0002 // Used to generate utilities & print utilities
0003 @mixin generate-utility($utility, $infix, $is-rfs-media-query: false) {
0004   $values: map-get($utility, values);
0005
0006   // If the values are a list or string, convert it into a map
0007   @if type-of($values) == "string" or type-of(nth($values, 1)) != "list" {
0008     $values: zip($values, $values);
0009   }
0010
0011   @each $key, $value in $values {
0012     $properties: map-get($utility, property);
0013
0014     // Multiple properties are possible, for example with vertical or horizontal margins or paddings
0015     @if type-of($properties) == "string" {
0016       $properties: append((), $properties);
0017     }
0018
0019     // Use custom class if present
0020     $property-class: if(map-has-key($utility, class), map-get($utility, class), nth($properties, 1));
0021     $property-class: if($property-class == null, "", $property-class);
0022
0023     // State params to generate pseudo-classes
0024     $state: if(map-has-key($utility, state), map-get($utility, state), ());
0025
0026     $infix: if($property-class == "" and str-slice($infix, 1, 1) == "-", str-slice($infix, 2), $infix);
0027
0028     // Don't prefix if value key is null (eg. with shadow class)
0029     $property-class-modifier: if($key, if($property-class == "" and $infix == "", "", "-") + $key, "");
0030
0031     @if map-get($utility, rfs) {
0032       // Inside the media query
0033       @if $is-rfs-media-query {
0034         $val: rfs-value($value);
0035
0036         // Do not render anything if fluid and non fluid values are the same
0037         $value: if($val == rfs-fluid-value($value), null, $val);
0038       }
0039       @else {
0040         $value: rfs-fluid-value($value);
0041       }
0042     }
0043
0044     $is-rtl: map-get($utility, rtl);
0045
0046     @if $value != null {
0047       @if $is-rtl == false {
0048         /* rtl:begin:remove */
0049       }
0050       .#{$property-class + $infix + $property-class-modifier} {
0051         @each $property in $properties {
0052           #{$property}: $value if($enable-important-utilities, !important, null);
0053         }
0054       }
0055
0056       @each $pseudo in $state {
0057         .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
0058           @each $property in $properties {
0059             #{$property}: $value if($enable-important-utilities, !important, null);
0060           }
0061         }
0062       }
0063       @if $is-rtl == false {
0064         /* rtl:end:remove */
0065       }
0066     }
0067   }
0068 }