tailwind.config.js 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. /** @type {import('tailwindcss').Config} */
  2. const generateSpacingMap = () => {
  3. const tmpList = {}
  4. for (let index = 0; index < 1000; index++) {
  5. tmpList[index] = `${index}px`
  6. }
  7. return tmpList
  8. }
  9. const generateFontSize = () => {
  10. const tmpList = {}
  11. let start = 14
  12. for (let index = 1; index < 50; index++) {
  13. tmpList[`${index === 1 ? '' : index}xl`] = `${start + 2}px`
  14. start = start + 2
  15. }
  16. return tmpList
  17. }
  18. module.exports = {
  19. content: [
  20. './src/components/**/*.{js,vue,ts}',
  21. './src/layouts/**/*.vue',
  22. './src/pages/**/*.vue',
  23. './src/plugins/**/*.{js,ts}',
  24. './src/app.vue'
  25. ],
  26. theme: {
  27. spacing: {
  28. ...generateSpacingMap(),
  29. wrap: '1200px'
  30. },
  31. fontSize: {
  32. sm: '12px',
  33. base: '14px',
  34. ...generateFontSize()
  35. },
  36. lineHeight: {
  37. sm: '12px',
  38. base: '14px',
  39. xl: '16px',
  40. '2xl': '18px',
  41. '3xl': '20px',
  42. '4xl': '22px',
  43. '5xl': '24px',
  44. '6xl': '26px',
  45. '7xl': '28px',
  46. '8xl': '30px',
  47. '9xl': '32px',
  48. '11xl': '36px',
  49. '12xl': '38px',
  50. '14xl': '42px'
  51. },
  52. borderRadius: {
  53. sm: '2px',
  54. DEFAULT: '4px',
  55. md: '6px',
  56. lg: '8px',
  57. xl: '10px',
  58. '2xl': '12px',
  59. '3xl': '14px',
  60. '4xl': '16px',
  61. '5xl': '18px',
  62. '6xl': '20px',
  63. full: '9999px'
  64. },
  65. extend: {
  66. colors: {
  67. primary: '#fd9a00',
  68. linkHover: '#fd9a00',
  69. navEntryHover: 'rgba(0, 0, 0, 0.04)',
  70. noticeContent: '#61687c',
  71. 'black-3': '#333333',
  72. 'black-4': '#444444',
  73. 'black-6': '#666666',
  74. 'black-9': '#999999',
  75. 'black-c': '#cccccc',
  76. 'black-d': '#dddddd',
  77. 'black-e': '#eeeeee',
  78. 'black-f5': '#f5f5f5',
  79. 'black-fa': '#fafafa',
  80. 'black-ef': '#efefef',
  81. line: '#f8f8f8'
  82. },
  83. boxShadow: {
  84. '3xl': '0 0 12px 0 rgba(0,0,0,0.1)',
  85. card: '0 3px 11px 1px rgba(93, 93, 03, 0.2)',
  86. navEntry: '4px 0px 40px 0px rgba(93, 93, 03, 0.2)'
  87. },
  88. minWidth: {
  89. wrap: '1200px'
  90. },
  91. fontFamily: {
  92. youSheBiaoti: ['YouSheBiaoTiHei'],
  93. DIN: ['DINAlternate-Bold, DINAlternate']
  94. },
  95. letterSpacing: {
  96. 1: '1px'
  97. },
  98. lineClamp: {
  99. 8: '8',
  100. 9: '9'
  101. }
  102. }
  103. }
  104. }