Sebastian Krüger 908e6caaf8 feat: enhance mobile responsiveness with collapsible controls and automation/effects bars
Added comprehensive mobile support for Phase 15 (Polish & Optimization):

**Mobile Layout Enhancements:**
- Track controls now collapsible on mobile with two states:
  - Collapsed: minimal controls with expand chevron, R/M/S buttons, horizontal level meter
  - Expanded: full height fader, pan control, all buttons
- Track collapse buttons added to mobile view (left chevron for track collapse, right chevron for control collapse)
- Master controls collapse button hidden on desktop (lg:hidden)
- Automation and effects bars now available on mobile layout
- Both bars collapsible with eye/eye-off icons, horizontally scrollable when zoomed
- Mobile vertical stacking: controls → waveform → automation → effects per track

**Bug Fixes:**
- Fixed track controls and waveform container height matching on desktop
- Fixed Modal component prop: isOpen → open in all dialog components
- Fixed TypeScript null check for audioBuffer.duration
- Fixed keyboard shortcut category: 'help' → 'view'

**Technical Improvements:**
- Consistent height calculation using trackHeight variable
- Proper responsive breakpoints with Tailwind (sm:640px, lg:1024px)
- Progressive disclosure pattern for mobile controls

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-19 20:50:44 +01:00

Audio UI

A sophisticated browser-only audio editor built with Next.js 16, React 19, and Tailwind CSS 4.

Features (Planned)

  • 100% Client-Side: All audio processing happens in your browser
  • Multi-Track Editing: Professional multi-track audio editing
  • Advanced Effects: EQ, compression, reverb, delay, and more
  • Automation: Automate volume, pan, and effect parameters
  • Recording: Record audio directly from your microphone
  • Analysis Tools: Frequency analyzer, spectrogram, and loudness metering
  • Export Formats: WAV, MP3, OGG, FLAC
  • Project Management: Save and load complete projects
  • Privacy-First: No uploads, all data stays local in your browser

Tech Stack

  • Next.js 16 with React 19
  • TypeScript 5
  • Tailwind CSS 4 with OKLCH colors
  • Web Audio API for audio processing
  • Canvas API for waveform visualization
  • IndexedDB for project storage

Getting Started

This project is currently in the planning phase. See PLAN.md for the complete implementation plan.

Development (Coming Soon)

# Install dependencies
pnpm install

# Run development server
pnpm dev

# Build for production
pnpm build

Inspiration

Inspired by AudioMass and professional DAWs like Ableton Live, Logic Pro, and FL Studio.

License

TBD

Contributing

This is a personal project, but suggestions and ideas are welcome!

Description
No description provided
Readme 2.4 MiB
Languages
TypeScript 98.8%
CSS 1.1%
Dockerfile 0.1%