fix: always show level meter and increase track height to 180px
Fixed layout issues with the level meter: Track Height: - Increased DEFAULT_TRACK_HEIGHT from 150px to 180px - Ensures enough vertical space for all controls without clipping Level Meter Display: - Now always visible (not conditional on recording state) - Shows "Input" with mic icon when track is armed or recording - Shows "Level" with volume icon when not recording - Displays appropriate level based on state This prevents the meter from being cut off and provides consistent visual feedback for all tracks. Future enhancement: show actual playback output levels when not recording. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -547,21 +547,31 @@ export function Track({
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* Input Level Meter (shown when recording or record-enabled) */}
|
||||
{(track.recordEnabled || isRecording) && (
|
||||
<div className="flex items-center gap-2">
|
||||
<label className="text-xs text-muted-foreground flex items-center gap-1 w-16 flex-shrink-0">
|
||||
<Mic className="h-3 w-3" />
|
||||
Input
|
||||
</label>
|
||||
<div className="flex-1">
|
||||
<InputLevelMeter level={recordingLevel} orientation="horizontal" />
|
||||
</div>
|
||||
<span className="text-xs text-muted-foreground w-10 text-right flex-shrink-0">
|
||||
{Math.round(recordingLevel * 100)}%
|
||||
</span>
|
||||
{/* Level Meter (shows input when recording, output level otherwise) */}
|
||||
<div className="flex items-center gap-2">
|
||||
<label className="text-xs text-muted-foreground flex items-center gap-1 w-16 flex-shrink-0">
|
||||
{track.recordEnabled || isRecording ? (
|
||||
<>
|
||||
<Mic className="h-3 w-3" />
|
||||
Input
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Volume2 className="h-3 w-3" />
|
||||
Level
|
||||
</>
|
||||
)}
|
||||
</label>
|
||||
<div className="flex-1">
|
||||
<InputLevelMeter
|
||||
level={track.recordEnabled || isRecording ? recordingLevel : 0}
|
||||
orientation="horizontal"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
<span className="text-xs text-muted-foreground w-10 text-right flex-shrink-0">
|
||||
{Math.round((track.recordEnabled || isRecording ? recordingLevel : 0) * 100)}%
|
||||
</span>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user