update tw-theme plugin

This commit is contained in:
Somrat 2025-02-16 17:01:53 +06:00
parent 05afbdfc8b
commit 64cd288a1d

View File

@ -5,9 +5,19 @@ const themePath = path.join(__dirname, "../data/theme.json");
const themeRead = fs.readFileSync(themePath, "utf8"); const themeRead = fs.readFileSync(themePath, "utf8");
const themeConfig = JSON.parse(themeRead); const themeConfig = JSON.parse(themeRead);
// Find font name from font string
const findFont = (fontStr) => const findFont = (fontStr) =>
fontStr.replace(/\+/g, " ").replace(/:[^:]+/g, ""); fontStr.replace(/\+/g, " ").replace(/:[^:]+/g, "");
// Set font families dynamically, filtering out 'type' keys
const fontFamilies = Object.entries(themeConfig.fonts.font_family)
.filter(([key]) => !key.includes("type"))
.reduce((acc, [key, font]) => {
acc[key] =
`${findFont(font)}, ${themeConfig.fonts.font_family[`${key}-type`] || "sans-serif"}`;
return acc;
}, {});
module.exports = plugin.withOptions(() => { module.exports = plugin.withOptions(() => {
return ({ addBase, addUtilities }) => { return ({ addBase, addUtilities }) => {
const rootVars = {}; const rootVars = {};
@ -33,11 +43,9 @@ module.exports = plugin.withOptions(() => {
rootVars[`--text-${k}`] = v; rootVars[`--text-${k}`] = v;
}); });
// Set font families Object.entries(fontFamilies).forEach(([key, font]) => {
rootVars["--font-primary"] = rootVars[`--font-${key}`] = font;
`${findFont(themeConfig.fonts.font_family.primary)}, ${themeConfig.fonts.font_family.primary_type}`; });
rootVars["--font-secondary"] =
`${findFont(themeConfig.fonts.font_family.secondary)}, ${themeConfig.fonts.font_family.secondary_type}`;
// Define color groups // Define color groups
const groups = [ const groups = [
@ -57,6 +65,7 @@ module.exports = plugin.withOptions(() => {
}); });
}); });
// Add variables to root
addBase({ ":root": rootVars }); addBase({ ":root": rootVars });
// Generate color utilities // Generate color utilities
@ -79,11 +88,11 @@ module.exports = plugin.withOptions(() => {
}); });
}); });
// Generate font utilities // Generate font utilities dynamically
const fontUtils = { const fontUtils = {};
".font-primary": { fontFamily: "var(--font-primary)" }, Object.keys(fontFamilies).forEach((key) => {
".font-secondary": { fontFamily: "var(--font-secondary)" }, fontUtils[`.font-${key}`] = { fontFamily: `var(--font-${key})` };
}; });
Object.keys(fontSizes).forEach((k) => { Object.keys(fontSizes).forEach((k) => {
fontUtils[`.text-${k}`] = { fontSize: `var(--text-${k})` }; fontUtils[`.text-${k}`] = { fontSize: `var(--text-${k})` };
}); });