@abhir9/pd-design-system 0.1.5 → 0.1.6

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 +588 -592
  2. package/dist/styles.css +208 -208
  3. package/package.json +1 -1
package/dist/styles.css CHANGED
@@ -1,4 +1,212 @@
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
+ }
2
210
  *,
3
211
  ::before,
4
212
  ::after {
@@ -332,214 +540,6 @@ video {
332
540
  [hidden]:where(:not([hidden=until-found])) {
333
541
  display: none;
334
542
  }
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.5",
3
+ "version": "0.1.6",
4
4
  "description": "Production-grade design system with adapter layer support",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",