shadow-scss/_shadow.scss at main · n3r4zzurr0/shadow-scss · GitHub

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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
@use "sass:meta";
@use "sass:math";

// @param  {Number}  $value
// @param  {Number}  $n
// @return {Number}

@function round-n($value, $n) {
  @return math.div(math.round($value * 10 * $n), (10 * $n));
}

// @param  {String}           $type
// @param  {Number|Function}  $fn
// @param  {Number}           $i
// @param  {Number}           $count
// @return {Number}

@function call-if-function($type, $fn, $i, $count) {
  @return if(meta.type-of($fn) == $type, $fn, call($fn, $i, $count));
}

// @param  {Boolean}          $inset
// @param  {Number|Function}  $x
// @param  {Number|Function}  $y
// @param  {Number|Function}  $blur-radius
// @param  {Number|Function}  $spread-radius
// @param  {Color|Function}   $color
// @param  {Number|Function}  $step
// @param  {Number|Function}  $stepX
// @param  {Number|Function}  $stepY
// @param  {Number}           $count
// @return {String}

@function box-shadow (
  $inset: false,
  $x: 0,
  $y: 0,
  $blur-radius: 0,
  $spread-radius: 0,
  $color: #000,
  $step: 0,
  $stepX: null,
  $stepY: null,
  $count: 1
) {

  $shadow: ();

  @if($stepX == null) {
    $stepX: $step;
  }
  @if($stepY == null) {
    $stepY: $step;
  }

  $_sum-stepX: 0;
  $_sum-stepY: 0;

  @for $i from 1 through $count {

    $_stepX: round-n(call-if-function("number", $stepX, $i, $count), 2);
    $_stepY: round-n(call-if-function("number", $stepY, $i, $count), 2);

    $_sum-stepX: $_sum-stepX + $_stepX;
    $_sum-stepY: $_sum-stepY + $_stepY;

    $_x: round-n(call-if-function("number", $x, $i, $count), 2);
    $_y: round-n(call-if-function("number", $y, $i, $count), 2);
    $_blur-radius: round-n(call-if-function("number", $blur-radius, $i, $count), 2);
    $_spread-radius: round-n(call-if-function("number", $spread-radius, $i, $count), 2);
    $_color: call-if-function("color", $color, $i, $count);

    $shadow: append($shadow, #{if($inset, "inset", "")} #{$_x + $_sum-stepX} #{$_y + $_sum-stepY} $_blur-radius $_spread-radius $_color, comma);
  }

  @return $shadow;
}

// @param  {Number|Function}  $x
// @param  {Number|Function}  $y
// @param  {Number|Function}  $blur-radius
// @param  {Color|Function}   $color
// @param  {Number|Function}  $step
// @param  {Number|Function}  $stepX
// @param  {Number|Function}  $stepY
// @param  {Number}           $count
// @return {String}

@function text-shadow (
  $x: 0,
  $y: 0,
  $blur-radius: 0,
  $color: #000,
  $step: 0,
  $stepX: null,
  $stepY: null,
  $count: 1
) {

  $shadow: ();

  @if($stepX == null) {
    $stepX: $step;
  }
  @if($stepY == null) {
    $stepY: $step;
  }

  $_sum-stepX: 0;
  $_sum-stepY: 0;

  @for $i from 1 through $count {

    $_stepX: round-n(call-if-function("number", $stepX, $i, $count), 2);
    $_stepY: round-n(call-if-function("number", $stepY, $i, $count), 2);

    $_sum-stepX: $_sum-stepX + $_stepX;
    $_sum-stepY: $_sum-stepY + $_stepY;

    $_x: round-n(call-if-function("number", $x, $i, $count), 2);
    $_y: round-n(call-if-function("number", $y, $i, $count), 2);
    $_blur-radius: round-n(call-if-function("number", $blur-radius, $i, $count), 2);
    $_color: call-if-function("color", $color, $i, $count);

    $shadow: append($shadow, #{$_x + $_sum-stepX} #{$_y + $_sum-stepY} $_blur-radius $_color, comma);
  }

  @return $shadow;
}