Complete redesign of metronome controls popup based on user requirements:
UI Changes:
- Added Play/Stop buttons at top for clear playback control
- Replaced BPM slider with dropdown (40-300, steps of 4)
- Reorganized layout: labels on left, controls on right
- Moved Close button to bottom center
- Removed Apply button - changes apply in real-time when playing
Functionality:
- Play button starts metronome with current settings
- Stop button stops metronome playback
- All control changes (sound, tempo, meter) apply immediately when playing
- Metronome track initializes on open but remains silent until Play is clicked
- Improved visual hierarchy and spacing
CSS Updates:
- New playback controls styling with hover states
- Form grid layout for aligned labels/controls
- Enhanced button and dropdown styling with better focus states
- Cleaner, more modern appearance
Tests:
- All 3 existing tests still pass
- UI improvements don't break test selectors
- Metronome track appears correctly on open
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
a2be53bc0d