@szum-tech/design-system 1.5.3 → 1.5.4
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 +5 -4
- package/tailwindcss/global.css +1 -114
- package/tailwindcss/palette.css +113 -0
package/package.json
CHANGED
|
@@ -92,7 +92,8 @@
|
|
|
92
92
|
"scripts": {
|
|
93
93
|
"build": "tsup",
|
|
94
94
|
"typecheck": "tsc --noEmit",
|
|
95
|
-
"clean": "rm -rf node_modules && rm -rf dist",
|
|
95
|
+
"clean": "rm -rf node_modules && rm -rf dist && yarn clear:build",
|
|
96
|
+
"clear:build": "rm -rf components && rm -rf contexts && rm -rf hooks && rm -rf index.d.ts && rm -rf index.js && rm -rf index.mjs",
|
|
96
97
|
"dev": "concurrently \"npm run dev:css\" \"npm run dev:build\"",
|
|
97
98
|
"dev:build": "tsup src/index.tsx --format esm,cjs --watch --dts --external react,react-dom",
|
|
98
99
|
"dev:css": "tailwindcss -w -i tailwindcss/global.css -o src/styles/default.css",
|
|
@@ -104,11 +105,11 @@
|
|
|
104
105
|
},
|
|
105
106
|
"sideEffects": false,
|
|
106
107
|
"types": "./index.d.ts",
|
|
107
|
-
"version": "1.5.
|
|
108
|
+
"version": "1.5.4",
|
|
108
109
|
"peerDependencies": {
|
|
109
110
|
"@tailwindcss/container-queries": "^0.1.0",
|
|
110
111
|
"react": "^18.2.0",
|
|
111
|
-
"tailwind-scrollbar": "^2.0
|
|
112
|
-
"tailwindcss": "^3.2.
|
|
112
|
+
"tailwind-scrollbar": "^2.1.0",
|
|
113
|
+
"tailwindcss": "^3.2.7"
|
|
113
114
|
}
|
|
114
115
|
}
|
package/tailwindcss/global.css
CHANGED
|
@@ -1,125 +1,12 @@
|
|
|
1
1
|
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600;700&display=swap");
|
|
2
2
|
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap");
|
|
3
|
+
@import "palette.css";
|
|
3
4
|
|
|
4
5
|
@tailwind base;
|
|
5
6
|
@tailwind components;
|
|
6
7
|
@tailwind utilities;
|
|
7
8
|
|
|
8
9
|
@layer base {
|
|
9
|
-
:root {
|
|
10
|
-
--white: 250 250 250; /* rgb(250 250 250) */
|
|
11
|
-
--black: 28 28 28; /* rgb(28, 28, 28) */
|
|
12
|
-
|
|
13
|
-
--text-color: 28 28 28; /* rgb(28 28 28) */
|
|
14
|
-
|
|
15
|
-
--primary-100: 153 206 255; /* rgb(153, 206, 255) 60% */
|
|
16
|
-
--primary-200: 115 187 255; /* rgb(115, 187, 255) 45% */
|
|
17
|
-
--primary-300: 77 169 255; /* rgb(77, 169, 255) 30% */
|
|
18
|
-
--primary-400: 38 150 255; /* rgb(38, 150, 255) 15% */
|
|
19
|
-
--primary-500: 0 132 255; /* rgb(0, 132, 255) */
|
|
20
|
-
--primary-600: 0 112 217; /* rgb(0, 112, 217) 15% */
|
|
21
|
-
--primary-700: 0 92 179; /* rgb(0, 92, 179) 30% */
|
|
22
|
-
--primary-800: 0 73 140; /* rgb(0, 73, 140) 45% */
|
|
23
|
-
--primary-900: 0 53 102; /* rgb(0, 53, 102) 60% */
|
|
24
|
-
|
|
25
|
-
--success-100: 125 255 162; /* rgb(125, 255, 162) */
|
|
26
|
-
--success-200: 77 255 127; /* rgb(77, 255, 127) */
|
|
27
|
-
--success-300: 28 255 92; /* rgb(28, 255, 92) */
|
|
28
|
-
--success-400: 0 235 66; /* rgb(0, 235, 66) */
|
|
29
|
-
--success-500: 0 186 52; /* rgb(0, 186, 52) */
|
|
30
|
-
--success-600: 0 158 44; /* rgb(0, 158, 44) */
|
|
31
|
-
--success-700: 0 130 36; /* rgb(0, 130, 36) */
|
|
32
|
-
--success-800: 0 102 29; /* rgb(0, 102, 29) */
|
|
33
|
-
--success-900: 0 74 21; /* rgb(0, 74, 21) */
|
|
34
|
-
|
|
35
|
-
--warning-100: 255 207 151; /* rgb(255, 207, 151) */
|
|
36
|
-
--warning-200: 255 189 111; /* rgb(255, 189, 111) */
|
|
37
|
-
--warning-300: 255 171 72; /* rgb(255, 171, 72) */
|
|
38
|
-
--warning-400: 255 153 33; /* rgb(255, 153, 33) */
|
|
39
|
-
--warning-500: 249 134 0; /* rgb(249, 134, 0) */
|
|
40
|
-
--warning-600: 212 114 0; /* rgb(212, 114, 0) */
|
|
41
|
-
--warning-700: 174 94 0; /* rgb(174, 94, 0) */
|
|
42
|
-
--warning-800: 137 74 0; /* rgb(137, 74, 0) */
|
|
43
|
-
--warning-900: 100 54 0; /* rgb(100, 54, 0) */
|
|
44
|
-
|
|
45
|
-
--error-100: 246 171 171; /* rgb(246, 171, 171) */
|
|
46
|
-
--error-200: 243 139 139; /* rgb(243, 139, 139) */
|
|
47
|
-
--error-300: 240 107 107; /* rgb(240, 107, 107) */
|
|
48
|
-
--error-400: 236 76 76; /* rgb(236, 76, 76) */
|
|
49
|
-
--error-500: 233 44 44; /* rgb(233, 44, 44) */
|
|
50
|
-
--error-600: 213 22 22; /* rgb(213, 22, 22) */
|
|
51
|
-
--error-700: 176 18 18; /* rgb(176, 18, 18) */
|
|
52
|
-
--error-800: 138 14 14; /* rgb(138, 14, 14) */
|
|
53
|
-
--error-900: 100 10 10; /* rgb(100, 10, 10) */
|
|
54
|
-
|
|
55
|
-
--gray-100: 75 75 75; /* rgb(75, 75, 75) 70% */
|
|
56
|
-
--gray-200: 100 100 100; /* rgb(100, 100, 100) 60% */
|
|
57
|
-
--gray-300: 125 125 125; /* rgb(125, 125, 125) 50% */
|
|
58
|
-
--gray-400: 150 150 150; /* rgb(150, 150, 150) 40% */
|
|
59
|
-
--gray-500: 175 175 175; /* rgb(175, 175, 175) 30% */
|
|
60
|
-
--gray-600: 200 200 200; /* rgb(200, 200, 200) 20% */
|
|
61
|
-
--gray-700: 212 212 212; /* rgb(212, 212, 212) 15% */
|
|
62
|
-
--gray-800: 225 225 225; /* rgb(225, 225, 225) 10% */
|
|
63
|
-
--gray-900: 237 237 237; /* rgb(237, 237, 237) 5% */
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
.dark {
|
|
67
|
-
--white: 250 250 250; /* rgb(250, 250, 250) */
|
|
68
|
-
--black: 28 28 28; /* rgb(28, 28, 28) */
|
|
69
|
-
|
|
70
|
-
--text-color: 242 242 242; /* rgb(242, 242, 242) */
|
|
71
|
-
|
|
72
|
-
--primary-100: 161 210 255; /* rgb(161, 210, 255) */
|
|
73
|
-
--primary-200: 126 193 255; /* rgb(126,193,255) */
|
|
74
|
-
--primary-300: 91 177 255; /* rgb(91,177,255) */
|
|
75
|
-
--primary-400: 56 160 255; /* rgb(56, 160, 255) */
|
|
76
|
-
--primary-500: 21 143 255; /* rgb(21, 143, 255) */
|
|
77
|
-
--primary-600: 0 122 235; /* rgb(0,122,235) */
|
|
78
|
-
--primary-700: 0 101 193; /* rgb(0, 101, 193) */
|
|
79
|
-
--primary-800: 0 79 152; /* rgb(0, 79, 152) */
|
|
80
|
-
--primary-900: 0 58 110; /* rgb(0, 58, 110) */
|
|
81
|
-
|
|
82
|
-
--success-100: 152 244 178; /* rgb(152, 244, 178) */
|
|
83
|
-
--success-200: 114 240 149; /* rgb(114, 240, 149) */
|
|
84
|
-
--success-300: 75 235 120; /* rgb(75, 235, 120) */
|
|
85
|
-
--success-400: 36 231 91; /* rgb(36, 231, 91) */
|
|
86
|
-
--success-500: 22 203 73; /* rgb(22, 203, 73) */
|
|
87
|
-
--success-600: 19 173 62; /* rgb(19, 173, 62) */
|
|
88
|
-
--success-700: 15 142 51; /* rgb(15, 142, 51) */
|
|
89
|
-
--success-800: 12 112 40; /* rgb(12, 112, 40) */
|
|
90
|
-
--success-900: 9 81 29; /* rgb(9, 81, 29) */
|
|
91
|
-
|
|
92
|
-
--warning-100: 255 217 171; /* rgb(255, 217, 171) */
|
|
93
|
-
--warning-200: 255 202 139; /* rgb(255, 202, 139) */
|
|
94
|
-
--warning-300: 255 188 108; /* rgb(255, 188, 108) */
|
|
95
|
-
--warning-400: 255 173 77; /* rgb(255, 173, 77) */
|
|
96
|
-
--warning-500: 255 159 45; /* rgb(255, 159, 45) */
|
|
97
|
-
--warning-600: 255 138 0; /* rgb(255, 138, 0) */
|
|
98
|
-
--warning-700: 210 114 0; /* rgb(210, 114, 0) */
|
|
99
|
-
--warning-800: 165 90 0; /* rgb(165, 90, 0) */
|
|
100
|
-
--warning-900: 120 65 0; /* rgb(120, 65, 0) */
|
|
101
|
-
|
|
102
|
-
--error-100: 252 179 179; /* rgb(252, 179, 179) */
|
|
103
|
-
--error-200: 251 150 150; /* rgb(251, 150, 150) */
|
|
104
|
-
--error-300: 249 122 121; /* rgb(249, 122, 121) */
|
|
105
|
-
--error-400: 248 93 93; /* rgb(248, 93, 93) */
|
|
106
|
-
--error-500: 247 65 64; /* rgb(247, 65, 64) */
|
|
107
|
-
--error-600: 245 20 19; /* rgb(245, 20, 19) */
|
|
108
|
-
--error-700: 209 10 9; /* rgb(209, 10, 9) */
|
|
109
|
-
--error-800: 164 8 7; /* rgb(164, 8, 7) */
|
|
110
|
-
--error-900: 119 6 5; /* rgb(119, 6, 5) */
|
|
111
|
-
|
|
112
|
-
--gray-100: 187 187 187; /* rgb(187, 187, 187) 70% */
|
|
113
|
-
--gray-200: 164 164 164; /* rgb(164, 164, 164) 60% */
|
|
114
|
-
--gray-300: 141 141 141; /* rgb(141, 141, 141) 50% */
|
|
115
|
-
--gray-400: 119 119 119; /* rgb(119, 119, 119) 40% */
|
|
116
|
-
--gray-500: 96 96 96; /* rgb(96, 96, 96) 30% */
|
|
117
|
-
--gray-600: 73 73 73; /* rgb(73, 73, 73) 20% */
|
|
118
|
-
--gray-700: 62 62 62; /* rgb(62, 62, 62) 15% */
|
|
119
|
-
--gray-800: 51 51 51; /* rgb(51, 51, 51) 10% */
|
|
120
|
-
--gray-900: 39 39 39; /* rgb(39, 39, 39) 5% */
|
|
121
|
-
}
|
|
122
|
-
|
|
123
10
|
body {
|
|
124
11
|
@apply scroll bg-gray-900 font-sans text-typography-primary antialiased;
|
|
125
12
|
}
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--white: 250 250 250; /* rgb(250 250 250) */
|
|
3
|
+
--black: 28 28 28; /* rgb(28, 28, 28) */
|
|
4
|
+
|
|
5
|
+
--text-color: 28 28 28; /* rgb(28 28 28) */
|
|
6
|
+
|
|
7
|
+
--primary-100: 153 206 255; /* rgb(153, 206, 255) 60% */
|
|
8
|
+
--primary-200: 115 187 255; /* rgb(115, 187, 255) 45% */
|
|
9
|
+
--primary-300: 77 169 255; /* rgb(77, 169, 255) 30% */
|
|
10
|
+
--primary-400: 38 150 255; /* rgb(38, 150, 255) 15% */
|
|
11
|
+
--primary-500: 0 132 255; /* rgb(0, 132, 255) */
|
|
12
|
+
--primary-600: 0 112 217; /* rgb(0, 112, 217) 15% */
|
|
13
|
+
--primary-700: 0 92 179; /* rgb(0, 92, 179) 30% */
|
|
14
|
+
--primary-800: 0 73 140; /* rgb(0, 73, 140) 45% */
|
|
15
|
+
--primary-900: 0 53 102; /* rgb(0, 53, 102) 60% */
|
|
16
|
+
|
|
17
|
+
--success-100: 125 255 162; /* rgb(125, 255, 162) */
|
|
18
|
+
--success-200: 77 255 127; /* rgb(77, 255, 127) */
|
|
19
|
+
--success-300: 28 255 92; /* rgb(28, 255, 92) */
|
|
20
|
+
--success-400: 0 235 66; /* rgb(0, 235, 66) */
|
|
21
|
+
--success-500: 0 186 52; /* rgb(0, 186, 52) */
|
|
22
|
+
--success-600: 0 158 44; /* rgb(0, 158, 44) */
|
|
23
|
+
--success-700: 0 130 36; /* rgb(0, 130, 36) */
|
|
24
|
+
--success-800: 0 102 29; /* rgb(0, 102, 29) */
|
|
25
|
+
--success-900: 0 74 21; /* rgb(0, 74, 21) */
|
|
26
|
+
|
|
27
|
+
--warning-100: 255 207 151; /* rgb(255, 207, 151) */
|
|
28
|
+
--warning-200: 255 189 111; /* rgb(255, 189, 111) */
|
|
29
|
+
--warning-300: 255 171 72; /* rgb(255, 171, 72) */
|
|
30
|
+
--warning-400: 255 153 33; /* rgb(255, 153, 33) */
|
|
31
|
+
--warning-500: 249 134 0; /* rgb(249, 134, 0) */
|
|
32
|
+
--warning-600: 212 114 0; /* rgb(212, 114, 0) */
|
|
33
|
+
--warning-700: 174 94 0; /* rgb(174, 94, 0) */
|
|
34
|
+
--warning-800: 137 74 0; /* rgb(137, 74, 0) */
|
|
35
|
+
--warning-900: 100 54 0; /* rgb(100, 54, 0) */
|
|
36
|
+
|
|
37
|
+
--error-100: 246 171 171; /* rgb(246, 171, 171) */
|
|
38
|
+
--error-200: 243 139 139; /* rgb(243, 139, 139) */
|
|
39
|
+
--error-300: 240 107 107; /* rgb(240, 107, 107) */
|
|
40
|
+
--error-400: 236 76 76; /* rgb(236, 76, 76) */
|
|
41
|
+
--error-500: 233 44 44; /* rgb(233, 44, 44) */
|
|
42
|
+
--error-600: 213 22 22; /* rgb(213, 22, 22) */
|
|
43
|
+
--error-700: 176 18 18; /* rgb(176, 18, 18) */
|
|
44
|
+
--error-800: 138 14 14; /* rgb(138, 14, 14) */
|
|
45
|
+
--error-900: 100 10 10; /* rgb(100, 10, 10) */
|
|
46
|
+
|
|
47
|
+
--gray-100: 75 75 75; /* rgb(75, 75, 75) 70% */
|
|
48
|
+
--gray-200: 100 100 100; /* rgb(100, 100, 100) 60% */
|
|
49
|
+
--gray-300: 125 125 125; /* rgb(125, 125, 125) 50% */
|
|
50
|
+
--gray-400: 150 150 150; /* rgb(150, 150, 150) 40% */
|
|
51
|
+
--gray-500: 175 175 175; /* rgb(175, 175, 175) 30% */
|
|
52
|
+
--gray-600: 200 200 200; /* rgb(200, 200, 200) 20% */
|
|
53
|
+
--gray-700: 212 212 212; /* rgb(212, 212, 212) 15% */
|
|
54
|
+
--gray-800: 225 225 225; /* rgb(225, 225, 225) 10% */
|
|
55
|
+
--gray-900: 237 237 237; /* rgb(237, 237, 237) 5% */
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.dark {
|
|
59
|
+
--white: 250 250 250; /* rgb(250, 250, 250) */
|
|
60
|
+
--black: 28 28 28; /* rgb(28, 28, 28) */
|
|
61
|
+
|
|
62
|
+
--text-color: 242 242 242; /* rgb(242, 242, 242) */
|
|
63
|
+
|
|
64
|
+
--primary-100: 161 210 255; /* rgb(161, 210, 255) */
|
|
65
|
+
--primary-200: 126 193 255; /* rgb(126,193,255) */
|
|
66
|
+
--primary-300: 91 177 255; /* rgb(91,177,255) */
|
|
67
|
+
--primary-400: 56 160 255; /* rgb(56, 160, 255) */
|
|
68
|
+
--primary-500: 21 143 255; /* rgb(21, 143, 255) */
|
|
69
|
+
--primary-600: 0 122 235; /* rgb(0,122,235) */
|
|
70
|
+
--primary-700: 0 101 193; /* rgb(0, 101, 193) */
|
|
71
|
+
--primary-800: 0 79 152; /* rgb(0, 79, 152) */
|
|
72
|
+
--primary-900: 0 58 110; /* rgb(0, 58, 110) */
|
|
73
|
+
|
|
74
|
+
--success-100: 152 244 178; /* rgb(152, 244, 178) */
|
|
75
|
+
--success-200: 114 240 149; /* rgb(114, 240, 149) */
|
|
76
|
+
--success-300: 75 235 120; /* rgb(75, 235, 120) */
|
|
77
|
+
--success-400: 36 231 91; /* rgb(36, 231, 91) */
|
|
78
|
+
--success-500: 22 203 73; /* rgb(22, 203, 73) */
|
|
79
|
+
--success-600: 19 173 62; /* rgb(19, 173, 62) */
|
|
80
|
+
--success-700: 15 142 51; /* rgb(15, 142, 51) */
|
|
81
|
+
--success-800: 12 112 40; /* rgb(12, 112, 40) */
|
|
82
|
+
--success-900: 9 81 29; /* rgb(9, 81, 29) */
|
|
83
|
+
|
|
84
|
+
--warning-100: 255 217 171; /* rgb(255, 217, 171) */
|
|
85
|
+
--warning-200: 255 202 139; /* rgb(255, 202, 139) */
|
|
86
|
+
--warning-300: 255 188 108; /* rgb(255, 188, 108) */
|
|
87
|
+
--warning-400: 255 173 77; /* rgb(255, 173, 77) */
|
|
88
|
+
--warning-500: 255 159 45; /* rgb(255, 159, 45) */
|
|
89
|
+
--warning-600: 255 138 0; /* rgb(255, 138, 0) */
|
|
90
|
+
--warning-700: 210 114 0; /* rgb(210, 114, 0) */
|
|
91
|
+
--warning-800: 165 90 0; /* rgb(165, 90, 0) */
|
|
92
|
+
--warning-900: 120 65 0; /* rgb(120, 65, 0) */
|
|
93
|
+
|
|
94
|
+
--error-100: 252 179 179; /* rgb(252, 179, 179) */
|
|
95
|
+
--error-200: 251 150 150; /* rgb(251, 150, 150) */
|
|
96
|
+
--error-300: 249 122 121; /* rgb(249, 122, 121) */
|
|
97
|
+
--error-400: 248 93 93; /* rgb(248, 93, 93) */
|
|
98
|
+
--error-500: 247 65 64; /* rgb(247, 65, 64) */
|
|
99
|
+
--error-600: 245 20 19; /* rgb(245, 20, 19) */
|
|
100
|
+
--error-700: 209 10 9; /* rgb(209, 10, 9) */
|
|
101
|
+
--error-800: 164 8 7; /* rgb(164, 8, 7) */
|
|
102
|
+
--error-900: 119 6 5; /* rgb(119, 6, 5) */
|
|
103
|
+
|
|
104
|
+
--gray-100: 187 187 187; /* rgb(187, 187, 187) 70% */
|
|
105
|
+
--gray-200: 164 164 164; /* rgb(164, 164, 164) 60% */
|
|
106
|
+
--gray-300: 141 141 141; /* rgb(141, 141, 141) 50% */
|
|
107
|
+
--gray-400: 119 119 119; /* rgb(119, 119, 119) 40% */
|
|
108
|
+
--gray-500: 96 96 96; /* rgb(96, 96, 96) 30% */
|
|
109
|
+
--gray-600: 73 73 73; /* rgb(73, 73, 73) 20% */
|
|
110
|
+
--gray-700: 62 62 62; /* rgb(62, 62, 62) 15% */
|
|
111
|
+
--gray-800: 51 51 51; /* rgb(51, 51, 51) 10% */
|
|
112
|
+
--gray-900: 39 39 39; /* rgb(39, 39, 39) 5% */
|
|
113
|
+
}
|