Skip to content

Instantly share code, notes, and snippets.

@krstivoja
Last active January 4, 2024 13:17
Show Gist options
  • Save krstivoja/0e62be7cfa7d0552e0f54cc1df303519 to your computer and use it in GitHub Desktop.
Save krstivoja/0e62be7cfa7d0552e0f54cc1df303519 to your computer and use it in GitHub Desktop.
extract values from theme.json
/**
* See https://tailwindcss.com/docs/configuration for configuration details
*/
/**
* Convert pixels to rems
* @param {int} px The pixel value to convert to rems
*/
const fs = require( 'fs' )
const glob = require('glob')
const themeJson = fs.readFileSync( './theme.json' )
const theme = JSON.parse( themeJson )
const rem = px => `${px / 16}rem`
let colors = {}
theme.settings.color.palette.forEach(color => {
colors[color.slug] = color.color
})
let fonts = {}
theme.settings.typography.fontFamilies.forEach(fam => {
fonts[fam.slug] = fam.fontFamily.split(',')
})
module.exports = {
content: [
'./inc/**/*.php',
'./template-parts/**/*.php',
'./parts/**/*.html',
].concat(glob.sync("./*.php")),
// have to use glob sync because otherwise base folder becomes tw dependency and infinite loop because of index.asset.php
// glob returns array of actual files and this way build folder is definitively ignored
theme: {
fontFamily: fonts,
colors: colors,
extend : {
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment