|
0
|
1 @charset "UTF-8";
|
|
|
2
|
|
|
3 /// Provides a quick method for targeting `padding` on specific sides of a
|
|
|
4 /// box. Use a `null` value to “skip” a side.
|
|
|
5 ///
|
|
|
6 /// @argument {arglist} $values
|
|
|
7 /// List of padding values, defined as CSS shorthand.
|
|
|
8 ///
|
|
|
9 /// @example scss
|
|
|
10 /// .element-one {
|
|
|
11 /// @include padding(null 1rem);
|
|
|
12 /// }
|
|
|
13 ///
|
|
|
14 /// // CSS Output
|
|
|
15 /// .element-one {
|
|
|
16 /// padding-left: 1rem;
|
|
|
17 /// padding-right: 1rem;
|
|
|
18 /// }
|
|
|
19 ///
|
|
|
20 /// @example scss
|
|
|
21 /// .element-two {
|
|
|
22 /// @include padding(10vh null 10px 5%);
|
|
|
23 /// }
|
|
|
24 ///
|
|
|
25 /// // CSS Output
|
|
|
26 /// .element-two {
|
|
|
27 /// padding-bottom: 10px;
|
|
|
28 /// padding-left: 5%;
|
|
|
29 /// padding-top: 10vh;
|
|
|
30 /// }
|
|
|
31 ///
|
|
|
32 /// @require {mixin} _directional-property
|
|
|
33
|
|
|
34 @mixin padding($values...) {
|
|
|
35 @include _directional-property(padding, false, $values...);
|
|
|
36 }
|
