3259009690
- PO (FileText) and Notes (MessageSquare) inline buttons: w-7 h-7 / w-8 h-8 -> w-6 h-6 with size 11 icons and tighter radius, plus narrower right column gap so the smaller buttons don't sit in stale spacing. - Popover z-index vs next group: add onPopoverChange callback to CollectionItemCard so SupplierGroup / AreaGroup can lift their section from z-10 to z-30 when *any* popover inside is open. Covers both compact (own popover) and detailed (card popover) modes. Active <li> in compact mode also lifts to z-30 so popover paints above sibling rows in the same list. - Header categories on small screens: stats + toggle row now flex-wraps so chips don't overflow; added xs (480px) breakpoint and hid Supplier/Area labels below it to keep tiny phones clean. Status filter chip row already scrolls horizontally. Co-Authored-By: Claude <noreply@anthropic.com> Co-authored-by: Orca <help@stably.ai>
51 lines
1.4 KiB
JavaScript
51 lines
1.4 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
||
module.exports = {
|
||
darkMode: 'class',
|
||
content: [
|
||
'./app/**/*.{js,ts,jsx,tsx,mdx}',
|
||
'./components/**/*.{js,ts,jsx,tsx,mdx}',
|
||
],
|
||
theme: {
|
||
extend: {
|
||
colors: {
|
||
primary: {
|
||
50: '#fff7ed',
|
||
100: '#ffedd5',
|
||
200: '#fed7aa',
|
||
300: '#fdba74',
|
||
400: '#fb923c',
|
||
500: '#f97316',
|
||
600: '#ea580c',
|
||
700: '#c2410c',
|
||
800: '#9a3412',
|
||
900: '#7c2d12',
|
||
},
|
||
},
|
||
spacing: {
|
||
'18': '4.5rem',
|
||
'22': '5.5rem',
|
||
},
|
||
screens: {
|
||
// Tiny phones (320–479px). Default Tailwind starts at `sm`=640px,
|
||
// which leaves the 320–414px band — the smallest screens the
|
||
// app actually ships to — without an in-between breakpoint.
|
||
// `xs` lets us hide labels on those screens while keeping the
|
||
// rest of the layout compact, instead of squeezing everything
|
||
// into a single cramped row.
|
||
xs: '480px',
|
||
},
|
||
animation: {
|
||
'fade-in': 'fadeIn 0.3s ease-out forwards',
|
||
'slide-up': 'slideUp 0.3s ease-out forwards',
|
||
'pulse-slow': 'pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite',
|
||
},
|
||
keyframes: {
|
||
slideUp: {
|
||
'0%': { transform: 'translateY(20px)', opacity: '0' },
|
||
'100%': { transform: 'translateY(0)', opacity: '1' },
|
||
},
|
||
},
|
||
},
|
||
},
|
||
plugins: [],
|
||
};
|