This commit implements a complete responsive design overhaul making the Supervisor UI fully mobile-friendly and beautiful across all devices (320px phones to 4K displays).
## Phase 1: Mobile Navigation
- Add hamburger menu to Navbar with slide-out drawer
- Auto-close on navigation with body scroll lock
- Responsive logo sizing
## Phase 2: Touch-Friendly Buttons
- Increase touch targets to 44px on mobile (36px for small buttons)
- Add responsive button layouts in ProcessCard
- Flex-wrap prevents cramped button rows
## Phase 3: Responsive Spacing & Typography
- Add responsive padding to Card components (p-4 md:p-6)
- Scale typography across breakpoints (text-xl md:text-2xl)
- Responsive spacing in AppLayout and all pages
## Phase 4: Mobile-Friendly Tables
- Dual layout for ConfigTable: table on desktop, cards on mobile
- Preserve all data with proper formatting and wrapping
- Hide table on mobile, show card-based layout
## Phase 5: Modal Improvements
- Add horizontal padding (p-4) to all modals
- Prevent edge-touching on mobile devices
- Fixed SignalSender, KeyboardShortcutsHelp, StdinInput modals
## Phase 6: Page-Specific Layouts
- Processes page: responsive header, controls, and grid spacing
- BatchActions bar: full-width on mobile, centered on desktop
- Logs page: responsive controls and height calculations
- Config page: responsive header and error states
## Phase 7: Polish & Final Touches
- Add viewport meta tag to layout
- Responsive empty states and loading skeletons
- Consistent responsive sizing across all error messages
- Mobile-first typography scaling
🎉 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Features added:
- Send Unix signals to processes via interactive modal
- Support for common signals (HUP, INT, TERM, KILL, USR1, USR2, QUIT)
- Custom signal input for advanced use cases
- Safety confirmations for dangerous signals (TERM, KILL, QUIT)
- Signal button added to each ProcessCard
Implementation details:
- Created signal API routes:
- /api/supervisor/processes/[name]/signal - Send signal to process
- /api/supervisor/groups/[name]/signal - Send signal to group
- /api/supervisor/processes/signal-all - Send signal to all processes
- Added React Query hooks:
- useSignalProcess() - Send signal to single process
- useSignalProcessGroup() - Send signal to process group
- useSignalAllProcesses() - Send signal to all processes
- Created SignalSender modal component:
- Grid of common signal buttons with descriptions
- Custom signal text input (auto-uppercase)
- Two-step confirmation for dangerous signals
- Visual warning with AlertTriangle icon
- Destructive button variant for confirmed dangerous signals
- Backdrop blur overlay
ProcessCard enhancements:
- Added Zap icon signal button
- Modal opens on signal button click
- Button disabled when process is stopped
- Modal integrates with useSignalProcess hook
Common signals with descriptions:
- HUP (1): Reload configuration
- INT (2): Interrupt - graceful shutdown
- QUIT (3): Quit
- TERM (15): Terminate - graceful shutdown (dangerous)
- KILL (9): Kill - immediate termination (dangerous)
- USR1 (10): User-defined signal 1
- USR2 (12): User-defined signal 2
Safety features:
- Dangerous signals require confirmation
- Warning message explains risks
- Button changes to destructive variant
- Custom signals also checked for danger
- Clear visual feedback during operation
Phase 7 complete (3-4 hours estimated)
