@abhir9/pd-design-system 0.1.6 → 0.1.7

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 (3) hide show
  1. package/dist/index.css +591 -588
  2. package/dist/styles.css +208 -208
  3. package/package.json +1 -1
package/dist/styles.css CHANGED
@@ -1,212 +1,4 @@
1
1
  /* src/styles.css */
2
- :root {
3
- --accent: #17171C;
4
- --accent-foreground: #DFDFE2;
5
- --background: #09090B;
6
- --background-base: #09090B;
7
- --background-green: #00471A;
8
- --background-green-on-hover: #006625;
9
- --background-info: #00123D;
10
- --background-info-on-hover: #001E66;
11
- --background-invert: #FFFFFF;
12
- --background-invert-light: #DFDFE2;
13
- --background-low: #17171C;
14
- --background-low-on-hover: #2F2F37;
15
- --background-orange: #331500;
16
- --background-orange-on-hover: #5C2500;
17
- --background-primary: #00123D;
18
- --background-primary-on-hover: #001E66;
19
- --background-red: #2D060D;
20
- --background-red-on-hover: #4C0B17;
21
- --background-secondary: #17171C;
22
- --background-tertiary: #2F2F37;
23
- --background-yellow: #3D2600;
24
- --background-yellow-on-hover: #5C3A00;
25
- --border: #4E4E5A;
26
- --border-blue: #709AFF;
27
- --border-blue-on-hover: #3772FF;
28
- --border-blue-subtle: #002680;
29
- --border-green: #00E052;
30
- --border-green-on-hover: #00B241;
31
- --border-green-subtle: #006625;
32
- --border-invert: #FFFFFF;
33
- --border-on-color: #09090B;
34
- --border-orange: #EC9C64;
35
- --border-orange-on-hover: #FF6800;
36
- --border-orange-subtle: #5C2500;
37
- --border-primary: #4E4E5A;
38
- --border-red: #E15C5C;
39
- --border-red-on-hover: #E12D4E;
40
- --border-red-subtle: #4C0B17;
41
- --border-secondary: #2F2F37;
42
- --border-subtle: #2F2F37;
43
- --border-yellow: #FFCA70;
44
- --border-yellow-on-hover: #FFAD22;
45
- --border-yellow-subtle: #5C3A00;
46
- --card: #17171C;
47
- --card-foreground: #DFDFE2;
48
- --color-black: #09090B;
49
- --color-white: #FFFFFF;
50
- --content-always-black: #09090B;
51
- --content-always-white: #FFFFFF;
52
- --content-blue: #709AFF;
53
- --content-blue-disabled: #002680;
54
- --content-blue-on-hover: #3772FF;
55
- --content-green: #00E052;
56
- --content-green-disabled: #008A32;
57
- --content-green-on-hover: #09FF63;
58
- --content-on-color: #09090B;
59
- --content-on-color-inverse: #EDEDED;
60
- --content-orange: #EC9C64;
61
- --content-orange-disabled: #7A3200;
62
- --content-orange-on-hover: #FFC9A3;
63
- --content-primary: #DFDFE2;
64
- --content-red: #E15C5C;
65
- --content-red-disabled: #7D1225;
66
- --content-red-on-hover: #F6C1CA;
67
- --content-secondary: #7E7E8B;
68
- --content-subtle: #4E4E5A;
69
- --content-yellow: #FFCA70;
70
- --content-yellow-disabled: #7A4D00;
71
- --content-yellow-on-hover: #FFD999;
72
- --destructive: #E15C5C;
73
- --destructive-foreground: #FFFFFF;
74
- --font-mono:
75
- Gist Mono,
76
- Menlo,
77
- Monaco,
78
- Consolas,
79
- Liberation Mono,
80
- Courier New,
81
- monospace;
82
- --font-sans:
83
- Gist,
84
- -apple-system,
85
- BlinkMacSystemFont,
86
- Segoe UI,
87
- Roboto,
88
- Oxygen,
89
- Ubuntu,
90
- Cantarell,
91
- sans-serif;
92
- --font-size-2xl: 1.5rem;
93
- --font-size-3xl: 1.875rem;
94
- --font-size-4xl: 2.25rem;
95
- --font-size-5xl: 3rem;
96
- --font-size-base: 1rem;
97
- --font-size-lg: 1.125rem;
98
- --font-size-sm: 0.875rem;
99
- --font-size-xl: 1.25rem;
100
- --font-size-xs: 0.75rem;
101
- --font-weight-bold: 700;
102
- --font-weight-medium: 500;
103
- --font-weight-normal: 400;
104
- --font-weight-semibold: 600;
105
- --foreground: #DFDFE2;
106
- --input: #4E4E5A;
107
- --intent-danger: #E15C5C;
108
- --intent-danger-active: #E12D4E;
109
- --intent-danger-bg: #2D060D;
110
- --intent-danger-bg-active: #4C0B17;
111
- --intent-danger-bg-hover: #4C0B17;
112
- --intent-danger-border: #E15C5C;
113
- --intent-danger-hover: #F6C1CA;
114
- --intent-danger-text: #E15C5C;
115
- --intent-neutral: #7E7E8B;
116
- --intent-neutral-active: #EDEDED;
117
- --intent-neutral-bg: #17171C;
118
- --intent-neutral-bg-active: #2F2F37;
119
- --intent-neutral-bg-hover: #2F2F37;
120
- --intent-neutral-border: #4E4E5A;
121
- --intent-neutral-hover: #DFDFE2;
122
- --intent-neutral-text: #DFDFE2;
123
- --intent-primary: #7E7E8B;
124
- --intent-primary-active: #EDEDED;
125
- --intent-primary-bg: #17171C;
126
- --intent-primary-bg-active: #2F2F37;
127
- --intent-primary-bg-hover: #2F2F37;
128
- --intent-primary-border: #4E4E5A;
129
- --intent-primary-hover: #DFDFE2;
130
- --intent-primary-text: #DFDFE2;
131
- --intent-success: #00E052;
132
- --intent-success-active: #00B241;
133
- --intent-success-bg: #00471A;
134
- --intent-success-bg-active: #008A32;
135
- --intent-success-bg-hover: #006625;
136
- --intent-success-border: #00E052;
137
- --intent-success-hover: #09FF63;
138
- --intent-success-text: #00E052;
139
- --intent-warning: #FFCA70;
140
- --intent-warning-active: #FFAD22;
141
- --intent-warning-bg: #3D2600;
142
- --intent-warning-bg-active: #5C3A00;
143
- --intent-warning-bg-hover: #5C3A00;
144
- --intent-warning-border: #FFCA70;
145
- --intent-warning-hover: #FFD999;
146
- --intent-warning-text: #FFCA70;
147
- --line-height-normal: 1.5;
148
- --line-height-relaxed: 1.75;
149
- --line-height-tight: 1.25;
150
- --muted: #17171C;
151
- --muted-foreground: #4E4E5A;
152
- --popover: #17171C;
153
- --popover-foreground: #DFDFE2;
154
- --primary: #7E7E8B;
155
- --primary-foreground: #FFFFFF;
156
- --radius: 0.375rem;
157
- --radius-2xl: 1rem;
158
- --radius-3xl: 1.5rem;
159
- --radius-base: 0.25rem;
160
- --radius-full: 9999px;
161
- --radius-lg: 0.5rem;
162
- --radius-md: 0.375rem;
163
- --radius-none: 0;
164
- --radius-sm: 0.125rem;
165
- --radius-xl: 0.75rem;
166
- --ring: #7E7E8B;
167
- --secondary: #17171C;
168
- --secondary-foreground: #DFDFE2;
169
- --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
170
- --shadow-base: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
171
- --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
172
- --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
173
- --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
174
- --shadow-none: none;
175
- --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
176
- --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
177
- --spacing-0: 0;
178
- --spacing-1: 0.25rem;
179
- --spacing-10: 2.5rem;
180
- --spacing-12: 3rem;
181
- --spacing-16: 4rem;
182
- --spacing-2: 0.5rem;
183
- --spacing-20: 5rem;
184
- --spacing-24: 6rem;
185
- --spacing-3: 0.75rem;
186
- --spacing-4: 1rem;
187
- --spacing-5: 1.25rem;
188
- --spacing-6: 1.5rem;
189
- --spacing-8: 2rem;
190
- --surface-base: #09090B;
191
- --surface-base-border: #4E4E5A;
192
- --surface-elevated: #17171C;
193
- --surface-elevated-border: #2F2F37;
194
- --surface-overlay: rgba(0, 0, 0, 0.7);
195
- --text-body: #DFDFE2;
196
- --text-disabled: #60606C;
197
- --text-heading: #DFDFE2;
198
- --text-muted: #4E4E5A;
199
- --z-dropdown: 1000;
200
- --z-fixed: 1030;
201
- --z-modal: 1050;
202
- --z-modal-backdrop: 1040;
203
- --z-popover: 1060;
204
- --z-sticky: 1020;
205
- --z-tooltip: 1070;
206
- font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
207
- color: var(--text-body);
208
- background-color: var(--surface-base);
209
- }
210
2
  *,
