// Outputs a solid outline of $value… width @mixin u-outline($value…) {
$important: null; $widths: map-deep-get($system-properties, outline, standard); @if has-important($value) { $value: remove($value, "!important"); $important: " !important"; } @each $this-value in $value { $this-value: smart-quote($this-value); $match: false; @if map-has-key($all-color-shortcodes, $this-value) { $match: true; outline-color: color(smart-quote($this-value)) #{$important}; } @else if map-has-key($widths, $this-value) { $match: true; $final-value: map-get($widths, $this-value); outline-width: unquote("#{$final-value}#{$important}"); outline-style: solid#{$important}; } @else if type-of($this-value) == "number" { $converted-value: number-to-token($this-value); @if map-has-key($widths, $converted-value) { $match: true; $final-value: map-get($widths, $converted-value); outline-width: unquote("#{$final-value}#{$important}"); outline-style: solid#{$important}; } @else { @error '#{$this-value} is not a valid outline width. Accepted values: #{map-keys($widths)}'; } } @if not $match { @error '`#{$this-value}` is not a valid outline value.'; } }
}