valknar/audio-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: automation header controls now properly inline without overlapping

Browse Source 
- Removed absolute positioning from eye icon button
- Made all controls part of normal flex flow
- Eye button now correctly positioned at end without overlap
- Chevron controls no longer overlay the eye icon

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Sebastian Krüger
2025-11-19 18:03:41 +01:00
parent adb99a2c33
commit 42991092ad
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
components/tracks/TrackList.tsx
View File

@@ -432,7 +432,7 @@ export function TrackList({
return ( return (
<div className="flex-shrink-0 bg-card/90 backdrop-blur-sm"> <div className="flex-shrink-0 bg-card/90 backdrop-blur-sm">
{/* Automation Header - Single Bar */} {/* Automation Header - Single Bar */}
<div className="relative flex items-center gap-2 px-3 py-1.5 bg-muted border-t border-b border-border/30"> <div className="flex items-center gap-2 px-3 py-1.5 bg-muted border-t border-b border-border/30">
<span className="text-xs font-medium flex-shrink-0">Automation</span> <span className="text-xs font-medium flex-shrink-0">Automation</span>
{/* Color indicator */} {/* Color indicator */}
@@ -540,7 +540,7 @@ export function TrackList({
</> </>
)} )}
{/* Show/hide toggle - Positioned absolutely on the right */} {/* Show/hide toggle - Part of normal flow */}
<Button <Button
variant="ghost" variant="ghost"
size="icon-sm" size="icon-sm"
@@ -548,7 +548,7 @@ export function TrackList({
onUpdateTrack(track.id, { automationExpanded: !track.automationExpanded }); onUpdateTrack(track.id, { automationExpanded: !track.automationExpanded });
}} }}
title={track.automationExpanded ? 'Hide automation controls' : 'Show automation controls'} title={track.automationExpanded ? 'Hide automation controls' : 'Show automation controls'}
className="absolute right-2 h-5 w-5 flex-shrink-0" className="h-5 w-5 flex-shrink-0"
> >
{track.automationExpanded ? ( {track.automationExpanded ? (
<Eye className="h-3 w-3" /> <Eye className="h-3 w-3" />