summaryrefslogtreecommitdiffstats
path: root/src/_config.defaults.scss
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2026-07-22 13:00:59 +0200
committerVolpeon <git@volpeon.ink>2026-07-22 13:00:59 +0200
commitaeed08dc46662a0d70e04bcea612a701633736e7 (patch)
treea4077017d3519185ccd9ea08955fccdd737ffe17 /src/_config.defaults.scss
parentPaths (diff)
downloadiro-design-aeed08dc46662a0d70e04bcea612a701633736e7.tar.gz
iro-design-aeed08dc46662a0d70e04bcea612a701633736e7.tar.bz2
iro-design-aeed08dc46662a0d70e04bcea612a701633736e7.zip
Revert "Paths"
This reverts commit cc5329a5f4d3ea91cac93bc7f9b8f943b7ced226.
Diffstat (limited to 'src/_config.defaults.scss')
-rw-r--r--src/_config.defaults.scss491
1 files changed, 131 insertions, 360 deletions
diff --git a/src/_config.defaults.scss b/src/_config.defaults.scss
index e9e978a..699cd8e 100644
--- a/src/_config.defaults.scss
+++ b/src/_config.defaults.scss
@@ -1,20 +1,21 @@
1@use "sass:list"; 1@use 'sass:list';
2@use "sass:map"; 2@use 'sass:map';
3@use "sass:math"; 3@use 'sass:math';
4@use "pkg:iro-sass/easing" as easing; 4@use 'pkg:iro-sass/src/easing' as easing;
5 5
6$static-colors: ( 6$static-colors: (
7 --base: hsl(0, 0%, 98%), 7 --base: hsl(0, 0%, 98%),
8
8 --levels: ( 9 --levels: (
9 --100: math.div(0, 12) * 110 - 10, 10 --100: math.div(0, 12) * 110 - 10,
10 --200: math.div(1, 12) * 110 - 10, 11 --200: math.div(1, 12) * 110 - 10,
11 --300: math.div(2, 12) * 110 - 10, 12 --300: math.div(2, 12) * 110 - 10,
12 --400: math.div(3, 12) * 110 - 10, 13 --400: math.div(3, 12) * 110 - 10,
13 --500: math.div(4, 12) * 110 - 10, 14 --500: math.div(4, 12) * 110 - 10,
14 --600: math.div(5, 12) * 110 - 10, 15 --600: math.div(5, 12) * 110 - 10,
15 --700: math.div(6, 12) * 110 - 10, 16 --700: math.div(6, 12) * 110 - 10,
16 --800: math.div(7, 12) * 110 - 10, 17 --800: math.div(7, 12) * 110 - 10,
17 --900: math.div(8, 12) * 110 - 10, 18 --900: math.div(8, 12) * 110 - 10,
18 --1000: math.div(9, 12) * 110 - 10, 19 --1000: math.div(9, 12) * 110 - 10,
19 --1100: math.div(10, 12) * 110 - 10, 20 --1100: math.div(10, 12) * 110 - 10,
20 --1200: math.div(11, 12) * 110 - 10, 21 --1200: math.div(11, 12) * 110 - 10,
@@ -22,405 +23,175 @@ $static-colors: (
22 ), 23 ),
23 24
24 --palettes: ( 25 --palettes: (
25 --blue: oklch(56% 0.14 275.25), 26 --blue: oklch(56% .14 275.25),
26 --purple: oklch(56% 0.14 305.58), 27 --purple: oklch(56% .14 305.58),
27 --red: oklch(56% 0.14 14.69), 28 --red: oklch(56% .14 14.69),
28 --green: oklch(56% 0.14 150.48), 29 --green: oklch(56% .14 150.48),
29 --yellow: oklch(56% 0.14 84.08), 30 --yellow: oklch(56% .14 84.08),
30 ), 31 ),
31 32
32 --transparents: ( 33 --transparents: (
33 --100: 0, 34 --100: 0,
34 --200: 0.1, 35 --200: .1,
35 --300: 0.25, 36 --300: .25,
36 --400: 0.4, 37 --400: .4,
37 --500: 0.55, 38 --500: .55,
38 --600: 0.7, 39 --600: .7,
39 --700: 0.8, 40 --700: .8,
40 --800: 0.9, 41 --800: .9,
41 --900: 1, 42 --900: 1,
42 ), 43 ),
43); 44);
44 45
45$semantic-colors-common: ( 46$semantic-colors-common: (
46 --accent: --blue, 47 --accent: --blue,
47 --accent-static: --blue-static, 48 --accent-static: --blue-static,
48 --positive: --green, 49 --positive: --green,
49 --positive-static: --green-static, 50 --positive-static: --green-static,
50 --negative: --red, 51 --negative: --red,
51 --negative-static: --red-static, 52 --negative-static: --red-static,
52 --warning: --yellow, 53 --warning: --yellow,
53 --warning-static: --yellow-static, 54 --warning-static: --yellow-static,
55
56 --focus-raw: --accent,
57 --focus-static: --accent-static,
54 58
55 --focus-raw: --accent, 59 --border-mute: --base --200,
56 --focus-static: --accent-static, 60 --border: --base --300,
61 --border-strong: --base --400,
62
63 --text-disabled: --base --500,
64 --text-mute-more: --base --600,
65 --text-mute: --base --700,
66 --text: --base --800,
67 --heading: --base --900,
57 68
58 --border-mute: --base --200,
59 --border: --base --300,
60 --border-strong: --base --400,
61 --text-disabled: --base --500,
62 --text-mute-more: --base --600,
63 --text-mute: --base --700,
64 --text: --base --800,
65 --heading: --base --900,
66 --focus: ( 69 --focus: (
67 --outline: --focus-raw --400, 70 --outline: --focus-raw --400,
68 --border-mute: --focus-raw --900, 71 --border-mute: --focus-raw --900,
69 --border: --focus-raw --1000, 72 --border: --focus-raw --1000,
70 --border-text: --focus-raw --1000-text, 73 --border-text: --focus-raw --1000-text,
71 --border-strong: --focus-raw --1100, 74 --border-strong: --focus-raw --1100,
72 --text: --focus-raw --1100, 75 --text: --focus-raw --1100,
73 ), 76 ),
74); 77);
75 78
76$theme-light: ( 79$theme-light: (
77 --levels: ( 80 --levels: (
78 --grays: ( 81 --grays: (
79 --50: ( 82 --50: (-8) (.2 + .8 * easing.ease(math.div(0, 12))),
80 -8, 83 --75: (-4) (.2 + .8 * easing.ease(math.div(1, 12))),
81 ) 84 --100: (0) (.2 + .8 * easing.ease(math.div(2, 12))),
82 (
83 0.2 + 0.8 * easing.ease(math.div(0, 12)),
84 ),
85 --75: (
86 -4,
87 )
88 (
89 0.2 + 0.8 * easing.ease(math.div(1, 12)),
90 ),
91 --100: (0)
92 (
93 0.2 + 0.8 * easing.ease(math.div(2, 12)),
94 ),
95 85
96 --200: ( 86 --200: (easing.cubic-bezier(.2, .1, .9, .9, math.div(1, 7)) * 98) (.2 + .8 * easing.ease(math.div(3, 12))),
97 easing.cubic-bezier(0.2, 0.1, 0.9, 0.9, math.div(1, 7)) * 98, 87 --300: (easing.cubic-bezier(.2, .1, .9, .9, math.div(2, 7)) * 98) (.2 + .8 * easing.ease(math.div(4, 12))),
98 ) 88 --400: (easing.cubic-bezier(.2, .1, .9, .9, math.div(3, 7)) * 98) (.2 + .8 * easing.ease(math.div(5, 12))),
99 (
100 0.2 + 0.8 * easing.ease(math.div(3, 12)),
101 ),
102 --300: (
103 easing.cubic-bezier(0.2, 0.1, 0.9, 0.9, math.div(2, 7)) * 98,
104 )
105 (
106 0.2 + 0.8 * easing.ease(math.div(4, 12)),
107 ),
108 --400: (
109 easing.cubic-bezier(0.2, 0.1, 0.9, 0.9, math.div(3, 7)) * 98,
110 )
111 (
112 0.2 + 0.8 * easing.ease(math.div(5, 12)),
113 ),
114 89
115 --500: ( 90 --500: (easing.cubic-bezier(.2, .1, .9, .9, math.div(4, 7)) * 98) (.2 + .8 * easing.ease(math.div(6, 12))),
116 easing.cubic-bezier(0.2, 0.1, 0.9, 0.9, math.div(4, 7)) * 98, 91 --600: (easing.cubic-bezier(.2, .1, .9, .9, math.div(5, 7)) * 98) (.2 + .8 * easing.ease(math.div(7, 12))),
117 ) 92 --700: (easing.cubic-bezier(.2, .1, .9, .9, math.div(6, 7)) * 98) (.2 + .8 * easing.ease(math.div(8, 12))),
118 ( 93 --800: (easing.cubic-bezier(.2, .1, .9, .9, math.div(7, 7)) * 98) (.2 + .8 * easing.ease(math.div(9, 12))),
119 0.2 + 0.8 * easing.ease(math.div(6, 12)), 94 --900: (106) (.2 + .8 * easing.ease(math.div(10, 12))),
120 ),
121 --600: (
122 easing.cubic-bezier(0.2, 0.1, 0.9, 0.9, math.div(5, 7)) * 98,
123 )
124 (
125 0.2 + 0.8 * easing.ease(math.div(7, 12)),
126 ),
127 --700: (
128 easing.cubic-bezier(0.2, 0.1, 0.9, 0.9, math.div(6, 7)) * 98,
129 )
130 (
131 0.2 + 0.8 * easing.ease(math.div(8, 12)),
132 ),
133 --800: (
134 easing.cubic-bezier(0.2, 0.1, 0.9, 0.9, math.div(7, 7)) * 98,
135 )
136 (
137 0.2 + 0.8 * easing.ease(math.div(9, 12)),
138 ),
139 --900: (106)
140 (
141 0.2 + 0.8 * easing.ease(math.div(10, 12)),
142 ),
143 ), 95 ),
144 96
145 --colors: ( 97 --colors: (
146 --100: ( 98 --100: (math.div(0, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(0, 12))),
147 math.div(0, 12) * 94 + 7, 99 --200: (math.div(1, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(1, 12))),
148 ) 100 --300: (math.div(2, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(2, 12))),
149 ( 101 --400: (math.div(3, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(3, 12))),
150 0.2 + 0.8 * easing.ease(math.div(0, 12)), 102 --500: (math.div(4, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(4, 12))),
151 ), 103 --600: (math.div(5, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(5, 12))),
152 --200: ( 104 --700: (math.div(6, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(6, 12))),
153 math.div(1, 12) * 94 + 7, 105 --800: (math.div(7, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(7, 12))),
154 ) 106 --900: (math.div(8, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(8, 12))),
155 ( 107 --1000: (math.div(9, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(9, 12))),
156 0.2 + 0.8 * easing.ease(math.div(1, 12)), 108 --1100: (math.div(10, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(10, 12))),
157 ), 109 --1200: (math.div(11, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(11, 12))),
158 --300: ( 110 --1300: (math.div(12, 12) * 94 + 7) (.2 + .8 * easing.ease(math.div(12, 12))),
159 math.div(2, 12) * 94 + 7,
160 )
161 (
162 0.2 + 0.8 * easing.ease(math.div(2, 12)),
163 ),
164 --400: (
165 math.div(3, 12) * 94 + 7,
166 )
167 (
168 0.2 + 0.8 * easing.ease(math.div(3, 12)),
169 ),
170 --500: (
171 math.div(4, 12) * 94 + 7,
172 )
173 (
174 0.2 + 0.8 * easing.ease(math.div(4, 12)),
175 ),
176 --600: (
177 math.div(5, 12) * 94 + 7,
178 )
179 (
180 0.2 + 0.8 * easing.ease(math.div(5, 12)),
181 ),
182 --700: (
183 math.div(6, 12) * 94 + 7,
184 )
185 (
186 0.2 + 0.8 * easing.ease(math.div(6, 12)),
187 ),
188 --800: (
189 math.div(7, 12) * 94 + 7,
190 )
191 (
192 0.2 + 0.8 * easing.ease(math.div(7, 12)),
193 ),
194 --900: (
195 math.div(8, 12) * 94 + 7,
196 )
197 (
198 0.2 + 0.8 * easing.ease(math.div(8, 12)),
199 ),
200 --1000: (
201 math.div(9, 12) * 94 + 7,
202 )
203 (
204 0.2 + 0.8 * easing.ease(math.div(9, 12)),
205 ),
206 --1100: (
207 math.div(10, 12) * 94 + 7,
208 )
209 (
210 0.2 + 0.8 * easing.ease(math.div(10, 12)),
211 ),
212 --1200: (
213 math.div(11, 12) * 94 + 7,
214 )
215 (
216 0.2 + 0.8 * easing.ease(math.div(11, 12)),
217 ),
218 --1300: (
219 math.div(12, 12) * 94 + 7,
220 )
221 (
222 0.2 + 0.8 * easing.ease(math.div(12, 12)),
223 ),
224 ), 111 ),
225 ), 112 ),
226 113
227 --palettes: ( 114 --palettes: (
228 --base: hsl(260, 70%, 98%) --grays, 115 --base: hsl(260, 70%, 98%) --grays,
229 --blue: oklch(56% 0.16 275.25) --colors, 116 --blue: oklch(56% .16 275.25) --colors,
230 --purple: oklch(56% 0.16 305.58) --colors, 117 --purple: oklch(56% .16 305.58) --colors,
231 --red: oklch(56% 0.16 14.69) --colors, 118 --red: oklch(56% .16 14.69) --colors,
232 --green: oklch(56% 0.16 150.48) --colors, 119 --green: oklch(56% .16 150.48) --colors,
233 --yellow: oklch(56% 0.16 84.08) --colors, 120 --yellow: oklch(56% .16 84.08) --colors,
234 ), 121 ),
235 122
236 --semantic: map.merge( 123 --semantic: map.merge($semantic-colors-common, (
237 $semantic-colors-common, 124 --bg-l2: --base --50,
238 ( 125 --bg-l1: --base --100,
239 --bg-l2: --base --50, 126 --bg-base: --base --200,
240 --bg-l1: --base --100, 127
241 --bg-base: --base --200, 128 --box: (
242 --box: ( 129 --border: --base --200,
243 --border: --base --200, 130 --border-strong: --base --300,
244 --border-strong: --base --300,
245 ),
246 )
247 ), 131 ),
132 )),
133
248 --constants: ( 134 --constants: (
249 --shadow: rgba(#000, 0.1), 135 --shadow: rgba(#000, .1),
250 ), 136 ),
251); 137);
252 138
253$theme-dark: ( 139$theme-dark: (
254 --levels: ( 140 --levels: (
255 --grays: ( 141 --grays: (
256 --50: (4.4) 142 --50: (4.4) (.3 + .7 * easing.ease(math.div(10, 12))),
257 ( 143 --75: (2.5) (.3 + .7 * easing.ease(math.div(9, 12))),
258 0.3 + 0.7 * easing.ease(math.div(10, 12)), 144 --100: (0) (.3 + .7 * easing.ease(math.div(8, 12))),
259 ),
260 --75: (2.5)
261 (
262 0.3 + 0.7 * easing.ease(math.div(9, 12)),
263 ),
264 --100: (0)
265 (
266 0.3 + 0.7 * easing.ease(math.div(8, 12)),
267 ),
268 145
269 --200: ( 146 --200: (easing.cubic-bezier(.3, .1, .8, .8, math.div(1, 8)) * -108) (.3 + .7 * easing.ease(math.div(7, 12))),
270 easing.cubic-bezier(0.3, 0.1, 0.8, 0.8, math.div(1, 8)) * -108, 147 --300: (easing.cubic-bezier(.3, .1, .8, .8, math.div(2, 8)) * -108) (.3 + .7 * easing.ease(math.div(6, 12))),
271 ) 148 --400: (easing.cubic-bezier(.3, .1, .8, .8, math.div(3, 8)) * -108) (.3 + .7 * easing.ease(math.div(5, 12))),
272 (
273 0.3 + 0.7 * easing.ease(math.div(7, 12)),
274 ),
275 --300: (
276 easing.cubic-bezier(0.3, 0.1, 0.8, 0.8, math.div(2, 8)) * -108,
277 )
278 (
279 0.3 + 0.7 * easing.ease(math.div(6, 12)),
280 ),
281 --400: (
282 easing.cubic-bezier(0.3, 0.1, 0.8, 0.8, math.div(3, 8)) * -108,
283 )
284 (
285 0.3 + 0.7 * easing.ease(math.div(5, 12)),
286 ),
287 149
288 --500: ( 150 --500: (easing.cubic-bezier(.3, .1, .8, .8, math.div(4, 8)) * -108) (.3 + .7 * easing.ease(math.div(4, 12))),
289 easing.cubic-bezier(0.3, 0.1, 0.8, 0.8, math.div(4, 8)) * -108, 151 --600: (easing.cubic-bezier(.3, .1, .8, .8, math.div(5, 8)) * -108) (.3 + .7 * easing.ease(math.div(3, 12))),
290 ) 152 --700: (easing.cubic-bezier(.3, .1, .8, .8, math.div(6, 8)) * -108) (.3 + .7 * easing.ease(math.div(2, 12))),
291 ( 153 --800: (easing.cubic-bezier(.3, .1, .8, .8, math.div(7, 8)) * -108) (.3 + .7 * easing.ease(math.div(1, 12))),
292 0.3 + 0.7 * easing.ease(math.div(4, 12)), 154 --900: (easing.cubic-bezier(.3, .1, .8, .8, math.div(8, 8)) * -108) (.3 + .7 * easing.ease(math.div(0, 12))),
293 ),
294 --600: (
295 easing.cubic-bezier(0.3, 0.1, 0.8, 0.8, math.div(5, 8)) * -108,
296 )
297 (
298 0.3 + 0.7 * easing.ease(math.div(3, 12)),
299 ),
300 --700: (
301 easing.cubic-bezier(0.3, 0.1, 0.8, 0.8, math.div(6, 8)) * -108,
302 )
303 (
304 0.3 + 0.7 * easing.ease(math.div(2, 12)),
305 ),
306 --800: (
307 easing.cubic-bezier(0.3, 0.1, 0.8, 0.8, math.div(7, 8)) * -108,
308 )
309 (
310 0.3 + 0.7 * easing.ease(math.div(1, 12)),
311 ),
312 --900: (
313 easing.cubic-bezier(0.3, 0.1, 0.8, 0.8, math.div(8, 8)) * -108,
314 )
315 (
316 0.3 + 0.7 * easing.ease(math.div(0, 12)),
317 ),
318 ), 155 ),
319 156
320 --colors: ( 157 --colors: (
321 --100: ( 158 --100: (easing.cubic-bezier(.2, .1, .8, .8, math.div(0, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(0, 12))),
322 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(0, 12)) * -109 - 0.5, 159 --200: (easing.cubic-bezier(.2, .1, .8, .8, math.div(1, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(1, 12))),
323 ) 160 --300: (easing.cubic-bezier(.2, .1, .8, .8, math.div(2, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(2, 12))),
324 ( 161 --400: (easing.cubic-bezier(.2, .1, .8, .8, math.div(3, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(3, 12))),
325 0.3 + 0.7 * easing.ease(math.div(0, 12)), 162 --500: (easing.cubic-bezier(.2, .1, .8, .8, math.div(4, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(4, 12))),
326 ), 163 --600: (easing.cubic-bezier(.2, .1, .8, .8, math.div(5, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(5, 12))),
327 --200: ( 164 --700: (easing.cubic-bezier(.2, .1, .8, .8, math.div(6, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(6, 12))),
328 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(1, 12)) * -109 - 0.5, 165 --800: (easing.cubic-bezier(.2, .1, .8, .8, math.div(7, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(7, 12))),
329 ) 166 --900: (easing.cubic-bezier(.2, .1, .8, .8, math.div(8, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(8, 12))),
330 ( 167 --1000: (easing.cubic-bezier(.2, .1, .8, .8, math.div(9, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(9, 12))),
331 0.3 + 0.7 * easing.ease(math.div(1, 12)), 168 --1100: (easing.cubic-bezier(.2, .1, .8, .8, math.div(10, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(10, 12))),
332 ), 169 --1200: (easing.cubic-bezier(.2, .1, .8, .8, math.div(11, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(11, 12))),
333 --300: ( 170 --1300: (easing.cubic-bezier(.2, .1, .8, .8, math.div(12, 12)) * -109 - .5) (.3 + .7 * easing.ease(math.div(12, 12))),
334 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(2, 12)) * -109 - 0.5,
335 )
336 (
337 0.3 + 0.7 * easing.ease(math.div(2, 12)),
338 ),
339 --400: (
340 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(3, 12)) * -109 - 0.5,
341 )
342 (
343 0.3 + 0.7 * easing.ease(math.div(3, 12)),
344 ),
345 --500: (
346 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(4, 12)) * -109 - 0.5,
347 )
348 (
349 0.3 + 0.7 * easing.ease(math.div(4, 12)),
350 ),
351 --600: (
352 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(5, 12)) * -109 - 0.5,
353 )
354 (
355 0.3 + 0.7 * easing.ease(math.div(5, 12)),
356 ),
357 --700: (
358 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(6, 12)) * -109 - 0.5,
359 )
360 (
361 0.3 + 0.7 * easing.ease(math.div(6, 12)),
362 ),
363 --800: (
364 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(7, 12)) * -109 - 0.5,
365 )
366 (
367 0.3 + 0.7 * easing.ease(math.div(7, 12)),
368 ),
369 --900: (
370 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(8, 12)) * -109 - 0.5,
371 )
372 (
373 0.3 + 0.7 * easing.ease(math.div(8, 12)),
374 ),
375 --1000: (
376 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(9, 12)) * -109 - 0.5,
377 )
378 (
379 0.3 + 0.7 * easing.ease(math.div(9, 12)),
380 ),
381 --1100: (
382 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(10, 12)) * -109 - 0.5,
383 )
384 (
385 0.3 + 0.7 * easing.ease(math.div(10, 12)),
386 ),
387 --1200: (
388 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(11, 12)) * -109 - 0.5,
389 )
390 (
391 0.3 + 0.7 * easing.ease(math.div(11, 12)),
392 ),
393 --1300: (
394 easing.cubic-bezier(0.2, 0.1, 0.8, 0.8, math.div(12, 12)) * -109 - 0.5,
395 )
396 (
397 0.3 + 0.7 * easing.ease(math.div(12, 12)),
398 ),
399 ), 171 ),
400 ), 172 ),
401 173
402 --palettes: ( 174 --palettes: (
403 --base: hsl(257, 7%, 20%) --grays, 175 --base: hsl(257, 7%, 20%) --grays,
404 --blue: oklch(56% 0.16 275.25) --colors, 176 --blue: oklch(56% .16 275.25) --colors,
405 --purple: oklch(56% 0.16 305.58) --colors, 177 --purple: oklch(56% .16 305.58) --colors,
406 --red: oklch(56% 0.16 14.69) --colors, 178 --red: oklch(56% .16 14.69) --colors,
407 --green: oklch(56% 0.16 150.48) --colors, 179 --green: oklch(56% .16 150.48) --colors,
408 --yellow: oklch(56% 0.16 84.08) --colors, 180 --yellow: oklch(56% .16 84.08) --colors,
409 ), 181 ),
410 182
411 --semantic: map.merge( 183 --semantic: map.merge($semantic-colors-common, (
412 $semantic-colors-common, 184 --bg-base: --base --50,
413 ( 185 --bg-l1: --base --75,
414 --bg-base: --base --50, 186 --bg-l2: --base --100,
415 --bg-l1: --base --75, 187
416 --bg-l2: --base --100, 188 --box: (
417 --box: ( 189 --border: --base --100,
418 --border: --base --100, 190 --border-strong: --base --100,
419 --border-strong: --base --100,
420 ),
421 )
422 ), 191 ),
192 )),
193
423 --constants: ( 194 --constants: (
424 --shadow: rgba(#000, 0.35), 195 --shadow: rgba(#000, .35),
425 ), 196 ),
426); 197);