2d3ca553 |
1 | @charset "UTF-8"; |
2 | |
3 | /// Sets the `width` and `height` of the element in one statement. |
4 | /// |
5 | /// @argument {number (with unit) | string} $width |
6 | /// |
7 | /// @argument {number (with unit) | string} $height [$width] |
8 | /// |
9 | /// @example scss |
10 | /// .first-element { |
11 | /// @include size(2em); |
12 | /// } |
13 | /// |
14 | /// // CSS Output |
15 | /// .first-element { |
16 | /// width: 2em; |
17 | /// height: 2em; |
18 | /// } |
19 | /// |
20 | /// @example scss |
21 | /// .second-element { |
22 | /// @include size(auto, 10em); |
23 | /// } |
24 | /// |
25 | /// // CSS Output |
26 | /// .second-element { |
27 | /// width: auto; |
28 | /// height: 10em; |
29 | /// } |
30 | /// |
31 | /// @require {function} _is-size |
32 | |
33 | @mixin size( |
34 | $width, |
35 | $height: $width |
36 | ) { |
37 | @if _is-size($height) { |
38 | height: $height; |
39 | } @else { |
40 | @error "`#{$height}` is not a valid length for the `$height` argument " + |
41 | "in the `size` mixin."; |
42 | } |
43 | |
44 | @if _is-size($width) { |
45 | width: $width; |
46 | } @else { |
47 | @error "`#{$width}` is not a valid length for the `$width` argument " + |
48 | "in the `size` mixin."; |
49 | } |
50 | } |