tailwind.config.js 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. /** @type {import('tailwindcss').Config} */
  2. module.exports = {
  3. plugins: [require('daisyui')],
  4. // 其他配置...
  5. daisyui: {
  6. logs: false,
  7. themes: [
  8. {
  9. light: {
  10. ...require('daisyui/src/theming/themes')['light'],
  11. primary: '#2E5CF6',
  12. },
  13. },
  14. ],
  15. },
  16. content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
  17. theme: {
  18. // 扩展 tailwindcss 不建议强制覆盖原有
  19. extend: {
  20. colors: {
  21. primary: {
  22. DEFAULT: 'var(--el-color-primary)',
  23. 'light-3': 'var(--el-color-primary-light-3)',
  24. 'light-5': 'var(--el-color-primary-light-5)',
  25. 'light-7': 'var(--el-color-primary-light-7)',
  26. 'light-8': 'var(--el-color-primary-light-8)',
  27. 'light-9': 'var(--el-color-primary-light-9)',
  28. 'dark-2': 'var(--el-color-primary-dark-2)',
  29. },
  30. br: 'var(--el-border-color)',
  31. 'br-light': 'var(--el-border-color-light)',
  32. 'br-extra-light': 'var(--el-border-color-extra-light)',
  33. 'br-dark': 'var( --el-border-color-dark)',
  34. fill: 'var(--el-fill-color)',
  35. 'fill-light': 'var(--el-fill-color-light)',
  36. 'fill-lighter': 'var(--el-fill-color-lighter)',
  37. mask: 'var(--el-mask-color)',
  38. },
  39. boxShadow: {
  40. DEFAULT: 'var(--el-box-shadow)',
  41. light: 'var(--el-box-shadow-light)',
  42. lighter: 'var(--el-box-shadow-lighter)',
  43. dark: 'var(--el-box-shadow-dark)',
  44. },
  45. },
  46. fontFamily: {
  47. sans: ['PingFang SC', 'Arial', 'Hiragino Sans GB', 'Microsoft YaHei', 'sans-serif'],
  48. },
  49. svg: {
  50. display: 'inline',
  51. 'vertical-align': 'baseline',
  52. },
  53. fontSize: {
  54. xs: 'var(--el-font-size-extra-small)',
  55. sm: 'var( --el-font-size-small)',
  56. base: 'var( --el-font-size-base)',
  57. lg: 'var( --el-font-size-medium)',
  58. xl: 'var( --el-font-size-large)',
  59. '2xl': 'var( --el-font-size-extra-large)',
  60. '3xl': '20px',
  61. '4xl': '24px',
  62. '5xl': '28px',
  63. '6xl': '30px',
  64. '7xl': '36px',
  65. '8xl': '48px',
  66. '9xl': '60px',
  67. },
  68. spacing: {
  69. px: '1px',
  70. 0: '0px',
  71. 0.5: '2px',
  72. 1: '4px',
  73. 1.5: '6px',
  74. 2: '8px',
  75. 2.5: '10px',
  76. 3: '12px',
  77. 3.5: '14px',
  78. 4: '16px',
  79. 5: '20px',
  80. 6: '24px',
  81. 7: '28px',
  82. 8: '32px',
  83. 9: '36px',
  84. 10: '40px',
  85. 11: '44px',
  86. 12: '48px',
  87. 14: '56px',
  88. 16: '64px',
  89. 20: '80px',
  90. 24: '96px',
  91. 28: '112px',
  92. 32: '128px',
  93. 36: '144px',
  94. 40: '160px',
  95. 44: '176px',
  96. 48: '192px',
  97. 52: '208px',
  98. 56: '224px',
  99. 60: '240px',
  100. 64: '256px',
  101. 72: '288px',
  102. 80: '320px',
  103. 96: '384px',
  104. },
  105. lineHeight: {
  106. none: '1',
  107. tight: '1.25',
  108. snug: '1.375',
  109. normal: '1.5',
  110. relaxed: '1.625',
  111. loose: '2',
  112. 3: '12px',
  113. 4: '16px',
  114. 5: '20px',
  115. 6: '24px',
  116. 7: '28px',
  117. 8: '32px',
  118. 9: '36px',
  119. 10: '40px',
  120. },
  121. },
  122. darkMode: 'class', // or 'media' if you prefer system settings
  123. };