@codapet/design-system 0.1.2 → 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.
- package/dist/index.d.mts +23 -44
- package/dist/index.mjs +445 -876
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +73 -6
- package/package.json +1 -1
package/dist/styles.css
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
@import
|
|
1
|
+
@import 'tw-animate-css';
|
|
2
2
|
|
|
3
3
|
@custom-variant dark (&:is(.dark *));
|
|
4
4
|
|
|
5
5
|
@theme inline {
|
|
6
6
|
--color-background: var(--background);
|
|
7
7
|
--color-foreground: var(--foreground);
|
|
8
|
-
--font-sans: var(--font-
|
|
8
|
+
--font-sans: var(--font-plus-jakarta-sans);
|
|
9
9
|
--font-mono: var(--font-geist-mono);
|
|
10
10
|
--color-sidebar-ring: var(--sidebar-ring);
|
|
11
11
|
--color-sidebar-border: var(--sidebar-border);
|
|
@@ -40,6 +40,38 @@
|
|
|
40
40
|
--radius-md: calc(var(--radius) - 2px);
|
|
41
41
|
--radius-lg: var(--radius);
|
|
42
42
|
--radius-xl: calc(var(--radius) + 4px);
|
|
43
|
+
|
|
44
|
+
/* Brand Colors */
|
|
45
|
+
--color-brand-subtle: var(--brand-subtle);
|
|
46
|
+
--color-brand-light: var(--brand-light);
|
|
47
|
+
--color-brand-normal: var(--brand-normal);
|
|
48
|
+
--color-brand-vibrant: var(--brand-vibrant);
|
|
49
|
+
--color-brand-dark: var(--brand-dark);
|
|
50
|
+
|
|
51
|
+
/* Custom Sand Colors */
|
|
52
|
+
--color-sand-light: var(--sand-light);
|
|
53
|
+
--color-sand-normal: var(--sand-normal);
|
|
54
|
+
--color-sand-dark: var(--sand-dark);
|
|
55
|
+
|
|
56
|
+
/* Rose accent */
|
|
57
|
+
--color-rose-light: var(--rose-light);
|
|
58
|
+
--color-rose-normal: var(--rose-normal);
|
|
59
|
+
--color-rose-dark: var(--rose-dark);
|
|
60
|
+
|
|
61
|
+
/* Red accent */
|
|
62
|
+
--color-red-subtle: var(--red-subtle);
|
|
63
|
+
|
|
64
|
+
/* Sage accent */
|
|
65
|
+
--color-sage-light: var(--sage-light);
|
|
66
|
+
--color-sage-normal: var(--sage-normal);
|
|
67
|
+
--color-sage-dark: var(--sage-dark);
|
|
68
|
+
|
|
69
|
+
/* Custom warning color scale */
|
|
70
|
+
--color-warning-subtle: var(--warning-subtle);
|
|
71
|
+
--color-warning-light: var(--warning-light);
|
|
72
|
+
--color-warning-normal: var(--warning-normal);
|
|
73
|
+
--color-warning-vibrant: var(--warning-vibrant);
|
|
74
|
+
--color-warning-dark: var(--warning-dark);
|
|
43
75
|
}
|
|
44
76
|
|
|
45
77
|
:root {
|
|
@@ -50,7 +82,8 @@
|
|
|
50
82
|
--card-foreground: oklch(0.129 0.042 264.695);
|
|
51
83
|
--popover: oklch(1 0 0);
|
|
52
84
|
--popover-foreground: oklch(0.129 0.042 264.695);
|
|
53
|
-
|
|
85
|
+
|
|
86
|
+
/* --primary: oklch(0.208 0.042 265.755); */
|
|
54
87
|
--primary-foreground: oklch(0.984 0.003 247.858);
|
|
55
88
|
--secondary: oklch(0.968 0.007 247.896);
|
|
56
89
|
--secondary-foreground: oklch(0.208 0.042 265.755);
|
|
@@ -75,6 +108,42 @@
|
|
|
75
108
|
--sidebar-accent-foreground: oklch(0.208 0.042 265.755);
|
|
76
109
|
--sidebar-border: oklch(0.929 0.013 255.508);
|
|
77
110
|
--sidebar-ring: oklch(0.704 0.04 256.788);
|
|
111
|
+
|
|
112
|
+
/* Brand Colors */
|
|
113
|
+
--brand-subtle: oklch(0.9672 0.0087 247.92);
|
|
114
|
+
--brand-light: oklch(0.9417 0.0144 251.57);
|
|
115
|
+
--brand-normal: oklch(0.5695 0.0859 252.57);
|
|
116
|
+
--brand-vibrant: oklch(0.5424 0.1123 253.26);
|
|
117
|
+
--brand-dark: oklch(0.4463 0.0577 255.4);
|
|
118
|
+
|
|
119
|
+
/* Custom Sand Colors */
|
|
120
|
+
--sand-light: oklch(0.9815 0.0046 106.48);
|
|
121
|
+
--sand-normal: oklch(0.9557 0.0053 67.76);
|
|
122
|
+
--sand-dark: oklch(0.8691 0.0045 56.36);
|
|
123
|
+
|
|
124
|
+
/* Primary Color uses brand-normal */
|
|
125
|
+
--primary: var(--brand-normal);
|
|
126
|
+
--primary-foreground: oklch(0.984 0.003 247.858);
|
|
127
|
+
|
|
128
|
+
/* Rose accent */
|
|
129
|
+
--rose-light: oklch(0.9722 0.0086 0.11);
|
|
130
|
+
--rose-normal: oklch(0.8046 0.0487 0.45);
|
|
131
|
+
--rose-dark: oklch(0.5133 0.0289 0.34);
|
|
132
|
+
|
|
133
|
+
/* Custom red accent */
|
|
134
|
+
--red-subtle: oklch(0.9903 0.003 17.21);
|
|
135
|
+
|
|
136
|
+
/* Sage accent */
|
|
137
|
+
--sage-light: oklch(0.932 0.01726072052629843 164.64944629777187);
|
|
138
|
+
--sage-normal: oklch(0.7506 0.034 163.9);
|
|
139
|
+
--sage-dark: oklch(0.4323 0.0246 165.25);
|
|
140
|
+
|
|
141
|
+
/* Custom warning color scale */
|
|
142
|
+
--warning-subtle: oklch(0.9972 0.0134 106.64);
|
|
143
|
+
--warning-light: oklch(0.888 0.086 112.02);
|
|
144
|
+
--warning-normal: oklch(0.845 0.1914 115.53);
|
|
145
|
+
--warning-vibrant: oklch(0.7956 0.1807 115.58);
|
|
146
|
+
--warning-dark: oklch(0.473 0.0898 90.46);
|
|
78
147
|
}
|
|
79
148
|
|
|
80
149
|
.dark {
|
|
@@ -116,8 +185,6 @@
|
|
|
116
185
|
@apply border-border outline-ring/50;
|
|
117
186
|
}
|
|
118
187
|
body {
|
|
119
|
-
@apply bg-background text-foreground;
|
|
188
|
+
@apply bg-background text-foreground font-sans;
|
|
120
189
|
}
|
|
121
190
|
}
|
|
122
|
-
|
|
123
|
-
|