init5

app/tailwind.config.js

@@ -0,0 +1,127 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: [
+    './components/**/*.{js,vue,ts}',
+    './layouts/**/*.vue',
+    './pages/**/*.vue',
+    './plugins/**/*.{js,ts}',
+    './app.vue',
+    './error.vue',
+    './assets/css/**/*.css',
+    './types/**/*.ts',
+  ],
+  theme: {
+    extend: {
+      // 自定义主题扩展
+      colors: {
+        primary: {
+          50: '#eff6ff',
+          100: '#dbeafe',
+          200: '#bfdbfe',
+          300: '#93c5fd',
+          400: '#60a5fa',
+          500: '#3b82f6',
+          600: '#2563eb',
+          700: '#1d4ed8',
+          800: '#1e40af',
+          900: '#1e3a8a',
+        },
+      },
+      fontFamily: {
+        sans: ['Inter', 'ui-sans-serif', 'system-ui'],
+      },
+      spacing: {
+        18: '4.5rem',
+        88: '22rem',
+      },
+      backgroundImage: {
+        Tile2: "url('/images/Tile2.png')",
+        'footer-texture': "url('/images/footer-texture.png')",
+      },
+    },
+  },
+  plugins: [
+    // 可以在这里添加Tailwind插件
+    // require('@tailwindcss/forms'),
+    // require('@tailwindcss/typography'),
+    function ({ addUtilities }) {
+      addUtilities({
+        '.vertical-rl': {
+          'writing-mode': 'vertical-rl',
+        },
+        '.upright': {
+          'text-orientation': 'upright',
+        },
+      })
+    },
+  ],
+  // 添加对自定义工具类的支持
+  safelist: [
+    // 自定义工具类
+    'vertical-rl',
+    'upright',
+
+    // 九宫格边框相关类
+    'nine-slice',
+    'nine-slice-no-fill',
+    'nine-slice-animated',
+    'frame-border2',
+
+    // 大屏看板相关类
+    'dashboard-container',
+    'dashboard-grid',
+    'dashboard-grid-2x2',
+    'dashboard-grid-3x3',
+    'dashboard-grid-4x4',
+    'dashboard-card',
+    'dashboard-card-highlight',
+    'dashboard-card-warning',
+    'dashboard-card-danger',
+    'dashboard-title',
+    'dashboard-subtitle',
+    'dashboard-metric-title',
+    'dashboard-metric-large',
+    'dashboard-metric-medium',
+    'dashboard-metric-small',
+    'dashboard-metric-trend-up',
+    'dashboard-metric-trend-down',
+    'chart-container',
+    'chart-container-large',
+    'chart-container-small',
+    'dashboard-progress',
+    'dashboard-progress-bar',
+    'dashboard-progress-bar-success',
+    'dashboard-progress-bar-warning',
+    'dashboard-progress-bar-danger',
+    'status-indicator',
+    'status-online',
+    'status-offline',
+    'status-warning',
+    'status-dot',
+    'status-dot-online',
+    'status-dot-offline',
+    'status-dot-warning',
+    'dashboard-fade-in',
+    'dashboard-slide-up',
+    'dashboard-scale-in',
+    'animate-fade-in',
+    'animate-slide-up',
+    'animate-scale-in',
+    'dashboard-table',
+    'dashboard-scrollbar',
+    'dashboard-fullscreen',
+    'dashboard-split-horizontal',
+    'dashboard-split-vertical',
+    'dashboard-align-top',
+    'dashboard-align-bottom',
+    'dashboard-align-left',
+    'dashboard-align-right',
+
+    // 背景相关类
+    'bg-flex-center',
+    'crud-container',
+    'crud-header',
+    'crud-table',
+    'crud-form',
+  ],
+}