diff --git a/README.md b/README.md index 0ae035c..d18acbd 100644 --- a/README.md +++ b/README.md @@ -56,19 +56,21 @@ npx jsonresume-theme-even < resume.json > resume.html ### Colors -You can override theme colors via the `.meta.colors` resume field. Each entry defines a tuple of light and (optional) dark color values. If only one array value is defined, it will be used in both light and dark modes. +You can override theme colors via the `.meta.themeOptions.colors` resume field. Each entry defines a tuple of light and (optional) dark color values. If only one array value is defined, it will be used in both light and dark modes. Here's an example using the default theme colors: ```json { "meta": { - "colors": { - "background": ["#ffffff", "#191e23"], - "dimmed": ["#f3f4f5", "#23282d"], - "primary": ["#191e23", "#fbfbfc"], - "secondary": ["#6c7781", "#ccd0d4"], - "accent": ["#0073aa", "#00a0d2"] + "themeOptions": { + "colors": { + "background": ["#ffffff", "#191e23"], + "dimmed": ["#f3f4f5", "#23282d"], + "primary": ["#191e23", "#fbfbfc"], + "secondary": ["#6c7781", "#ccd0d4"], + "accent": ["#0073aa", "#00a0d2"] + } } } } diff --git a/test/index.test.js b/test/index.test.js index bc3df07..6b319c0 100644 --- a/test/index.test.js +++ b/test/index.test.js @@ -8,8 +8,10 @@ const resume = { ...sampleResume, meta: { ...sampleResume.meta, - colors: { - background: ['lightgray', 'darkgray'], + themeOptions: { + colors: { + background: ['lightgray', 'darkgray'], + }, }, }, basics: { diff --git a/utils/colors.js b/utils/colors.js index 269db7f..4083c37 100644 --- a/utils/colors.js +++ b/utils/colors.js @@ -1,6 +1,9 @@ export default function colors(meta = {}) { - const { colors } = meta - return colors && Object.entries(colors) - .map(([name, [light, dark = light]]) => `--color-${name}-light:${light}; --color-${name}-dark:${dark};`) - .join(' ') + const { colors } = meta.themeOptions || {} + return ( + colors && + Object.entries(colors) + .map(([name, [light, dark = light]]) => `--color-${name}-light:${light}; --color-${name}-dark:${dark};`) + .join(' ') + ) }