|
0
|
1 @charset "UTF-8";
|
|
|
2
|
|
|
3 /// Mixes a color with white.
|
|
|
4 ///
|
|
|
5 /// @argument {color} $color
|
|
|
6 ///
|
|
|
7 /// @argument {number (percentage)} $percent
|
|
|
8 /// The amount of white to be mixed in.
|
|
|
9 ///
|
|
|
10 /// @return {color}
|
|
|
11 ///
|
|
|
12 /// @example scss
|
|
|
13 /// .element {
|
|
|
14 /// background-color: tint(#6ecaa6, 40%);
|
|
|
15 /// }
|
|
|
16 ///
|
|
|
17 /// // CSS Output
|
|
|
18 /// .element {
|
|
|
19 /// background-color: #a8dfc9;
|
|
|
20 /// }
|
|
|
21
|
|
|
22 @function tint(
|
|
|
23 $color,
|
|
|
24 $percent
|
|
|
25 ) {
|
|
|
26
|
|
|
27 @if not _is-color($color) {
|
|
|
28 @error "`#{$color}` is not a valid color for the `$color` argument in " +
|
|
|
29 "the `tint` mixin.";
|
|
|
30 } @else {
|
|
|
31 @return mix(#fff, $color, $percent);
|
|
|
32 }
|
|
|
33 }
|