211
3
  ::before,
212
4
  ::after {
@@ -540,6 +332,214 @@ video {
540
332
  [hidden]:where(:not([hidden=until-found])) {
541
333
  display: none;
542
334
  }
335
+ :root {
336
+ --accent: #17171C;
337
+ --accent-foreground: #DFDFE2;
338
+ --background: #09090B;
339
+ --background-base: #09090B;
340
+ --background-green: #00471A;
341
+ --background-green-on-hover: #006625;
342
+ --background-info: #00123D;
343
+ --background-info-on-hover: #001E66;
344
+ --background-invert: #FFFFFF;
345
+ --background-invert-light: #DFDFE2;
346
+ --background-low: #17171C;
347
+ --background-low-on-hover: #2F2F37;
348
+ --background-orange: #331500;
349
+ --background-orange-on-hover: #5C2500;
350
+ --background-primary: #00123D;
351
+ --background-primary-on-hover: #001E66;
352
+ --background-red: #2D060D;
353
+ --background-red-on-hover: #4C0B17;
354
+ --background-secondary: #17171C;
355
+ --background-tertiary: #2F2F37;
356
+ --background-yellow: #3D2600;
357
+ --background-yellow-on-hover: #5C3A00;
358
+ --border: #4E4E5A;
359
+ --border-blue: #709AFF;
360
+ --border-blue-on-hover: #3772FF;
361
+ --border-blue-subtle: #002680;
362
+ --border-green: #00E052;
363
+ --border-green-on-hover: #00B241;
364
+ --border-green-subtle: #006625;
365
+ --border-invert: #FFFFFF;
366
+ --border-on-color: #09090B;
367
+ --border-orange: #EC9C64;
368
+ --border-orange-on-hover: #FF6800;
369
+ --border-orange-subtle: #5C2500;
370
+ --border-primary: #4E4E5A;
371
+ --border-red: #E15C5C;
372
+ --border-red-on-hover: #E12D4E;
373
+ --border-red-subtle: #4C0B17;
374
+ --border-secondary: #2F2F37;
375
+ --border-subtle: #2F2F37;
376
+ --border-yellow: #FFCA70;
377
+ --border-yellow-on-hover: #FFAD22;
378
+ --border-yellow-subtle: #5C3A00;
379
+ --card: #17171C;
380
+ --card-foreground: #DFDFE2;
381
+ --color-black: #09090B;
382
+ --color-white: #FFFFFF;
383
+ --content-always-black: #09090B;
384
+ --content-always-white: #FFFFFF;
385
+ --content-blue: #709AFF;
386
+ --content-blue-disabled: #002680;
387
+ --content-blue-on-hover: #3772FF;
388
+ --content-green: #00E052;
389
+ --content-green-disabled: #008A32;
390
+ --content-green-on-hover: #09FF63;
391
+ --content-on-color: #09090B;
392
+ --content-on-color-inverse: #EDEDED;
393
+ --content-orange: #EC9C64;
394
+ --content-orange-disabled: #7A3200;
395
+ --content-orange-on-hover: #FFC9A3;
396
+ --content-primary: #DFDFE2;
397
+ --content-red: #E15C5C;
398
+ --content-red-disabled: #7D1225;
399
+ --content-red-on-hover: #F6C1CA;
400
+ --content-secondary: #7E7E8B;
401
+ --content-subtle: #4E4E5A;
402
+ --content-yellow: #FFCA70;
403
+ --content-yellow-disabled: #7A4D00;
404
+ --content-yellow-on-hover: #FFD999;
405
+ --destructive: #E15C5C;
406
+ --destructive-foreground: #FFFFFF;
407
+ --font-mono:
408
+ Gist Mono,
409
+ Menlo,
410
+ Monaco,
411
+ Consolas,
412
+ Liberation Mono,
413
+ Courier New,
414
+ monospace;
415
+ --font-sans:
416
+ Gist,
417
+ -apple-system,
418
+ BlinkMacSystemFont,
419
+ Segoe UI,
420
+ Roboto,
421
+ Oxygen,
422
+ Ubuntu,
423
+ Cantarell,
424
+ sans-serif;
425
+ --font-size-2xl: 1.5rem;
426
+ --font-size-3xl: 1.875rem;
427
+ --font-size-4xl: 2.25rem;
428
+ --font-size-5xl: 3rem;
429
+ --font-size-base: 1rem;
430
+ --font-size-lg: 1.125rem;
431
+ --font-size-sm: 0.875rem;
432
+ --font-size-xl: 1.25rem;
433
+ --font-size-xs: 0.75rem;
434
+ --font-weight-bold: 700;
435
+ --font-weight-medium: 500;
436
+ --font-weight-normal: 400;
437
+ --font-weight-semibold: 600;
438
+ --foreground: #DFDFE2;
439
+ --input: #4E4E5A;
440
+ --intent-danger: #E15C5C;
441
+ --intent-danger-active: #E12D4E;
442
+ --intent-danger-bg: #2D060D;
443
+ --intent-danger-bg-active: #4C0B17;
444
+ --intent-danger-bg-hover: #4C0B17;
445
+ --intent-danger-border: #E15C5C;
446
+ --intent-danger-hover: #F6C1CA;
447
+ --intent-danger-text: #E15C5C;
448
+ --intent-neutral: #7E7E8B;
449
+ --intent-neutral-active: #EDEDED;
450
+ --intent-neutral-bg: #17171C;
451
+ --intent-neutral-bg-active: #2F2F37;
452
+ --intent-neutral-bg-hover: #2F2F37;
453
+ --intent-neutral-border: #4E4E5A;
454
+ --intent-neutral-hover: #DFDFE2;
455
+ --intent-neutral-text: #DFDFE2;
456
+ --intent-primary: #7E7E8B;
457
+ --intent-primary-active: #EDEDED;
458
+ --intent-primary-bg: #17171C;
459
+ --intent-primary-bg-active: #2F2F37;
460
+ --intent-primary-bg-hover: #2F2F37;
461
+ --intent-primary-border: #4E4E5A;
462
+ --intent-primary-hover: #DFDFE2;
463
+ --intent-primary-text: #DFDFE2;
464
+ --intent-success: #00E052;
465
+ --intent-success-active: #00B241;
466
+ --intent-success-bg: #00471A;
467
+ --intent-success-bg-active: #008A32;
468
+ --intent-success-bg-hover: #006625;
469
+ --intent-success-border: #00E052;
470
+ --intent-success-hover: #09FF63;
471
+ --intent-success-text: #00E052;
472
+ --intent-warning: #FFCA70;
473
+ --intent-warning-active: #FFAD22;
474
+ --intent-warning-bg: #3D2600;
475
+ --intent-warning-bg-active: #5C3A00;
476
+ --intent-warning-bg-hover: #5C3A00;
477
+ --intent-warning-border: #FFCA70;
478
+ --intent-warning-hover: #FFD999;
479
+ --intent-warning-text: #FFCA70;
480
+ --line-height-normal: 1.5;
481
+ --line-height-relaxed: 1.75;
482
+ --line-height-tight: 1.25;
483
+ --muted: #17171C;
484
+ --muted-foreground: #4E4E5A;
485
+ --popover: #17171C;
486
+ --popover-foreground: #DFDFE2;
487
+ --primary: #7E7E8B;
488
+ --primary-foreground: #FFFFFF;
489
+ --radius: 0.375rem;
490
+ --radius-2xl: 1rem;
491
+ --radius-3xl: 1.5rem;
492
+ --radius-base: 0.25rem;
493
+ --radius-full: 9999px;
494
+ --radius-lg: 0.5rem;
495
+ --radius-md: 0.375rem;
496
+ --radius-none: 0;
497
+ --radius-sm: 0.125rem;
498
+ --radius-xl: 0.75rem;
499
+ --ring: #7E7E8B;
500
+ --secondary: #17171C;
501
+ --secondary-foreground: #DFDFE2;
502
+ --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
503
+ --shadow-base: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
504
+ --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
505
+ --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
506
+ --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
507
+ --shadow-none: none;
508
+ --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
509
+ --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
510
+ --spacing-0: 0;
511
+ --spacing-1: 0.25rem;
512
+ --spacing-10: 2.5rem;
513
+ --spacing-12: 3rem;
514
+ --spacing-16: 4rem;
515
+ --spacing-2: 0.5rem;
516
+ --spacing-20: 5rem;
517
+ --spacing-24: 6rem;
518
+ --spacing-3: 0.75rem;
519
+ --spacing-4: 1rem;
520
+ --spacing-5: 1.25rem;
521
+ --spacing-6: 1.5rem;
522
+ --spacing-8: 2rem;
523
+ --surface-base: #09090B;
524
+ --surface-base-border: #4E4E5A;
525
+ --surface-elevated: #17171C;
526
+ --surface-elevated-border: #2F2F37;
527
+ --surface-overlay: rgba(0, 0, 0, 0.7);
528
+ --text-body: #DFDFE2;
529
+ --text-disabled: #60606C;
530
+ --text-heading: #DFDFE2;
531
+ --text-muted: #4E4E5A;
532
+ --z-dropdown: 1000;
533
+ --z-fixed: 1030;
534
+ --z-modal: 1050;
535
+ --z-modal-backdrop: 1040;
536
+ --z-popover: 1060;
537
+ --z-sticky: 1020;
538
+ --z-tooltip: 1070;
539
+ font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
540
+ color: var(--text-body);
541
+ background-color: var(--surface-base);
542
+ }
543
543
  * {
544
544
  box-sizing: border-box;
545
545
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@abhir9/pd-design-system",
3
- "version": "0.1.6",
3
+ "version": "0.1.7",
4
4
  "description": "Production-grade design system with adapter layer support",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",