const global = {
  'light': 'var(--lc-color-light)',
  'light-1': 'var(--lc-color-light-1)',
  'light-2': 'var(--lc-color-light-2)',
  'light-3': 'var(--lc-color-light-3)',
  'light-4': 'var(--lc-color-light-4)',
  'light-5': 'var(--lc-color-light-5)',
  'light-6': 'var(--lc-color-light-6)',
  'dark': 'var(--lc-color-dark)',
  'dark-1': 'var(--lc-color-dark-1)',
  'dark-2': 'var(--lc-color-dark-2)',
  'dark-3': 'var(--lc-color-dark-3)',
  'dark-4': 'var(--lc-color-dark-4)',
  'dark-5': 'var(--lc-color-dark-5)',
  'dark-6': 'var(--lc-color-dark-6)',
  'dark-7': 'var(--lc-color-dark-7)',
  'dark-8': 'var(--lc-color-dark-8)',
  'dark-9': 'var(--lc-color-dark-9)',
  'primary': 'var(--lc-color-primary)',
  'primary-1': 'var(--lc-color-primary-1)',
  'primary-2': 'var(--lc-color-primary-2)',
  'primary-3': 'var(--lc-color-primary-3)',
  'primary-4': 'var(--lc-color-primary-4)',
  'primary-5': 'var(--lc-color-primary-5)',
  'success': 'var(--lc-color-success)',
  'success-1': 'var(--lc-color-success-1)',
  'success-2': 'var(--lc-color-success-2)',
  'success-3': 'var(--lc-color-success-3)',
  'warning': 'var(--lc-color-warning)',
  'warning-1': 'var(--lc-color-warning-1)',
  'warning-2': 'var(--lc-color-warning-2)',
  'warning-3': 'var(--lc-color-warning-3)',
  'danger': 'var(--lc-color-danger)',
  'danger-1': 'var(--lc-color-danger-1)',
  'danger-2': 'var(--lc-color-danger-2)',
  'danger-3': 'var(--lc-color-danger-3)',
  'orange-1': 'var(--lc-color-orange-1)',
  'orange-2': 'var(--lc-color-orange-2)',
  'orange-3': 'var(--lc-color-orange-3)',
  'orange-4': 'var(--lc-color-orange-4)',
  'orange-5': 'var(--lc-color-orange-5)',
  'orange-6': 'var(--lc-color-orange-6)',
  'orange-7': 'var(--lc-color-orange-7)',
  'orange-8': 'var(--lc-color-orange-8)',
  'orange-9': 'var(--lc-color-orange-9)',
  'orange-10': 'var(--lc-color-orange-10)',
  'red-1': 'var(--lc-color-red-1)',
  'red-2': 'var(--lc-color-red-2)',
  'red-3': 'var(--lc-color-red-3)',
  'red-4': 'var(--lc-color-red-4)',
  'red-5': 'var(--lc-color-red-5)',
  'red-6': 'var(--lc-color-red-6)',
  'red-7': 'var(--lc-color-red-7)',
  'green-1': 'var(--lc-color-green-1)',
  'green-2': 'var(--lc-color-green-1)',
  'green-3': 'var(--lc-color-green-3)',
  'green-4': 'var(--lc-color-green-4)',
  'green-5': 'var(--lc-color-green-5)',
  'green-6': 'var(--lc-color-green-6)',
  'green-7': 'var(--lc-color-green-7)',
  'cyan-1': 'var( --lc-color-cyan-1)',
  'cyan-2': 'var( --lc-color-cyan-2)',
  'cyan-3': 'var( --lc-color-cyan-3)',
  'cyan-4': 'var( --lc-color-cyan-4)',
  'cyan-5': 'var( --lc-color-cyan-5)',
  'blue-1': 'var( --lc-color-blue-1)',
  'blue-2': 'var( --lc-color-blue-2)',
  'blue-3': 'var( --lc-color-blue-3)',
  'blue-4': 'var( --lc-color-blue-4)',
  'blue-5': 'var( --lc-color-blue-5)',
  'blue-6': 'var( --lc-color-blue-6)',
  'text-title': 'var(--lc-text-title)',
  'text': 'var(--lc-text)',
  'text-tip': 'var(--lc-text-tip)',
  'text-place': 'var(--lc-text-place)',
  'text-expire': 'var(--lc-text-expire)',
  'text-select': 'var(--lc-text-select)',
  'grey': 'var(--lc-color-grey)',
  'border': 'var(--lc-border-color)',
}

module.exports = {
  content: ['./public/**/*.html', './src/**/*.{js,jsx,ts,tsx,vue}'],
  theme: {
    extend: {
      fontFamily: {
        'base': ['PingFangSC-Medium', 'PingFang SC'],
        'base-1': ['PingFang SC-Regular', ' PingFang SC'],
      },
      borderRadius: {
        2: '2px',
        4: '4px',
        8: '8px',
      },
      backgroundColor: {
        ...global,
      },
      textColor: {
        ...global,
      },
      borderColor: {
        ...global,
      },
      boxShadow: {
        'base': 'var(--lc-box-shadow)',
        'base-1': 'var(--lc-box-shadow-1)',
        'base-2': 'var(--lc-box-shadow-2)',
      },
    },
  },
}