aboutsummaryrefslogtreecommitdiffstats
path: root/test/_gradients.scss
diff options
context:
space:
mode:
Diffstat (limited to 'test/_gradients.scss')
-rw-r--r--test/_gradients.scss114
1 files changed, 59 insertions, 55 deletions
diff --git a/test/_gradients.scss b/test/_gradients.scss
index c1145aa..c11439c 100644
--- a/test/_gradients.scss
+++ b/test/_gradients.scss
@@ -1,8 +1,12 @@
1// sass-lint:disable no-color-literals zero-unit 1// sass-lint:disable no-color-literals zero-unit
2 2
3@include describe('Gradients') { 3@use 'true' as *;
4 @include it('iro-easing-gradient') { 4@use '../src/easing';
5 $gradient1: iro-easing-gradient( 5@use '../src/gradients';
6
7@include describe('gradients') {
8 @include it('easing-gradient') {
9 $gradient1: gradients.easing-gradient(
6 linear, 10 linear,
7 to right, 11 to right,
8 #000, 12 #000,
@@ -13,9 +17,9 @@
13 $expected1: linear-gradient( 17 $expected1: linear-gradient(
14 to right, 18 to right,
15 #000 0, 19 #000 0,
16 mix(transparent, #000, iro-ease-in-quad(0.25) * 100%) 25%, 20 mix(transparent, #000, easing.ease-in-quad(0.25) * 100%) 25%,
17 mix(transparent, #000, iro-ease-in-quad(0.5) * 100%) 50%, 21 mix(transparent, #000, easing.ease-in-quad(0.5) * 100%) 50%,
18 mix(transparent, #000, iro-ease-in-quad(0.75) * 100%) 75%, 22 mix(transparent, #000, easing.ease-in-quad(0.75) * 100%) 75%,
19 transparent 100% 23 transparent 100%
20 ); 24 );
21 25
@@ -23,7 +27,7 @@
23 27
24 // --------------------------------------------------------------------------- 28 // ---------------------------------------------------------------------------
25 29
26 $gradient2: iro-easing-gradient( 30 $gradient2: gradients.easing-gradient(
27 radial, 31 radial,
28 1em 2em at 50% 60%, 32 1em 2em at 50% 60%,
29 #000, 33 #000,
@@ -34,9 +38,9 @@
34 $expected2: radial-gradient( 38 $expected2: radial-gradient(
35 1em 2em at 50% 60%, 39 1em 2em at 50% 60%,
36 #000 0, 40 #000 0,
37 mix(transparent, #000, iro-ease-out-cubic(0.25) * 100%) 25%, 41 mix(transparent, #000, easing.ease-out-cubic(0.25) * 100%) 25%,
38 mix(transparent, #000, iro-ease-out-cubic(0.5) * 100%) 50%, 42 mix(transparent, #000, easing.ease-out-cubic(0.5) * 100%) 50%,
39 mix(transparent, #000, iro-ease-out-cubic(0.75) * 100%) 75%, 43 mix(transparent, #000, easing.ease-out-cubic(0.75) * 100%) 75%,
40 transparent 100% 44 transparent 100%
41 ); 45 );
42 46
@@ -44,7 +48,7 @@
44 48
45 // --------------------------------------------------------------------------- 49 // ---------------------------------------------------------------------------
46 50
47 $gradient3: iro-easing-gradient( 51 $gradient3: gradients.easing-gradient(
48 linear, 52 linear,
49 to right, 53 to right,
50 #000 2em, 54 #000 2em,
@@ -55,9 +59,9 @@
55 $expected3: linear-gradient( 59 $expected3: linear-gradient(
56 to right, 60 to right,
57 #000 2em, 61 #000 2em,
58 mix(transparent, #000, iro-ease-in-quad(0.25) * 100%) 4em, 62 mix(transparent, #000, easing.ease-in-quad(0.25) * 100%) 4em,
59 mix(transparent, #000, iro-ease-in-quad(0.5) * 100%) 6em, 63 mix(transparent, #000, easing.ease-in-quad(0.5) * 100%) 6em,
60 mix(transparent, #000, iro-ease-in-quad(0.75) * 100%) 8em, 64 mix(transparent, #000, easing.ease-in-quad(0.75) * 100%) 8em,
61 transparent 10em 65 transparent 10em
62 ); 66 );
63 67
@@ -65,7 +69,7 @@
65 69
66 // --------------------------------------------------------------------------- 70 // ---------------------------------------------------------------------------
67 71
68 $gradient4: iro-easing-gradient( 72 $gradient4: gradients.easing-gradient(
69 linear, 73 linear,
70 to right, 74 to right,
71 #000 20%, 75 #000 20%,
@@ -76,9 +80,9 @@
76 $expected4: linear-gradient( 80 $expected4: linear-gradient(
77 to right, 81 to right,
78 #000 20%, 82 #000 20%,
79 mix(transparent, #000, iro-ease-in-quad(0.25) * 100%) calc(20% + (20% + 10em - 20%) * 0.25), 83 mix(transparent, #000, easing.ease-in-quad(0.25) * 100%) calc(20% + (20% + 10em - 20%) * 0.25),
80 mix(transparent, #000, iro-ease-in-quad(0.5) * 100%) calc(20% + (20% + 10em - 20%) * 0.5), 84 mix(transparent, #000, easing.ease-in-quad(0.5) * 100%) calc(20% + (20% + 10em - 20%) * 0.5),
81 mix(transparent, #000, iro-ease-in-quad(0.75) * 100%) calc(20% + (20% + 10em - 20%) * 0.75), 85 mix(transparent, #000, easing.ease-in-quad(0.75) * 100%) calc(20% + (20% + 10em - 20%) * 0.75),
82 transparent calc(20% + 10em) 86 transparent calc(20% + 10em)
83 ); 87 );
84 88
@@ -86,7 +90,7 @@
86 90
87 // --------------------------------------------------------------------------- 91 // ---------------------------------------------------------------------------
88 92
89 $gradient5: iro-easing-gradient( 93 $gradient5: gradients.easing-gradient(
90 linear, 94 linear,
91 to right, 95 to right,
92 #000 2em, 96 #000 2em,
@@ -99,9 +103,9 @@
99 to right, 103 to right,
100 #000 2em, 104 #000 2em,
101 #f00 7em, 105 #f00 7em,
102 mix(transparent, #f00, iro-ease-in-quad(0.25) * 100%) 7em + 3em * 0.25, 106 mix(transparent, #f00, easing.ease-in-quad(0.25) * 100%) 7em + 3em * 0.25,
103 mix(transparent, #f00, iro-ease-in-quad(0.5) * 100%) 7em + 3em * 0.5, 107 mix(transparent, #f00, easing.ease-in-quad(0.5) * 100%) 7em + 3em * 0.5,
104 mix(transparent, #f00, iro-ease-in-quad(0.75) * 100%) 7em + 3em * 0.75, 108 mix(transparent, #f00, easing.ease-in-quad(0.75) * 100%) 7em + 3em * 0.75,
105 transparent 10em 109 transparent 10em
106 ); 110 );
107 111
@@ -109,7 +113,7 @@
109 113
110 // --------------------------------------------------------------------------- 114 // ---------------------------------------------------------------------------
111 115
112 $gradient6: iro-easing-gradient( 116 $gradient6: gradients.easing-gradient(
113 linear, 117 linear,
114 to right, 118 to right,
115 #000 2em, 119 #000 2em,
@@ -122,13 +126,13 @@
122 $expected6: linear-gradient( 126 $expected6: linear-gradient(
123 to right, 127 to right,
124 #000 2em, 128 #000 2em,
125 mix(#f00, #000, iro-ease-in-quad(0.25) * 100%) 2em + 5em * 0.25, 129 mix(#f00, #000, easing.ease-in-quad(0.25) * 100%) 2em + 5em * 0.25,
126 mix(#f00, #000, iro-ease-in-quad(0.5) * 100%) 2em + 5em * 0.5, 130 mix(#f00, #000, easing.ease-in-quad(0.5) * 100%) 2em + 5em * 0.5,
127 mix(#f00, #000, iro-ease-in-quad(0.75) * 100%) 2em + 5em * 0.75, 131 mix(#f00, #000, easing.ease-in-quad(0.75) * 100%) 2em + 5em * 0.75,
128 #f00 7em, 132 #f00 7em,
129 mix(transparent, #f00, iro-ease-in-quad(0.25) * 100%) 7em + 3em * 0.25, 133 mix(transparent, #f00, easing.ease-in-quad(0.25) * 100%) 7em + 3em * 0.25,
130 mix(transparent, #f00, iro-ease-in-quad(0.5) * 100%) 7em + 3em * 0.5, 134 mix(transparent, #f00, easing.ease-in-quad(0.5) * 100%) 7em + 3em * 0.5,
131 mix(transparent, #f00, iro-ease-in-quad(0.75) * 100%) 7em + 3em * 0.75, 135 mix(transparent, #f00, easing.ease-in-quad(0.75) * 100%) 7em + 3em * 0.75,
132 transparent 10em 136 transparent 10em
133 ); 137 );
134 138
@@ -136,7 +140,7 @@
136 140
137 // --------------------------------------------------------------------------- 141 // ---------------------------------------------------------------------------
138 142
139 $gradient7: iro-easing-gradient( 143 $gradient7: gradients.easing-gradient(
140 linear, 144 linear,
141 to right, 145 to right,
142 #000 2em, 146 #000 2em,
@@ -149,13 +153,13 @@
149 $expected7: linear-gradient( 153 $expected7: linear-gradient(
150 to right, 154 to right,
151 #000 2em, 155 #000 2em,
152 mix(#f00, #000, iro-ease-in-quad(0.25) * 100%) 2em + 4em * 0.25, 156 mix(#f00, #000, easing.ease-in-quad(0.25) * 100%) 2em + 4em * 0.25,
153 mix(#f00, #000, iro-ease-in-quad(0.5) * 100%) 2em + 4em * 0.5, 157 mix(#f00, #000, easing.ease-in-quad(0.5) * 100%) 2em + 4em * 0.5,
154 mix(#f00, #000, iro-ease-in-quad(0.75) * 100%) 2em + 4em * 0.75, 158 mix(#f00, #000, easing.ease-in-quad(0.75) * 100%) 2em + 4em * 0.75,
155 #f00 6em, 159 #f00 6em,
156 mix(transparent, #f00, iro-ease-in-quad(0.25) * 100%) 6em + 4em * 0.25, 160 mix(transparent, #f00, easing.ease-in-quad(0.25) * 100%) 6em + 4em * 0.25,
157 mix(transparent, #f00, iro-ease-in-quad(0.5) * 100%) 6em + 4em * 0.5, 161 mix(transparent, #f00, easing.ease-in-quad(0.5) * 100%) 6em + 4em * 0.5,
158 mix(transparent, #f00, iro-ease-in-quad(0.75) * 100%) 6em + 4em * 0.75, 162 mix(transparent, #f00, easing.ease-in-quad(0.75) * 100%) 6em + 4em * 0.75,
159 transparent 10em 163 transparent 10em
160 ); 164 );
161 165
@@ -163,7 +167,7 @@
163 167
164 // --------------------------------------------------------------------------- 168 // ---------------------------------------------------------------------------
165 169
166 $gradient8: iro-easing-gradient( 170 $gradient8: gradients.easing-gradient(
167 linear, 171 linear,
168 to right, 172 to right,
169 #000, 173 #000,
@@ -176,13 +180,13 @@
176 $expected8: linear-gradient( 180 $expected8: linear-gradient(
177 to right, 181 to right,
178 #000 0, 182 #000 0,
179 mix(#f00, #000, iro-ease-in-quad(0.25) * 100%) 50% * 0.25, 183 mix(#f00, #000, easing.ease-in-quad(0.25) * 100%) 50% * 0.25,
180 mix(#f00, #000, iro-ease-in-quad(0.5) * 100%) 50% * 0.5, 184 mix(#f00, #000, easing.ease-in-quad(0.5) * 100%) 50% * 0.5,
181 mix(#f00, #000, iro-ease-in-quad(0.75) * 100%) 50% * 0.75, 185 mix(#f00, #000, easing.ease-in-quad(0.75) * 100%) 50% * 0.75,
182 #f00 50%, 186 #f00 50%,
183 mix(transparent, #f00, iro-ease-in-quad(0.25) * 100%) 50% + 50% * 0.25, 187 mix(transparent, #f00, easing.ease-in-quad(0.25) * 100%) 50% + 50% * 0.25,
184 mix(transparent, #f00, iro-ease-in-quad(0.5) * 100%) 50% + 50% * 0.5, 188 mix(transparent, #f00, easing.ease-in-quad(0.5) * 100%) 50% + 50% * 0.5,
185 mix(transparent, #f00, iro-ease-in-quad(0.75) * 100%) 50% + 50% * 0.75, 189 mix(transparent, #f00, easing.ease-in-quad(0.75) * 100%) 50% + 50% * 0.75,
186 transparent 100% 190 transparent 100%
187 ); 191 );
188 192
@@ -190,7 +194,7 @@
190 194
191 // --------------------------------------------------------------------------- 195 // ---------------------------------------------------------------------------
192 196
193 $gradient9: iro-easing-gradient( 197 $gradient9: gradients.easing-gradient(
194 linear, 198 linear,
195 to right, 199 to right,
196 #000, 200 #000,
@@ -203,13 +207,13 @@
203 $expected9: linear-gradient( 207 $expected9: linear-gradient(
204 to right, 208 to right,
205 #000 0, 209 #000 0,
206 mix(#f00, #000, iro-ease-in-quad(0.25) * 100%) 10em * 0.25, 210 mix(#f00, #000, easing.ease-in-quad(0.25) * 100%) 10em * 0.25,
207 mix(#f00, #000, iro-ease-in-quad(0.5) * 100%) 10em * 0.5, 211 mix(#f00, #000, easing.ease-in-quad(0.5) * 100%) 10em * 0.5,
208 mix(#f00, #000, iro-ease-in-quad(0.75) * 100%) 10em * 0.75, 212 mix(#f00, #000, easing.ease-in-quad(0.75) * 100%) 10em * 0.75,
209 #f00 10em, 213 #f00 10em,
210 mix(transparent, #f00, iro-ease-in-quad(0.25) * 100%) 10em + 10em * 0.25, 214 mix(transparent, #f00, easing.ease-in-quad(0.25) * 100%) 10em + 10em * 0.25,
211 mix(transparent, #f00, iro-ease-in-quad(0.5) * 100%) 10em + 10em * 0.5, 215 mix(transparent, #f00, easing.ease-in-quad(0.5) * 100%) 10em + 10em * 0.5,
212 mix(transparent, #f00, iro-ease-in-quad(0.75) * 100%) 10em + 10em * 0.75, 216 mix(transparent, #f00, easing.ease-in-quad(0.75) * 100%) 10em + 10em * 0.75,
213 transparent 20em 217 transparent 20em
214 ); 218 );
215 219
@@ -217,7 +221,7 @@
217 221
218 // --------------------------------------------------------------------------- 222 // ---------------------------------------------------------------------------
219 223
220 $gradient10: iro-easing-gradient( 224 $gradient10: gradients.easing-gradient(
221 linear, 225 linear,
222 to right, 226 to right,
223 #000, 227 #000,
@@ -228,9 +232,9 @@
228 $expected10: linear-gradient( 232 $expected10: linear-gradient(
229 to right, 233 to right,
230 #000 0, 234 #000 0,
231 mix(transparent, #000, iro-cubic-bezier(0.47, 0, 0.745, 0.715, 0.25) * 100%) 25%, 235 mix(transparent, #000, easing.cubic-bezier(0.47, 0, 0.745, 0.715, 0.25) * 100%) 25%,
232 mix(transparent, #000, iro-cubic-bezier(0.47, 0, 0.745, 0.715, 0.5) * 100%) 50%, 236 mix(transparent, #000, easing.cubic-bezier(0.47, 0, 0.745, 0.715, 0.5) * 100%) 50%,
233 mix(transparent, #000, iro-cubic-bezier(0.47, 0, 0.745, 0.715, 0.75) * 100%) 75%, 237 mix(transparent, #000, easing.cubic-bezier(0.47, 0, 0.745, 0.715, 0.75) * 100%) 75%,
234 transparent 100% 238 transparent 100%
235 ); 239 );
236 240
@@ -238,7 +242,7 @@
238 242
239 // --------------------------------------------------------------------------- 243 // ---------------------------------------------------------------------------
240 244
241 $gradient11: iro-easing-gradient( 245 $gradient11: gradients.easing-gradient(
242 linear, 246 linear,
243 to right, 247 to right,
244 #000, 248 #000,
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-11-25 02:48:40 +0000