107 lines
3.7 KiB
TypeScript
107 lines
3.7 KiB
TypeScript
![]() |
import type { Config } from 'tailwindcss'
|
||
|
|
||
|
export const NiceTailwindConfig: Config = {
|
||
|
content: [
|
||
|
"./index.html",
|
||
|
"./src/**/*.{js,ts,jsx,tsx}",
|
||
|
],
|
||
|
theme: {
|
||
|
extend: {
|
||
|
colors: {
|
||
|
// 主色调 - 空军蓝
|
||
|
primary: {
|
||
|
50: '#e8f2ff',
|
||
|
100: '#c5d9f7',
|
||
|
200: '#9fc0ef',
|
||
|
300: '#78a7e7',
|
||
|
400: '#528edf',
|
||
|
500: '#00308a',
|
||
|
600: '#00256b',
|
||
|
700: '#001a4c',
|
||
|
800: '#000f2d',
|
||
|
900: '#00040e',
|
||
|
DEFAULT: '#00308a',
|
||
|
},
|
||
|
// 辅助色 - 军事灰
|
||
|
secondary: {
|
||
|
50: '#f5f5f5',
|
||
|
100: '#e0e0e0',
|
||
|
200: '#c2c2c2',
|
||
|
300: '#a3a3a3',
|
||
|
400: '#858585',
|
||
|
500: '#666666',
|
||
|
600: '#4d4d4d',
|
||
|
700: '#333333',
|
||
|
800: '#1a1a1a',
|
||
|
900: '#0d0d0d',
|
||
|
DEFAULT: '#4d4d4d',
|
||
|
},
|
||
|
// 强调色 - 军徽金
|
||
|
accent: {
|
||
|
50: '#fff8e5',
|
||
|
100: '#ffecb3',
|
||
|
200: '#ffe080',
|
||
|
300: '#ffd44d',
|
||
|
400: '#ffc81a',
|
||
|
500: '#e6b400',
|
||
|
600: '#b38f00',
|
||
|
700: '#806a00',
|
||
|
800: '#4d4000',
|
||
|
900: '#1a1500',
|
||
|
DEFAULT: '#e6b400',
|
||
|
},
|
||
|
// 功能色
|
||
|
success: '#28a745',
|
||
|
warning: '#ffc107',
|
||
|
danger: '#dc3545',
|
||
|
info: '#17a2b8',
|
||
|
},
|
||
|
fontFamily: {
|
||
|
sans: ['Inter', 'sans-serif'],
|
||
|
heading: ['Bebas Neue', 'sans-serif'],
|
||
|
mono: ['Source Code Pro', 'monospace'],
|
||
|
},
|
||
|
spacing: {
|
||
|
'72': '18rem',
|
||
|
'84': '21rem',
|
||
|
'96': '24rem',
|
||
|
},
|
||
|
borderRadius: {
|
||
|
'xl': '1rem',
|
||
|
'2xl': '2rem',
|
||
|
'3xl': '3rem',
|
||
|
},
|
||
|
boxShadow: {
|
||
|
'outline': '0 0 0 3px rgba(0, 48, 138, 0.5)',
|
||
|
'solid': '2px 2px 0 0 rgba(0, 0, 0, 0.2)',
|
||
|
'glow': '0 0 8px rgba(230, 180, 0, 0.8)',
|
||
|
'inset': 'inset 0 2px 4px 0 rgba(0, 0, 0, 0.15)',
|
||
|
'elevation-1': '0 1px 2px 0 rgba(0, 0, 0, 0.1)',
|
||
|
'elevation-2': '0 2px 4px 0 rgba(0, 0, 0, 0.15)',
|
||
|
'elevation-3': '0 4px 8px 0 rgba(0, 0, 0, 0.2)',
|
||
|
'elevation-4': '0 8px 16px 0 rgba(0, 0, 0, 0.25)',
|
||
|
'elevation-5': '0 16px 32px 0 rgba(0, 0, 0, 0.3)',
|
||
|
'panel': '0 4px 6px -1px rgba(0, 48, 138, 0.1), 0 2px 4px -2px rgba(0, 48, 138, 0.1)',
|
||
|
'button': '0 2px 4px rgba(0, 48, 138, 0.2), inset 0 1px 2px rgba(255, 255, 255, 0.1)',
|
||
|
'card': '0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08)',
|
||
|
'modal': '0 8px 32px rgba(0, 0, 0, 0.2), 0 4px 16px rgba(0, 0, 0, 0.15)',
|
||
|
},
|
||
|
animation: {
|
||
|
'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite',
|
||
|
'spin-slow': 'spin 3s linear infinite',
|
||
|
},
|
||
|
transitionDuration: {
|
||
|
'2000': '2000ms',
|
||
|
'3000': '3000ms',
|
||
|
},
|
||
|
screens: {
|
||
|
'3xl': '1920px',
|
||
|
'4xl': '2560px',
|
||
|
},
|
||
|
},
|
||
|
},
|
||
|
plugins: [
|
||
|
|
||
|
],
|
||
|
}
|