baby-app/tailwind.config.js

/** @type {import('tailwindcss').Config} */

const generateSpacingMap = () => {
  const tmpList = {}
  for (let index = 0; index < 1000; index++) {
    tmpList[index] = `${index}px`
  }
  return tmpList
}

const generateFontSize = () => {
  const tmpList = {}
  let start = 14
  for (let index = 1; index < 50; index++) {
    tmpList[`${index === 1 ? '' : index}xl`] = `${start + 2}px`
    start = start + 2
  }
  return tmpList
}

module.exports = {
  content: [
    './src/components/**/*.{js,vue,ts}',
    './src/layouts/**/*.vue',
    './src/pages/**/*.vue',
    './src/plugins/**/*.{js,ts}',
    './src/app.vue',
  ],
  theme: {
    // spacing: {
    //   ...generateSpacingMap(),
    //   wrap: '1200px'
    // },
    // fontSize: {
    //   sm: '12px',
    //   base: '14px',
    //   ...generateFontSize()
    // },
    // lineHeight: {
    //   sm: '12px',
    //   base: '14px',
    //   xl: '16px',
    //   '2xl': '18px',
    //   '3xl': '20px',
    //   '4xl': '22px',
    //   '5xl': '24px',
    //   '6xl': '26px',
    //   '7xl': '28px',
    //   '8xl': '30px',
    //   '9xl': '32px',
    //   '11xl': '36px',
    //   '12xl': '38px',
    //   '14xl': '42px'
    // },
    // borderRadius: {
    //   sm: '2px',
    //   DEFAULT: '4px',
    //   md: '6px',
    //   lg: '8px',
    //   xl: '10px',
    //   '2xl': '12px',
    //   '3xl': '14px',
    //   '4xl': '16px',
    //   '5xl': '18px',
    //   '6xl': '20px',
    //   full: '9999px'
    // },

    extend: {
      colors: {
        primary: '#F88842',
        linkHover: '#F88842',
        navEntryHover: 'rgba(0, 0, 0, 0.04)',
        noticeContent: '#61687c',
        'black-3': '#333333',
        'black-4': '#444444',
        'black-6': '#666666',
        'black-9': '#999999',
        'black-c': '#cccccc',
        'black-d': '#dddddd',
        'black-e': '#eeeeee',
        'black-f5': '#f5f5f5',
        'black-fa': '#fafafa',
        'black-ef': '#efefef',
        line: '#f8f8f8',
      },
      // boxShadow: {
      //   '3xl': '0 0 12px 0 rgba(0,0,0,0.1)',
      //   card: '0 3px 11px 1px rgba(93, 93, 03, 0.2)',
      //   navEntry: '4px 0px 40px 0px rgba(93, 93, 03, 0.2)'
      // },
      // minWidth: {
      //   wrap: '1200px',
      // },
      // fontFamily: {
      //   youSheBiaoti: ['YouSheBiaoTiHei'],
      //   DIN: ['DINAlternate-Bold, DINAlternate']
      // },
      letterSpacing: {
        1: '2rpx',
      },
      // lineClamp: {
      //   8: '8',
      //   9: '9'
      // }
    },
  },
}