-
Notifications
You must be signed in to change notification settings - Fork 922
/
_outline.scss
38 lines (38 loc) · 1.28 KB
/
_outline.scss
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
// 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.';
}
}
}