@kjaniec-dev/design 0.3.0 → 0.3.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.
Files changed (3) hide show
  1. package/package.json +7 -9
  2. package/tailwind.css +0 -40
  3. package/theme.css +0 -85
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kjaniec-dev/design",
3
- "version": "0.3.0",
3
+ "version": "0.3.1",
4
4
  "description": "Design tokens and Tailwind v4 theme for the KJ Product Kit",
5
5
  "license": "MIT",
6
6
  "author": "kjaniec-dev",
@@ -14,19 +14,17 @@
14
14
  },
15
15
  "exports": {
16
16
  "./theme.css": {
17
- "style": "./theme.css",
18
- "default": "./theme.css"
17
+ "style": "./src/theme.css",
18
+ "default": "./src/theme.css"
19
19
  },
20
20
  "./tailwind.css": {
21
- "style": "./tailwind.css",
22
- "default": "./tailwind.css"
21
+ "style": "./src/tailwind.css",
22
+ "default": "./src/tailwind.css"
23
23
  },
24
24
  "./tokens.json": "./tokens.json"
25
25
  },
26
26
  "files": [
27
- "theme.css",
28
- "tailwind.css",
29
- "tokens.json",
30
- "src"
27
+ "src",
28
+ "tokens.json"
31
29
  ]
32
30
  }
package/tailwind.css DELETED
@@ -1,40 +0,0 @@
1
- @import "./theme.css";
2
-
3
- @theme {
4
- --color-background: var(--kj-background);
5
- --color-foreground: var(--kj-foreground);
6
- --color-surface: var(--kj-surface);
7
- --color-card: var(--kj-card);
8
- --color-card-foreground: var(--kj-card-foreground);
9
- --color-primary: var(--kj-primary);
10
- --color-primary-hover: var(--kj-primary-hover);
11
- --color-primary-foreground: var(--kj-primary-foreground);
12
- --color-secondary: var(--kj-secondary);
13
- --color-secondary-hover: var(--kj-secondary-hover);
14
- --color-secondary-foreground: var(--kj-secondary-foreground);
15
- --color-muted: var(--kj-muted);
16
- --color-muted-foreground: var(--kj-muted-foreground);
17
- --color-border: var(--kj-border);
18
- --color-input: var(--kj-input);
19
- --color-ring: var(--kj-ring);
20
- --color-success: var(--kj-success);
21
- --color-success-surface: var(--kj-success-surface);
22
- --color-warning: var(--kj-warning);
23
- --color-warning-surface: var(--kj-warning-surface);
24
- --color-danger: var(--kj-danger);
25
- --color-danger-surface: var(--kj-danger-surface);
26
- --color-info: var(--kj-info);
27
- --color-info-surface: var(--kj-info-surface);
28
- --font-sans: var(--kj-font-sans);
29
- --font-mono: var(--kj-font-mono);
30
- --radius-kj-sm: var(--kj-radius-sm);
31
- --radius-kj-md: var(--kj-radius-md);
32
- --radius-kj-lg: var(--kj-radius-lg);
33
- --radius-kj-xl: var(--kj-radius-xl);
34
- --radius-kj-2xl: var(--kj-radius-2xl);
35
- --shadow-kj-xs: var(--kj-shadow-xs);
36
- --shadow-kj-sm: var(--kj-shadow-sm);
37
- --shadow-kj-md: var(--kj-shadow-md);
38
- --shadow-kj-lg: var(--kj-shadow-lg);
39
- --shadow-kj-glow: var(--kj-shadow-glow);
40
- }
package/theme.css DELETED
@@ -1,85 +0,0 @@
1
- :root {
2
- color-scheme: light;
3
- --kj-background: #fafafa;
4
- --kj-foreground: #09090b;
5
- --kj-surface: #ffffff;
6
- --kj-card: #ffffff;
7
- --kj-card-foreground: #09090b;
8
- --kj-primary: #f59e0b;
9
- --kj-primary-hover: #d97706;
10
- --kj-primary-foreground: #09090b;
11
- --kj-secondary: #14b8a6;
12
- --kj-secondary-hover: #0d9488;
13
- --kj-secondary-foreground: #ffffff;
14
- --kj-muted: #f4f4f5;
15
- --kj-muted-foreground: #71717a;
16
- --kj-border: #e4e4e7;
17
- --kj-input: #e4e4e7;
18
- --kj-ring: #f59e0b;
19
- --kj-success: #059669;
20
- --kj-success-surface: #ecfdf5;
21
- --kj-warning: #d97706;
22
- --kj-warning-surface: #fffbeb;
23
- --kj-danger: #e11d48;
24
- --kj-danger-surface: #fff1f2;
25
- --kj-info: #0284c7;
26
- --kj-info-surface: #f0f9ff;
27
- --kj-font-sans:
28
- Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
29
- "Segoe UI", sans-serif;
30
- --kj-font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
31
- --kj-radius-sm: 0.5rem;
32
- --kj-radius-md: 0.75rem;
33
- --kj-radius-lg: 1rem;
34
- --kj-radius-xl: 1.25rem;
35
- --kj-radius-2xl: 1.5rem;
36
- --kj-shadow-xs: 0 1px 2px rgb(15 23 42 / 0.05);
37
- --kj-shadow-sm:
38
- 0 1px 3px rgb(15 23 42 / 0.08), 0 1px 2px rgb(15 23 42 / 0.04);
39
- --kj-shadow-md: 0 8px 30px rgb(15 23 42 / 0.08);
40
- --kj-shadow-lg: 0 20px 60px rgb(15 23 42 / 0.12);
41
- --kj-shadow-glow:
42
- 0 0 0 1px rgb(245 158 11 / 0.16), 0 16px 48px rgb(245 158 11 / 0.18);
43
- }
44
-
45
- .dark {
46
- color-scheme: dark;
47
- --kj-background: #09090b;
48
- --kj-foreground: #fafafa;
49
- --kj-surface: #18181b;
50
- --kj-card: #18181b;
51
- --kj-card-foreground: #fafafa;
52
- --kj-primary: #fbbf24;
53
- --kj-primary-hover: #f59e0b;
54
- --kj-primary-foreground: #09090b;
55
- --kj-secondary: #2dd4bf;
56
- --kj-secondary-hover: #14b8a6;
57
- --kj-secondary-foreground: #042f2e;
58
- --kj-muted: #27272a;
59
- --kj-muted-foreground: #a1a1aa;
60
- --kj-border: #27272a;
61
- --kj-input: #27272a;
62
- --kj-ring: #fbbf24;
63
- --kj-success: #10b981;
64
- --kj-success-surface: #022c22;
65
- --kj-warning: #fbbf24;
66
- --kj-warning-surface: #451a03;
67
- --kj-danger: #f43f5e;
68
- --kj-danger-surface: #4c0519;
69
- --kj-info: #0ea5e9;
70
- --kj-info-surface: #082f49;
71
- }
72
-
73
- html {
74
- background: var(--kj-background);
75
- color: var(--kj-foreground);
76
- font-family: var(--kj-font-sans);
77
- }
78
-
79
- .kj-card {
80
- background: var(--kj-card);
81
- color: var(--kj-card-foreground);
82
- border: 1px solid var(--kj-border);
83
- border-radius: var(--kj-radius-2xl);
84
- box-shadow: var(--kj-shadow-sm);
85
- }