@classic-homes/theme-tailwind-preset 0.1.35 → 0.1.36
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/index.js +21 -44
- package/package.json +1 -1
package/index.js
CHANGED
|
@@ -46,55 +46,26 @@ module.exports = {
|
|
|
46
46
|
},
|
|
47
47
|
|
|
48
48
|
extend: {
|
|
49
|
-
// Brand color palettes
|
|
49
|
+
// Brand color palettes from tokens
|
|
50
|
+
// Each color includes shades (50-950) and a foreground color for text on colored backgrounds
|
|
50
51
|
colors: {
|
|
51
52
|
// Neutrals
|
|
52
53
|
gray: tokens.colors.gray,
|
|
53
54
|
|
|
54
|
-
//
|
|
55
|
-
red:
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
...tokens.colors.teal,
|
|
61
|
-
foreground: '#ffffff', // White text/icons on teal backgrounds
|
|
62
|
-
},
|
|
63
|
-
navy: {
|
|
64
|
-
...tokens.colors.navy,
|
|
65
|
-
foreground: '#ffffff', // White text/icons on navy backgrounds
|
|
66
|
-
},
|
|
67
|
-
plum: {
|
|
68
|
-
...tokens.colors.plum,
|
|
69
|
-
foreground: '#ffffff', // White text/icons on plum backgrounds
|
|
70
|
-
},
|
|
71
|
-
sage: tokens.colors.sage,
|
|
55
|
+
// Core brand colors (foreground property included from tokens)
|
|
56
|
+
red: tokens.colors.red,
|
|
57
|
+
teal: tokens.colors.teal,
|
|
58
|
+
navy: tokens.colors.navy,
|
|
59
|
+
plum: tokens.colors.plum,
|
|
60
|
+
sage: tokens.colors.sage, // Note: sage does not include foreground (muted color)
|
|
72
61
|
|
|
73
|
-
// Collection colors
|
|
74
|
-
stone:
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
foreground: '#ffffff', // White text/icons on forest backgrounds
|
|
81
|
-
},
|
|
82
|
-
lavender: {
|
|
83
|
-
...tokens.colors.lavender,
|
|
84
|
-
foreground: '#ffffff', // White text/icons on lavender backgrounds
|
|
85
|
-
},
|
|
86
|
-
sky: {
|
|
87
|
-
...tokens.colors.sky,
|
|
88
|
-
foreground: '#ffffff', // White text/icons on sky backgrounds
|
|
89
|
-
},
|
|
90
|
-
deepTeal: {
|
|
91
|
-
...tokens.colors.deepTeal,
|
|
92
|
-
foreground: '#ffffff', // White text/icons on deepTeal backgrounds
|
|
93
|
-
},
|
|
94
|
-
charcoal: {
|
|
95
|
-
...tokens.colors.charcoal,
|
|
96
|
-
foreground: '#ffffff', // White text/icons on charcoal backgrounds
|
|
97
|
-
},
|
|
62
|
+
// Collection colors (foreground property included from tokens)
|
|
63
|
+
stone: tokens.colors.stone,
|
|
64
|
+
forest: tokens.colors.forest,
|
|
65
|
+
lavender: tokens.colors.lavender,
|
|
66
|
+
sky: tokens.colors.sky,
|
|
67
|
+
deepTeal: tokens.colors.deepTeal,
|
|
68
|
+
charcoal: tokens.colors.charcoal,
|
|
98
69
|
|
|
99
70
|
// Semantic color utilities (using CSS variables for theming)
|
|
100
71
|
border: 'hsl(var(--border))',
|
|
@@ -191,6 +162,12 @@ module.exports = {
|
|
|
191
162
|
'core-3': 'var(--color-core-3)',
|
|
192
163
|
'core-4': 'var(--color-core-4)',
|
|
193
164
|
'core-4-tint': 'var(--color-core-4-tint)',
|
|
165
|
+
'collection-1': 'var(--color-collection-1)',
|
|
166
|
+
'collection-2': 'var(--color-collection-2)',
|
|
167
|
+
'collection-3': 'var(--color-collection-3)',
|
|
168
|
+
'collection-4': 'var(--color-collection-4)',
|
|
169
|
+
'collection-5': 'var(--color-collection-5)',
|
|
170
|
+
'collection-6': 'var(--color-collection-6)',
|
|
194
171
|
},
|
|
195
172
|
},
|
|
196
173
|
|