update tw-theme plugin
This commit is contained in:
parent
05afbdfc8b
commit
64cd288a1d
@ -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})` };
|
||||||
});
|
});
|
||||||
|
Loading…
x
Reference in New Issue
Block a user