@syscore/ui-library 1.1.1 → 1.1.3

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 (2) hide show
  1. package/client/global.css +170 -0
  2. package/package.json +4 -3
package/client/global.css ADDED
@@ -0,0 +1,170 @@
1
+ /** @import must precede all other statements */
2
+ @import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap");
3
+ @import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap");
4
+
5
+ @tailwind base;
6
+ @tailwind components;
7
+ @tailwind utilities;
8
+
9
+ @layer base {
10
+ /**
11
+ * Tailwind CSS theme
12
+ * tailwind.config.ts expects the following color variables to be expressed as HSL values.
13
+ * A different format will require also updating the theme in tailwind.config.ts.
14
+ */
15
+ :root {
16
+ --background: 0 0% 100%;
17
+ --foreground: 230 15% 12%;
18
+
19
+ --card: 0 0% 100%;
20
+ --card-foreground: 230 15% 12%;
21
+
22
+ --popover: 0 0% 100%;
23
+ --popover-foreground: 230 15% 12%;
24
+
25
+ --primary: 255 85% 55%;
26
+ --primary-foreground: 210 40% 98%;
27
+
28
+ --secondary: 252 100% 97%;
29
+ --secondary-foreground: 255 35% 20%;
30
+
31
+ --muted: 240 33% 98%;
32
+ --muted-foreground: 230 12% 40%;
33
+
34
+ --accent: 255 85% 55%;
35
+ --accent-foreground: 210 40% 98%;
36
+
37
+ --destructive: 0 72% 51%;
38
+ --destructive-foreground: 210 40% 98%;
39
+
40
+ --border: 240 13% 92%;
41
+ --input: 240 13% 92%;
42
+ --ring: 255 85% 55%;
43
+
44
+ --radius: 0.625rem;
45
+
46
+ /* Figma Design System Colors */
47
+ /* Cyan colors */
48
+ --cyan-800: 188 93% 31%;
49
+ --cyan-700: 191 80% 36%;
50
+ --cyan-600: 191 75% 42%;
51
+ --cyan-500: 194 80% 50%;
52
+ --cyan-400: 194 90% 65%;
53
+ --cyan-300: 194 88% 58%;
54
+ --cyan-200: 194 95% 80%;
55
+ --cyan-100: 194 100% 95%;
56
+ --cyan-50: 194 100% 98%;
57
+
58
+ /* Cyan gradient colors (for primary-gradient button) */
59
+ --cyan-gradient-from: 191 85% 68%;
60
+ --cyan-gradient-via: 174 75% 73%;
61
+ --cyan-gradient-to: 166 65% 82%;
62
+ --cyan-dark: 188 80% 26%;
63
+
64
+ /* Blue colors */
65
+ --blue-600: 208 60% 43%;
66
+ --blue-500: 208 70% 50%;
67
+ --blue-400: 208 75% 58%;
68
+ --blue-300: 208 80% 68%;
69
+ --blue-200: 209 56% 84%;
70
+ --blue-100: 209 70% 92%;
71
+ --blue-50: 210 100% 98%;
72
+
73
+ /* Gray colors */
74
+ --gray-900: 225 15% 15%;
75
+ --gray-800: 225 12% 20%;
76
+ --gray-700: 225 10% 25%;
77
+ --gray-600: 225 6% 33%;
78
+ --gray-500: 222 6% 46%;
79
+ --gray-400: 225 8% 55%;
80
+ --gray-300: 225 12% 70%;
81
+ --gray-200: 225 18% 88%;
82
+ --gray-100: 210 20% 94%;
83
+ --gray-50: 210 25% 97%;
84
+
85
+ /* Slate colors */
86
+ --slate-900: 222 47% 11%;
87
+ --slate-800: 213 27% 17%;
88
+ --slate-700: 215 25% 27%;
89
+ --slate-600: 215 20% 35%;
90
+ --slate-500: 215 16% 47%;
91
+ --slate-400: 215 14% 59%;
92
+ --slate-300: 215 12% 71%;
93
+ --slate-200: 214 13% 84%;
94
+ --slate-100: 210 40% 96%;
95
+ --slate-50: 210 40% 98%;
96
+
97
+ /* Violet colors */
98
+ --violet-700: 258 90% 66%;
99
+ --violet-600: 258 85% 70%;
100
+ --violet-500: 258 80% 75%;
101
+ --violet-200: 258 80% 90%;
102
+ --violet-100: 258 95% 95%;
103
+
104
+ /* Utility colors */
105
+ --white: 0 0% 100%;
106
+ --black: 0 0% 0%;
107
+ --coolGrey-400: 225 7% 35%;
108
+
109
+ --sidebar-background: 0 0% 98%;
110
+ --sidebar-foreground: 240 5.3% 26.1%;
111
+ --sidebar-primary: 240 5.9% 10%;
112
+ --sidebar-primary-foreground: 0 0% 98%;
113
+ --sidebar-accent: 240 4.8% 95.9%;
114
+ --sidebar-accent-foreground: 240 5.9% 10%;
115
+ --sidebar-border: 220 13% 91%;
116
+ --sidebar-ring: 217.2 91.2% 59.8%;
117
+ }
118
+
119
+ .dark {
120
+ --background: 230 15% 9%;
121
+ --foreground: 210 40% 98%;
122
+
123
+ --card: 230 15% 9%;
124
+ --card-foreground: 210 40% 98%;
125
+
126
+ --popover: 230 15% 9%;
127
+ --popover-foreground: 210 40% 98%;
128
+
129
+ --primary: 255 85% 66%;
130
+ --primary-foreground: 232 25% 12%;
131
+
132
+ --secondary: 240 16% 16%;
133
+ --secondary-foreground: 210 40% 98%;
134
+
135
+ --muted: 240 16% 16%;
136
+ --muted-foreground: 215 20.2% 65.1%;
137
+
138
+ --accent: 255 85% 66%;
139
+ --accent-foreground: 232 25% 12%;
140
+
141
+ --destructive: 0 62.8% 30.6%;
142
+ --destructive-foreground: 210 40% 98%;
143
+
144
+ --border: 240 14% 18%;
145
+ --input: 240 14% 18%;
146
+ --ring: 255 85% 66%;
147
+ --sidebar-background: 240 5.9% 10%;
148
+ --sidebar-foreground: 240 4.8% 95.9%;
149
+ --sidebar-primary: 224.3 76.3% 48%;
150
+ --sidebar-primary-foreground: 0 0% 100%;
151
+ --sidebar-accent: 240 3.7% 15.9%;
152
+ --sidebar-accent-foreground: 240 4.8% 95.9%;
153
+ --sidebar-border: 240 3.7% 15.9%;
154
+ --sidebar-ring: 217.2 91.2% 59.8%;
155
+ }
156
+ }
157
+
158
+ @layer base {
159
+ * {
160
+ @apply border-border;
161
+ }
162
+
163
+ body {
164
+ @apply bg-background text-foreground antialiased;
165
+ font-feature-settings:
166
+ "ss01" on,
167
+ "ss03" on,
168
+ "cv01" on;
169
+ }
170
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@syscore/ui-library",
3
- "version": "1.1.1",
3
+ "version": "1.1.3",
4
4
  "description": "A comprehensive React component library built with Radix UI, Tailwind CSS, and TypeScript",
5
5
  "private": false,
6
6
  "type": "module",
@@ -26,7 +26,8 @@
26
26
  "dist",
27
27
  "client/components/ui",
28
28
  "client/lib",
29
- "tailwind.preset.ts"
29
+ "tailwind.preset.ts",
30
+ "client/global.css"
30
31
  ],
31
32
  "exports": {
32
33
  ".": {
@@ -34,7 +35,7 @@
34
35
  "import": "./dist/ui/index.es.js",
35
36
  "require": "./dist/ui/index.cjs.js"
36
37
  },
37
- "./global.css": "./dist/ui/global.css",
38
+ "./global.css": "./client/global.css",
38
39
  "./tailwind.preset": "./tailwind.preset.ts"
39
40
  },
40
41
  "peerDependencies": {