@photoroom/ui 0.1.189 → 0.1.190

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.
Files changed (5) hide show
  1. package/colors.css +27 -27
  2. package/index.css +1 -1
  3. package/index.mjs +34 -34
  4. package/package.json +1 -1
  5. package/theme.css +5 -5
package/colors.css CHANGED
@@ -65,15 +65,15 @@
65
65
  --color-sand-50: #f5f4f0;
66
66
 
67
67
  /* Accent */
68
- --color-accent-300: #6161f2;
69
- --color-accent-400: #4d3de3;
70
- --color-accent-500: #410cd9;
71
- --color-accent-600: #280197;
72
- --color-accent-alpha-1: rgba(88, 38, 222, 6%);
73
- --color-accent-alpha-2: rgba(64, 10, 219, 11%);
74
- --color-accent-alpha-3: rgba(67, 14, 220, 17%);
75
- --color-accent-alpha-4: rgba(62, 7, 218, 27%);
76
- --color-accent-alpha-5: rgba(55, 1, 215, 35%);
68
+ --color-accent-300: #6369ff;
69
+ --color-accent-400: #544fff;
70
+ --color-accent-500: #492ffb;
71
+ --color-accent-600: #410de9;
72
+ --color-accent-alpha-100: rgba(73, 47, 251, 6%);
73
+ --color-accent-alpha-200: rgba(73, 47, 251, 12%);
74
+ --color-accent-alpha-300: rgba(73, 47, 251, 18%);
75
+ --color-accent-alpha-400: rgba(73, 47, 251, 35%);
76
+ --color-accent-alpha-500: rgba(73, 47, 251, 44%);
77
77
 
78
78
  /* Positive */
79
79
  --color-positive-400: #3dba83;
@@ -92,9 +92,9 @@
92
92
  --color-negative-alpha-3: rgba(255, 74, 74, 26%);
93
93
 
94
94
  /* Magic accent */
95
- --color-magic-accent-400: #ee65f5;
96
- --color-magic-accent-500: #da45e5;
97
- --color-magic-accent-600: #ad31b7;
95
+ --color-magic-accent-400: #7d63ff;
96
+ --color-magic-accent-500: #7146ff;
97
+ --color-magic-accent-600: #6532ed;
98
98
 
99
99
  /* Animation accent */
100
100
  --color-animation-accent-500: #cfc5ff;
@@ -141,9 +141,9 @@
141
141
  --color-background-accent: var(--color-accent-500);
142
142
  --color-background-accent-hover: var(--color-accent-400);
143
143
  --color-background-accent-down: var(--color-accent-600);
144
- --color-background-accent-subdued: var(--color-accent-alpha-1);
145
- --color-background-accent-subdued-hover: var(--color-accent-alpha-2);
146
- --color-background-accent-subdued-down: var(--color-accent-alpha-3);
144
+ --color-background-accent-subdued: var(--color-accent-alpha-100);
145
+ --color-background-accent-subdued-hover: var(--color-accent-alpha-200);
146
+ --color-background-accent-subdued-down: var(--color-accent-alpha-300);
147
147
  --color-background-positive: var(--color-positive-500);
148
148
  --color-background-positive-hover: var(--color-positive-400);
149
149
  --color-background-positive-down: var(--color-positive-600);
@@ -204,8 +204,8 @@
204
204
  --color-misc-border-default: var(--color-neutral-alpha-300);
205
205
  --color-misc-stack-layer-1: var(--color-neutral-400);
206
206
  --color-misc-stack-layer-2: var(--color-neutral-200);
207
- --color-misc-focus-indicator: var(--color-accent-alpha-5);
208
- --color-misc-focus-indicator-subdued: var(--color-accent-alpha-2);
207
+ --color-misc-focus-indicator: var(--color-accent-alpha-500);
208
+ --color-misc-focus-indicator-subdued: var(--color-accent-alpha-200);
209
209
  --color-misc-white-focus-indicator: var(--color-white);
210
210
  --color-misc-hairline: var(--color-neutral-alpha-300);
211
211
 
@@ -270,11 +270,11 @@
270
270
  --color-accent-400: #5052cb;
271
271
  --color-accent-500: #696eff;
272
272
  --color-accent-600: #7f89ff;
273
- --color-accent-alpha-1: rgba(76, 77, 247, 23%);
274
- --color-accent-alpha-2: rgba(89, 93, 251, 35%);
275
- --color-accent-alpha-3: rgba(95, 100, 255, 45%);
276
- --color-accent-alpha-4: rgba(108, 113, 255, 76%);
277
- --color-accent-alpha-5: rgba(113, 118, 255, 92%);
273
+ --color-accent-alpha-100: rgba(76, 77, 247, 23%);
274
+ --color-accent-alpha-200: rgba(89, 93, 251, 35%);
275
+ --color-accent-alpha-300: rgba(95, 100, 255, 45%);
276
+ --color-accent-alpha-400: rgba(108, 113, 255, 76%);
277
+ --color-accent-alpha-500: rgba(113, 118, 255, 92%);
278
278
 
279
279
  /* Positive */
280
280
  --color-positive-400: #01a86f;
@@ -326,9 +326,9 @@
326
326
  --color-background-accent: var(--color-accent-500);
327
327
  --color-background-accent-hover: var(--color-accent-600);
328
328
  --color-background-accent-down: var(--color-accent-400);
329
- --color-background-accent-subdued: var(--color-accent-alpha-1);
330
- --color-background-accent-subdued-hover: var(--color-accent-alpha-2);
331
- --color-background-accent-subdued-down: var(--color-accent-alpha-3);
329
+ --color-background-accent-subdued: var(--color-accent-alpha-100);
330
+ --color-background-accent-subdued-hover: var(--color-accent-alpha-200);
331
+ --color-background-accent-subdued-down: var(--color-accent-alpha-300);
332
332
  --color-background-positive: var(--color-positive-500);
333
333
  --color-background-positive-hover: var(--color-positive-600);
334
334
  --color-background-positive-down: var(--color-positive-400);
@@ -387,8 +387,8 @@
387
387
  --color-misc-border-default: var(--color-neutral-alpha-300);
388
388
  --color-misc-stack-layer-1: var(--color-neutral-400);
389
389
  --color-misc-stack-layer-2: var(--color-neutral-200);
390
- --color-misc-focus-indicator: var(--color-accent-alpha-5);
391
- --color-misc-focus-indicator-subdued: var(--color-accent-alpha-2);
390
+ --color-misc-focus-indicator: var(--color-accent-alpha-500);
391
+ --color-misc-focus-indicator-subdued: var(--color-accent-alpha-200);
392
392
  --color-misc-white-focus-indicator: var(--color-white);
393
393
  --color-misc-hairline: var(--color-neutral-alpha-300);
394
394