At Shuffle[1], we create templates for Tailwind, Bootstrap, Bulma, and Material-UI and need to convert UI libraries from one technology to another.
We decided to write converters that can transform HTML classes & Tailwind config to Sass config.
Probably, we will release it as open-source soon.
// Example: // Tailwind.config to Sass // button.js const { theme } = require('../theme.config.js'); module.exports = { bootstrap: { 'input-btn-font-size': theme.fontSize.sm[0], 'input-btn-padding-y': theme.spacing[4], 'input-btn-padding-x': theme.spacing[6], }, bulma: { 'size-normal': theme.fontSize.sm[0], 'button-padding-vertical': theme.spacing[4], 'button-padding-horizontal': theme.spacing[6], }, }; // HTML export const mappings = [ { from: ['flex', 'flex-wrap', '-mx-4'], to: ['row'] }, }
At Shuffle[1], we create templates for Tailwind, Bootstrap, Bulma, and Material-UI and need to convert UI libraries from one technology to another.
We decided to write converters that can transform HTML classes & Tailwind config to Sass config.
Probably, we will release it as open-source soon.
[1] https://shuffle.dev