@motion-proto/live-tokens 0.47.0 → 0.47.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +22 -0
- package/dist-plugin/index.cjs +52 -2
- package/dist-plugin/index.js +52 -2
- package/package.json +1 -1
- package/src/editor/core/palettes/paletteDerivation.ts +45 -3
- package/src/editor/ui/BezierCurveEditor.svelte +2 -2
- package/src/editor/ui/ColorEditPanel.svelte +1 -1
- package/src/editor/ui/PaletteEditor.svelte +26 -12
- package/src/editor/ui/UIPillButton.svelte +7 -2
- package/src/editor/ui/colors/ColorWheel.svelte +34 -1
- package/src/editor/ui/curveEngine.ts +48 -0
- package/src/editor/ui/palette/PaletteBase.svelte +75 -51
- package/src/editor/ui/palette/PaletteJumpButton.svelte +3 -8
- package/src/live-tokens/data/themes/default.json +571 -461
- package/src/live-tokens/data/tokens.generated.css +118 -118
|
@@ -70,15 +70,15 @@
|
|
|
70
70
|
--shadow-xl: 6px 7px 13px 0px hsla(237, 18%, 3%, 0.9);
|
|
71
71
|
--shadow-2xl: 8px 9px 16px 0px hsla(237, 18%, 3%, 0.9);
|
|
72
72
|
--color-brand-100: #ffbad3;
|
|
73
|
-
--color-brand-200: #
|
|
74
|
-
--color-brand-300: #
|
|
75
|
-
--color-brand-400: #
|
|
73
|
+
--color-brand-200: #ff98c1;
|
|
74
|
+
--color-brand-300: #ff7db4;
|
|
75
|
+
--color-brand-400: #ff5da7;
|
|
76
76
|
--color-brand-500: #fb2898;
|
|
77
|
-
--color-brand-600: #
|
|
78
|
-
--color-brand-700: #
|
|
79
|
-
--color-brand-800: #
|
|
80
|
-
--color-brand-850: #
|
|
81
|
-
--color-brand-900: #
|
|
77
|
+
--color-brand-600: #db0081;
|
|
78
|
+
--color-brand-700: #af0066;
|
|
79
|
+
--color-brand-800: #800049;
|
|
80
|
+
--color-brand-850: #54002e;
|
|
81
|
+
--color-brand-900: #2d0016;
|
|
82
82
|
--color-brand-950: #100005;
|
|
83
83
|
--surface-brand-lowest: #1d000c;
|
|
84
84
|
--surface-brand-lower: #3e0020;
|
|
@@ -93,20 +93,20 @@
|
|
|
93
93
|
--border-brand-medium: #e9008a;
|
|
94
94
|
--border-brand-strong: #ff6cad;
|
|
95
95
|
--text-brand: #ff75b1;
|
|
96
|
-
--text-brand-secondary: #
|
|
97
|
-
--text-brand-tertiary: #
|
|
98
|
-
--text-brand-muted: #
|
|
96
|
+
--text-brand-secondary: #f61693;
|
|
97
|
+
--text-brand-tertiary: #b73373;
|
|
98
|
+
--text-brand-muted: #7b3854;
|
|
99
99
|
--text-brand-disabled: #403337;
|
|
100
100
|
--color-accent-100: #98e1dd;
|
|
101
|
-
--color-accent-200: #
|
|
102
|
-
--color-accent-300: #
|
|
103
|
-
--color-accent-400: #
|
|
104
|
-
--color-accent-500: #
|
|
105
|
-
--color-accent-600: #
|
|
106
|
-
--color-accent-700: #
|
|
107
|
-
--color-accent-800: #
|
|
108
|
-
--color-accent-850: #
|
|
109
|
-
--color-accent-900: #
|
|
101
|
+
--color-accent-200: #73c3c0;
|
|
102
|
+
--color-accent-300: #43a29e;
|
|
103
|
+
--color-accent-400: #008582;
|
|
104
|
+
--color-accent-500: #006d6a;
|
|
105
|
+
--color-accent-600: #005856;
|
|
106
|
+
--color-accent-700: #004645;
|
|
107
|
+
--color-accent-800: #003634;
|
|
108
|
+
--color-accent-850: #002625;
|
|
109
|
+
--color-accent-900: #001615;
|
|
110
110
|
--color-accent-950: #000606;
|
|
111
111
|
--surface-accent-lowest: #000f0e;
|
|
112
112
|
--surface-accent-lower: #002423;
|
|
@@ -121,20 +121,20 @@
|
|
|
121
121
|
--border-accent-medium: #259592;
|
|
122
122
|
--border-accent-strong: #53bbb7;
|
|
123
123
|
--text-accent: #62efea;
|
|
124
|
-
--text-accent-secondary: #
|
|
125
|
-
--text-accent-tertiary: #
|
|
126
|
-
--text-accent-muted: #
|
|
124
|
+
--text-accent-secondary: #5bbcb8;
|
|
125
|
+
--text-accent-tertiary: #508b88;
|
|
126
|
+
--text-accent-muted: #425d5c;
|
|
127
127
|
--text-accent-disabled: #313232;
|
|
128
128
|
--color-special-100: #d2c8ff;
|
|
129
|
-
--color-special-200: #
|
|
130
|
-
--color-special-300: #
|
|
131
|
-
--color-special-400: #
|
|
132
|
-
--color-special-500: #
|
|
133
|
-
--color-special-600: #
|
|
134
|
-
--color-special-700: #
|
|
135
|
-
--color-special-800: #
|
|
136
|
-
--color-special-850: #
|
|
137
|
-
--color-special-900: #
|
|
129
|
+
--color-special-200: #b9a7ff;
|
|
130
|
+
--color-special-300: #a181ff;
|
|
131
|
+
--color-special-400: #8b5cf6;
|
|
132
|
+
--color-special-500: #773ee0;
|
|
133
|
+
--color-special-600: #641ccb;
|
|
134
|
+
--color-special-700: #5100aa;
|
|
135
|
+
--color-special-800: #3d0083;
|
|
136
|
+
--color-special-850: #29005e;
|
|
137
|
+
--color-special-900: #17003a;
|
|
138
138
|
--color-special-950: #060019;
|
|
139
139
|
--surface-special-lowest: #0f002b;
|
|
140
140
|
--surface-special-lower: #250055;
|
|
@@ -149,20 +149,20 @@
|
|
|
149
149
|
--border-special-medium: #8c5df8;
|
|
150
150
|
--border-special-strong: #ac93ff;
|
|
151
151
|
--text-special: #baa9ff;
|
|
152
|
-
--text-special-secondary: #
|
|
153
|
-
--text-special-tertiary: #
|
|
154
|
-
--text-special-muted: #
|
|
152
|
+
--text-special-secondary: #9a75ff;
|
|
153
|
+
--text-special-tertiary: #745dba;
|
|
154
|
+
--text-special-muted: #504773;
|
|
155
155
|
--text-special-disabled: #303032;
|
|
156
156
|
--color-canvas-100: #cecfe5;
|
|
157
|
-
--color-canvas-200: #
|
|
158
|
-
--color-canvas-300: #
|
|
159
|
-
--color-canvas-400: #
|
|
160
|
-
--color-canvas-500: #
|
|
161
|
-
--color-canvas-600: #
|
|
162
|
-
--color-canvas-700: #
|
|
163
|
-
--color-canvas-800: #
|
|
164
|
-
--color-canvas-850: #
|
|
165
|
-
--color-canvas-900: #
|
|
157
|
+
--color-canvas-200: #b8b9cf;
|
|
158
|
+
--color-canvas-300: #a5a6bd;
|
|
159
|
+
--color-canvas-400: #9596ac;
|
|
160
|
+
--color-canvas-500: #85869d;
|
|
161
|
+
--color-canvas-600: #76768d;
|
|
162
|
+
--color-canvas-700: #65657c;
|
|
163
|
+
--color-canvas-800: #525269;
|
|
164
|
+
--color-canvas-850: #3c3c53;
|
|
165
|
+
--color-canvas-900: #1c1b32;
|
|
166
166
|
--color-canvas-950: #040215;
|
|
167
167
|
--surface-canvas-lowest: #0a0523;
|
|
168
168
|
--surface-canvas-lower: #1c1a37;
|
|
@@ -177,22 +177,22 @@
|
|
|
177
177
|
--border-canvas-medium: #80809b;
|
|
178
178
|
--border-canvas-strong: #a4a5c0;
|
|
179
179
|
--text-canvas: #9595c6;
|
|
180
|
-
--text-canvas-secondary: #
|
|
181
|
-
--text-canvas-tertiary: #
|
|
182
|
-
--text-canvas-muted: #
|
|
180
|
+
--text-canvas-secondary: #7b7c9f;
|
|
181
|
+
--text-canvas-tertiary: #62637a;
|
|
182
|
+
--text-canvas-muted: #4b4b56;
|
|
183
183
|
--text-canvas-disabled: #343435;
|
|
184
184
|
--page-bg: #3c3c53;
|
|
185
185
|
--page-bg-attachment: scroll;
|
|
186
186
|
--color-neutral-100: #dde6ed;
|
|
187
|
-
--color-neutral-200: #
|
|
188
|
-
--color-neutral-300: #
|
|
189
|
-
--color-neutral-400: #
|
|
187
|
+
--color-neutral-200: #c0c9d0;
|
|
188
|
+
--color-neutral-300: #a5adb4;
|
|
189
|
+
--color-neutral-400: #8a9299;
|
|
190
190
|
--color-neutral-500: #70787e;
|
|
191
|
-
--color-neutral-600: #
|
|
192
|
-
--color-neutral-700: #
|
|
193
|
-
--color-neutral-800: #
|
|
194
|
-
--color-neutral-850: #
|
|
195
|
-
--color-neutral-900: #
|
|
191
|
+
--color-neutral-600: #575e64;
|
|
192
|
+
--color-neutral-700: #3f464b;
|
|
193
|
+
--color-neutral-800: #282f34;
|
|
194
|
+
--color-neutral-850: #13191e;
|
|
195
|
+
--color-neutral-900: #03060a;
|
|
196
196
|
--color-neutral-950: #000000;
|
|
197
197
|
--surface-neutral-lowest: #040c13;
|
|
198
198
|
--surface-neutral-lower: #162027;
|
|
@@ -207,21 +207,21 @@
|
|
|
207
207
|
--border-neutral-medium: #7c848b;
|
|
208
208
|
--border-neutral-strong: #a0a9af;
|
|
209
209
|
--text-primary: #ffffff;
|
|
210
|
-
--text-secondary: #
|
|
211
|
-
--text-tertiary: #
|
|
212
|
-
--text-muted: #
|
|
210
|
+
--text-secondary: #dfe7ee;
|
|
211
|
+
--text-tertiary: #a3a8ad;
|
|
212
|
+
--text-muted: #6b6e70;
|
|
213
213
|
--text-disabled: #383838;
|
|
214
214
|
--text-inverted: #0f0f0f;
|
|
215
215
|
--color-alternate-100: #eae3e0;
|
|
216
|
-
--color-alternate-200: #
|
|
217
|
-
--color-alternate-300: #
|
|
218
|
-
--color-alternate-400: #
|
|
216
|
+
--color-alternate-200: #cec8c4;
|
|
217
|
+
--color-alternate-300: #b4adaa;
|
|
218
|
+
--color-alternate-400: #9a9491;
|
|
219
219
|
--color-alternate-500: #817b78;
|
|
220
|
-
--color-alternate-600: #
|
|
221
|
-
--color-alternate-700: #
|
|
222
|
-
--color-alternate-800: #
|
|
223
|
-
--color-alternate-850: #
|
|
224
|
-
--color-alternate-900: #
|
|
220
|
+
--color-alternate-600: #696360;
|
|
221
|
+
--color-alternate-700: #514b49;
|
|
222
|
+
--color-alternate-800: #3a3532;
|
|
223
|
+
--color-alternate-850: #25201e;
|
|
224
|
+
--color-alternate-900: #110d0b;
|
|
225
225
|
--color-alternate-950: #030101;
|
|
226
226
|
--surface-alternate-lowest: #100907;
|
|
227
227
|
--surface-alternate-lower: #241d19;
|
|
@@ -236,20 +236,20 @@
|
|
|
236
236
|
--border-alternate-medium: #88827f;
|
|
237
237
|
--border-alternate-strong: #ada6a3;
|
|
238
238
|
--text-alternate: #ffffff;
|
|
239
|
-
--text-alternate-secondary: #
|
|
240
|
-
--text-alternate-tertiary: #
|
|
241
|
-
--text-alternate-muted: #
|
|
239
|
+
--text-alternate-secondary: #f5efec;
|
|
240
|
+
--text-alternate-tertiary: #b2aeac;
|
|
241
|
+
--text-alternate-muted: #747271;
|
|
242
242
|
--text-alternate-disabled: #3b3b3b;
|
|
243
243
|
--color-info-100: #9adbff;
|
|
244
|
-
--color-info-200: #
|
|
245
|
-
--color-info-300: #
|
|
246
|
-
--color-info-400: #
|
|
247
|
-
--color-info-500: #
|
|
248
|
-
--color-info-600: #
|
|
249
|
-
--color-info-700: #
|
|
250
|
-
--color-info-800: #
|
|
251
|
-
--color-info-850: #
|
|
252
|
-
--color-info-900: #
|
|
244
|
+
--color-info-200: #00bbff;
|
|
245
|
+
--color-info-300: #009ed8;
|
|
246
|
+
--color-info-400: #0084b6;
|
|
247
|
+
--color-info-500: #006e98;
|
|
248
|
+
--color-info-600: #005a7d;
|
|
249
|
+
--color-info-700: #004764;
|
|
250
|
+
--color-info-800: #00364d;
|
|
251
|
+
--color-info-850: #002536;
|
|
252
|
+
--color-info-900: #001420;
|
|
253
253
|
--color-info-950: #00050b;
|
|
254
254
|
--surface-info-lowest: #000d17;
|
|
255
255
|
--surface-info-lower: #002232;
|
|
@@ -264,20 +264,20 @@
|
|
|
264
264
|
--border-info-medium: #008ec3;
|
|
265
265
|
--border-info-strong: #00b6f8;
|
|
266
266
|
--text-info: #64caff;
|
|
267
|
-
--text-info-secondary: #
|
|
268
|
-
--text-info-tertiary: #
|
|
269
|
-
--text-info-muted: #
|
|
267
|
+
--text-info-secondary: #009cd6;
|
|
268
|
+
--text-info-tertiary: #126e96;
|
|
269
|
+
--text-info-muted: #1f4255;
|
|
270
270
|
--text-info-disabled: #181a1b;
|
|
271
271
|
--color-success-100: #92e9a3;
|
|
272
|
-
--color-success-200: #
|
|
273
|
-
--color-success-300: #
|
|
274
|
-
--color-success-400: #
|
|
275
|
-
--color-success-500: #
|
|
276
|
-
--color-success-600: #
|
|
277
|
-
--color-success-700: #
|
|
278
|
-
--color-success-800: #
|
|
279
|
-
--color-success-850: #
|
|
280
|
-
--color-success-900: #
|
|
272
|
+
--color-success-200: #6fcf85;
|
|
273
|
+
--color-success-300: #44b564;
|
|
274
|
+
--color-success-400: #009c45;
|
|
275
|
+
--color-success-500: #008238;
|
|
276
|
+
--color-success-600: #006a2d;
|
|
277
|
+
--color-success-700: #005422;
|
|
278
|
+
--color-success-800: #003f17;
|
|
279
|
+
--color-success-850: #002b0e;
|
|
280
|
+
--color-success-900: #001805;
|
|
281
281
|
--color-success-950: #000701;
|
|
282
282
|
--surface-success-lowest: #001003;
|
|
283
283
|
--surface-success-lower: #00270b;
|
|
@@ -292,20 +292,20 @@
|
|
|
292
292
|
--border-success-medium: #059e46;
|
|
293
293
|
--border-success-strong: #47c46b;
|
|
294
294
|
--text-success: #88f2a0;
|
|
295
|
-
--text-success-secondary: #
|
|
296
|
-
--text-success-tertiary: #
|
|
297
|
-
--text-success-muted: #
|
|
295
|
+
--text-success-secondary: #6fbf80;
|
|
296
|
+
--text-success-tertiary: #568d61;
|
|
297
|
+
--text-success-muted: #3e5f44;
|
|
298
298
|
--text-success-disabled: #263429;
|
|
299
|
-
--color-warning-100: #
|
|
300
|
-
--color-warning-200: #
|
|
301
|
-
--color-warning-300: #
|
|
302
|
-
--color-warning-400: #
|
|
303
|
-
--color-warning-500: #
|
|
304
|
-
--color-warning-600: #
|
|
305
|
-
--color-warning-700: #
|
|
306
|
-
--color-warning-800: #
|
|
307
|
-
--color-warning-850: #
|
|
308
|
-
--color-warning-900: #
|
|
299
|
+
--color-warning-100: #ffb01f;
|
|
300
|
+
--color-warning-200: #e39a00;
|
|
301
|
+
--color-warning-300: #c68600;
|
|
302
|
+
--color-warning-400: #ab7300;
|
|
303
|
+
--color-warning-500: #916100;
|
|
304
|
+
--color-warning-600: #784f00;
|
|
305
|
+
--color-warning-700: #5f3e00;
|
|
306
|
+
--color-warning-800: #482e00;
|
|
307
|
+
--color-warning-850: #321e00;
|
|
308
|
+
--color-warning-900: #1c0f00;
|
|
309
309
|
--color-warning-950: #090300;
|
|
310
310
|
--surface-warning-lowest: #130900;
|
|
311
311
|
--surface-warning-lower: #372200;
|
|
@@ -320,20 +320,20 @@
|
|
|
320
320
|
--border-warning-medium: #af7600;
|
|
321
321
|
--border-warning-strong: #df9700;
|
|
322
322
|
--text-warning: #ffecd2;
|
|
323
|
-
--text-warning-secondary: #
|
|
324
|
-
--text-warning-tertiary: #
|
|
325
|
-
--text-warning-muted: #
|
|
323
|
+
--text-warning-secondary: #ffb22c;
|
|
324
|
+
--text-warning-tertiary: #c28e3e;
|
|
325
|
+
--text-warning-muted: #866d4a;
|
|
326
326
|
--text-warning-disabled: #4d4b4a;
|
|
327
327
|
--color-danger-100: #ffbeb8;
|
|
328
|
-
--color-danger-200: #
|
|
329
|
-
--color-danger-300: #
|
|
330
|
-
--color-danger-400: #
|
|
331
|
-
--color-danger-500: #
|
|
332
|
-
--color-danger-600: #
|
|
333
|
-
--color-danger-700: #
|
|
334
|
-
--color-danger-800: #
|
|
335
|
-
--color-danger-850: #
|
|
336
|
-
--color-danger-900: #
|
|
328
|
+
--color-danger-200: #ff8b84;
|
|
329
|
+
--color-danger-300: #f0494a;
|
|
330
|
+
--color-danger-400: #d10023;
|
|
331
|
+
--color-danger-500: #ac001b;
|
|
332
|
+
--color-danger-600: #8d0014;
|
|
333
|
+
--color-danger-700: #72000e;
|
|
334
|
+
--color-danger-800: #5a0009;
|
|
335
|
+
--color-danger-850: #420005;
|
|
336
|
+
--color-danger-900: #2a0002;
|
|
337
337
|
--color-danger-950: #110000;
|
|
338
338
|
--surface-danger-lowest: #1f0001;
|
|
339
339
|
--surface-danger-lower: #410004;
|
|
@@ -348,9 +348,9 @@
|
|
|
348
348
|
--border-danger-medium: #ea3039;
|
|
349
349
|
--border-danger-strong: #ff7872;
|
|
350
350
|
--text-danger: #ff635f;
|
|
351
|
-
--text-danger-secondary: #
|
|
352
|
-
--text-danger-tertiary: #
|
|
353
|
-
--text-danger-muted: #
|
|
351
|
+
--text-danger-secondary: #f5042c;
|
|
352
|
+
--text-danger-tertiary: #b63536;
|
|
353
|
+
--text-danger-muted: #793d39;
|
|
354
354
|
--text-danger-disabled: #3c3939;
|
|
355
355
|
--font-display: "Arvo", serif;
|
|
356
356
|
--font-sans: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, sans-serif;
|