get-elementa-ui 1.10.2 → 1.10.5

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "get-elementa-ui",
3
- "version": "1.10.2",
3
+ "version": "1.10.5",
4
4
  "description": "Elementa UI components library.",
5
5
  "homepage": "https://deriva.xyz/branding",
6
6
  "main": "dist/index.js",
@@ -56,12 +56,6 @@
56
56
  font-display: swap;
57
57
  }
58
58
 
59
- @import "tailwindcss";
60
- @import "tw-animate-css";
61
- @import "shadcn/tailwind.css";
62
-
63
- @custom-variant dark (&:where(.dark, .dark *));
64
-
65
59
  /* GLOBAL PALETTE */
66
60
  @theme inline {
67
61
  /* TODO: Again these are used by tailwind. Remove them gradually once our library is using the same variables and is stable. */
@@ -105,6 +99,7 @@
105
99
 
106
100
  /* SECTION: Variables */
107
101
  /* SECTION: Colors */
102
+ /* SECTION: Accent Colors */
108
103
  /* SECTION: Electric Violet */
109
104
  --color-electric-violet-100: oklch(0.963 0.0193 302.21);
110
105
  --color-electric-violet-200: oklch(0.8907 0.0562 301.22);
@@ -134,60 +129,108 @@
134
129
  /* !SECTION: Hot Pink */
135
130
 
136
131
  /* SECTION: Acid Lime */
137
- --color-acid-lime-100: #FBFEED;
138
- --color-acid-lime-200: #F2FBCA;
139
- --color-acid-lime-300: #EAF8A6;
140
- --color-acid-lime-400: #E2F582;
141
- --color-acid-lime-500: #D9F25F;
142
- --color-acid-lime-600: #D5F14D;
143
- --color-acid-lime-700: #C0D945;
144
- --color-acid-lime-800: #95A936;
145
- --color-acid-lime-900: #6B7927;
146
- --color-acid-lime-1000: #404817;
147
- --color-acid-lime-1100: #151808;
132
+ --color-acid-lime-100: oklch(0.9902 0.0225 114.93);
133
+ --color-acid-lime-200: oklch(0.9691 0.0642 116.06);
134
+ --color-acid-lime-300: oklch(0.9499 0.1049 116.33);
135
+ --color-acid-lime-400: oklch(0.9322 0.1418 116.96);
136
+ --color-acid-lime-500: oklch(0.9152 0.172 118.11);
137
+ --color-acid-lime-600: oklch(0.9086 0.185 118.66);
138
+ --color-acid-lime-700: oklch(0.8399 0.1704 118.55);
139
+ --color-acid-lime-800: oklch(0.6971 0.1399 118.7);
140
+ --color-acid-lime-900: oklch(0.5474 0.1072 118.39);
141
+ --color-acid-lime-1000: oklch(0.3829 0.0713 117.74);
142
+ --color-acid-lime-1100: oklch(0.2008 0.0295 117.79);
148
143
  /* !SECTION: Acid Lime */
149
144
 
150
145
  /* SECTION: Aqua Mint */
151
- --color-aqua-mint-100: #F1FDF9;
152
- --color-aqua-mint-200: #D5FAEE;
153
- --color-aqua-mint-300: #B9F6E2;
154
- --color-aqua-mint-400: #9CF2D6;
155
- --color-aqua-mint-500: #80EFCB;
156
- --color-aqua-mint-600: #72EDC5;
157
- --color-aqua-mint-700: #67D5B1;
158
- --color-aqua-mint-800: #50A68A;
159
- --color-aqua-mint-900: #397763;
160
- --color-aqua-mint-1000: #22473B;
161
- --color-aqua-mint-1100: #0B1814;
146
+ --color-aqua-mint-100: oklch(0.984 0.0136 174.18);
147
+ --color-aqua-mint-200: oklch(0.9555 0.0414 173.81);
148
+ --color-aqua-mint-300: oklch(0.9264 0.0673 172.59);
149
+ --color-aqua-mint-400: oklch(0.8986 0.0924 171.55);
150
+ --color-aqua-mint-500: oklch(0.8761 0.1153 170.28);
151
+ --color-aqua-mint-600: oklch(0.8644 0.1254 169.48);
152
+ --color-aqua-mint-700: oklch(0.7981 0.1149 169.43);
153
+ --color-aqua-mint-800: oklch(0.6636 0.0942 169.64);
154
+ --color-aqua-mint-900: oklch(0.5218 0.0724 170);
155
+ --color-aqua-mint-1000: oklch(0.3663 0.0479 170.32);
156
+ --color-aqua-mint-1100: oklch(0.1953 0.0202 172.63);
162
157
  /* !SECTION: Aqua Mint */
163
-
164
- /* SECTION: Gun Metal (Neutrals) */
165
- --color-gun-metal-100: #D3D7D9;
166
- --color-gun-metal-200: #B5BDC0;
167
- --color-gun-metal-300: #919CA1;
168
- --color-gun-metal-400: #6C7A82;
169
- --color-gun-metal-500: #475962;
170
- --color-gun-metal-600: #223843;
171
- --color-gun-metal-700: #1C2F38;
172
- --color-gun-metal-800: #17252D;
173
- --color-gun-metal-900: #111C22;
174
- --color-gun-metal-1000: #0B1316;
175
- --color-gun-metal-1100: #070B0D;
176
- /* !SECTION: Gun Metal (Neutrals) */
177
-
178
- /* SECTION: Amber White (Neutrals) */
179
- --color-amber-white-100: #FCFCFD;
180
- --color-amber-white-200: #FAFAFB;
181
- --color-amber-white-300: #F7F8F9;
182
- --color-amber-white-400: #F4F6F7;
183
- --color-amber-white-500: #F2F3F5;
184
- --color-amber-white-600: #EFF1F3;
185
- --color-amber-white-700: #C7C9CB;
186
- --color-amber-white-800: #9FA1A2;
187
- --color-amber-white-900: #78797A;
188
- --color-amber-white-1000: #505051;
189
- --color-amber-white-1100: #303031;
190
- /* !SECTION: Amber White (Neutrals) */
158
+ /* !SECTION: Accent Colors */
159
+
160
+ /* SECTION: Surface Colors */
161
+ /* SECTION: Gun Metal */
162
+ --color-gun-metal-100: oklch(0.8766 0.0052 228.83);
163
+ --color-gun-metal-200: oklch(0.793 0.0099 222.08);
164
+ --color-gun-metal-300: oklch(0.6855 0.0146 226.66);
165
+ --color-gun-metal-400: oklch(0.5707 0.0207 232.78);
166
+ --color-gun-metal-500: oklch(0.4523 0.0266 229.7);
167
+ --color-gun-metal-600: oklch(0.3273 0.034 230.85);
168
+ --color-gun-metal-700: oklch(0.293 0.0296 229.4);
169
+ --color-gun-metal-800: oklch(0.2555 0.0244 234.06);
170
+ --color-gun-metal-900: oklch(0.2189 0.0197 232.69);
171
+ --color-gun-metal-1000: oklch(0.1801 0.0136 223.07);
172
+ --color-gun-metal-1100: oklch(0.1458 0.0083 227.73);
173
+ /* !SECTION: Gun Metal */
174
+
175
+ /* SECTION: Amber White */
176
+ --color-amber-white-100: oklch(0.9913 0.0013 286.38);
177
+ --color-amber-white-200: oklch(0.9854 0.0013 286.38);
178
+ --color-amber-white-300: oklch(0.9787 0.0017 247.84);
179
+ --color-amber-white-400: oklch(0.9719 0.0025 228.78);
180
+ --color-amber-white-500: oklch(0.964 0.0029 264.54);
181
+ --color-amber-white-600: oklch(0.9572 0.0034 247.86);
182
+ --color-amber-white-700: oklch(0.8349 0.0036 247.87);
183
+ --color-amber-white-800: oklch(0.7077 0.0027 228.8);
184
+ --color-amber-white-900: oklch(0.5756 0.002 247.86);
185
+ --color-amber-white-1000: oklch(0.4316 0.0016 286.33);
186
+ --color-amber-white-1100: oklch(0.3096 0.0018 286.3);
187
+ /* !SECTION: Amber White */
188
+ /* !SECTION: Surface Colors */
189
+
190
+ /* SECTION: Feedback Colors */
191
+ /* SECTION: Basil */
192
+ --color-basil-amber-light: oklch(0.6454 0.1347 142.31)#59A253;
193
+ --color-basil-amber: oklch(0.4914 0.1336 143.21);
194
+ --color-basil-amber-dark: oklch(0.3415 0.1162 142.5);
195
+ --color-basil-gun-metal-light: oklch(0.7736 0.1039 144.1);
196
+ --color-basil-gun-metal: oklch(0.6187 0.1035 144.2);
197
+ --color-basil-gun-metal-dark: oklch(0.4647 0.1035 144.68);
198
+ /* !SECTION: Basil */
199
+
200
+ /* SECTION: Tomato */
201
+ --color-tomato-amber-light: oklch(0.6656 0.2019 22.56);
202
+ --color-tomato-amber: oklch(0.5106 0.1997 21.42);
203
+ --color-tomato-amber-dark: oklch(0.3898 0.159163 27.6392);
204
+ --color-tomato-gun-metal-light: oklch(0.6976 0.1933 29.11);
205
+ --color-tomato-gun-metal: oklch(0.6373 0.2481 27.08);
206
+ --color-tomato-gun-metal-dark: oklch(0.5132 0.2106 29.23);
207
+ /* !SECTION: Tomato */
208
+
209
+ /* SECTION: Corn */
210
+ --color-corn-amber-light: oklch(0.8559 0.1406 80.59);
211
+ --color-corn-amber: oklch(0.7042 0.1341 80.03);
212
+ --color-corn-amber-dark: oklch(0.5492 0.1147 77.38);
213
+
214
+ --color-corn-gun-metal-light: oklch(0.8798 0.1242 83.19);
215
+ --color-corn-gun-metal: oklch(0.779 0.1505 62.52);
216
+ --color-corn-gun-metal-dark: oklch(0.6232 0.1407 61.65);
217
+ /* !SECTION: Corn */
218
+
219
+ /* SECTION: Blueberry */
220
+ --color-blueberry-amber-light: oklch(0.6413 0.1555 262.33);
221
+ --color-blueberry-amber: oklch(0.4867 0.1602 255.4);
222
+ --color-blueberry-amber-dark: oklch(0.3562 0.1452 259.99);
223
+ --color-blueberry-gun-metal-light: oklch(0.7874 0.1107 252.43);
224
+ --color-blueberry-gun-metal: oklch(0.6327 0.1152 250.45);
225
+ --color-blueberry-gun-metal-dark: oklch(0.4774 0.1207 246);
226
+ /* !SECTION: Blueberry */
227
+
228
+ /* SECTION: Koala */
229
+ --color-disabled-amber: oklch(0.6731 0 0);
230
+ --color-disabled-gun-metal: oklch(0.325 0 0);
231
+ --color-text-on-disabled: oklch(0.5208 0 0);
232
+ /* !SECTION: Koala */
233
+ /* !SECTION: Feedback Colors */
191
234
  /* !SECTION: Colors */
192
235
 
193
236
  /* SECTION: Fonts */
@@ -341,27 +384,21 @@ For charts, graphs, and status badges. These are vital for dashboards (Deriva's
341
384
  .dark[data-energy="bubblegum-ice"] {
342
385
  --primary: var(--color-hot-pink-600);
343
386
  --primary-foreground: #ffffff;
344
-
345
387
  --secondary: var(--color-gun-metal-900);
346
388
  --secondary-foreground: var(--color-aqua-mint-400);
347
389
  }
348
390
  /* !SECTION: ENERGY 5: BUBBLEGUM ICE (Hot Pink + Aqua Mint) */
349
391
  }
350
392
 
351
- @layer base {
352
- * {
353
- @apply border-border outline-ring/50;
354
- }
355
- body {
356
- @apply bg-background text-foreground;
357
- }
358
- }
359
-
360
393
  @layer utilities {
361
394
  .bg-primary {
362
395
  background-color: var(--primary);
363
396
  }
364
397
 
398
+ .bg-secondary {
399
+ background-color: var(--secondary);
400
+ }
401
+
365
402
  .no-scrollbar {
366
403
  scrollbar-width: none;
367
404
  -ms-overflow-style: none;