Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

That's an interesting approach with bootstrap-like class names.

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']
      },
  }
[1] https://shuffle.dev


Consider applying for YC's Fall 2025 batch! Applications are open till Aug 4

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: