doctor-mail/packages/theme/src/tailwind.ts

107 lines
3.7 KiB
TypeScript
Raw Normal View History

2025-01-24 17:37:51 +08:00
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: [
],
}