tailwind.config.ts 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. /** @type {import('tailwindcss').Config} */
  2. import type { Config } from 'tailwindcss'
  3. export default {
  4. content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
  5. corePlugins: {
  6. preflight: false
  7. },
  8. theme: {
  9. screens: {
  10. mobile: { max: '750px' }, // 最大宽 750
  11. pc: '751px', // 最小宽 751
  12. sm: '640px',
  13. // => @media (min-width: 640px) { ... }
  14. md: '768px',
  15. // => @media (min-width: 768px) { ... }
  16. lg: '1024px',
  17. // => @media (min-width: 1024px) { ... }
  18. xl: '1440px',
  19. // => @media (min-width: 1280px) { ... }
  20. '2xl': '1536px'
  21. // => @media (min-width: 1536px) { ... }
  22. },
  23. // colors: {
  24. // blue: '#1fb6ff',
  25. // pink: '#ff49db',
  26. // orange: '#ff7849',
  27. // green: '#13ce66',
  28. // 'gray-dark': '#273444',
  29. // gray: '#8492a6',
  30. // 'gray-light': '#d3dce6'
  31. // },
  32. extend: {}
  33. },
  34. plugins: []
  35. /*// 这部分 css 需要通过比较复杂的计算得出,所以要用 `safelist` 保证它们出现在最终 css 里
  36. safelist: [
  37. {
  38. pattern: /w-\d+\/\d+/
  39. },
  40. {
  41. pattern: /grid-cols-[5-9]/
  42. }
  43. ]*/
  44. } satisfies Config