root/spritesheet-generator
2
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FEAT] Improved UI

Browse Source
This commit is contained in:
root
2026-01-01 00:47:28 +01:00
parent 784c95555f
commit 89d369598f
19 changed files with 1192 additions and 976 deletions
Download Patch File Download Diff File Expand all files Collapse all files

140
tailwind.config.js
View File

@@ -6,62 +6,154 @@ export default {
extend: {
colors: {
gray: {
900: '#111827', // bg-primary
800: '#1F2937', // bg-secondary
700: '#374151', // bg-tertiary
600: '#4B5563', // border
400: '#9CA3AF', // text-secondary
200: '#E5E7EB', // text-primary
50: '#fafafa',
100: '#f4f4f5',
200: '#e4e4e7', // border-light
300: '#d4d4d8',
400: '#a1a1aa', // text-secondary
500: '#71717a',
600: '#52525b', // border-dark
700: '#3f3f46',
800: '#27272a', // bg-secondary
900: '#18181b', // bg-primary
950: '#09090b', // bg-deep
},
blue: {
500: '#3B82F6', // accent
600: '#2563EB', // accent-hover
primary: {
50: '#eff6ff',
100: '#dbeafe',
200: '#bfdbfe',
300: '#93c5fd',
400: '#60a5fa',
500: '#3b82f6', // accent
600: '#2563eb', // accent-hover
700: '#1d4ed8',
800: '#1e40af',
900: '#1e3a8a',
950: '#172554',
},
red: {
500: '#EF4444', // danger
600: '#DC2626', // danger-hover
d: {
50: '#fef2f2',
100: '#fee2e2',
200: '#fecaca',
300: '#fca5a5',
400: '#f87171',
500: '#ef4444',
600: '#dc2626',
700: '#b91c1c',
800: '#991b1b',
900: '#7f1d1d',
950: '#450a0a',
},
green: {
500: '#10B981', // success
600: '#059669', // success-hover
s: {
50: '#f0fdf4',
100: '#dcfce7',
200: '#bbf7d0',
300: '#86efac',
400: '#4ade80',
500: '#22c55e',
600: '#16a34a',
700: '#15803d',
800: '#166534',
900: '#14532d',
950: '#052e16',
}
},
boxShadow: {
'soft': '0 2px 15px -3px rgba(0, 0, 0, 0.07), 0 10px 20px -2px rgba(0, 0, 0, 0.04)',
'glass': '0 8px 32px 0 rgba(0, 0, 0, 0.08)',
'glow': '0 0 15px rgba(59, 130, 246, 0.5)',
},
fontFamily: {
sans: [
'Inter',
'ui-sans-serif',
'system-ui',
'-apple-system',
'BlinkMacSystemFont',
'"Segoe UI"',
'Roboto',
'"Helvetica Neue"',
'Arial',
'"Noto Sans"',
'sans-serif',
'"Apple Color Emoji"',
'"Segoe UI Emoji"',
'"Segoe UI Symbol"',
'"Noto Color Emoji"'
],
mono: [
'ui-monospace',
'SFMono-Regular',
'Menlo',
'Monaco',
'Consolas',
'"Liberation Mono"',
'"Courier New"',
'monospace'
],
},
typography: (theme) => ({
DEFAULT: {
css: {
maxWidth: 'none',
color: theme('colors.gray.700'),
a: {
color: theme('colors.primary.600'),
'&:hover': {
color: theme('colors.primary.500'),
},
},
h1: {
color: theme('colors.gray.900'),
letterSpacing: '-0.025em',
},
h2: {
color: theme('colors.gray.900'),
letterSpacing: '-0.025em',
},
h3: {
color: theme('colors.gray.900'),
},
h4: {
color: theme('colors.gray.900'),
},
code: {
color: theme('colors.primary.600'),
backgroundColor: theme('colors.gray.100'),
borderRadius: '0.25rem',
paddingLeft: '0.25rem',
paddingRight: '0.25rem',
},
},
},
dark: {
css: {
color: theme('colors.gray.200'),
color: theme('colors.gray.300'),
a: {
color: theme('colors.blue.500'),
color: theme('colors.primary.400'),
'&:hover': {
color: theme('colors.blue.400'),
color: theme('colors.primary.300'),
},
},
h1: {
color: theme('colors.gray.200'),
color: theme('colors.gray.50'),
},
h2: {
color: theme('colors.gray.200'),
color: theme('colors.gray.50'),
},
h3: {
color: theme('colors.gray.200'),
color: theme('colors.gray.100'),
},
h4: {
color: theme('colors.gray.200'),
color: theme('colors.gray.100'),
},
code: {
color: theme('colors.gray.200'),
color: theme('colors.primary.300'),
backgroundColor: theme('colors.gray.800'),
},
pre: {
backgroundColor: theme('colors.gray.800'),
backgroundColor: theme('colors.gray.900'),
},
},
},