refactor: remove noPadding prop from AppLayout and simplify class names in SequencerCanvas

This commit is contained in:
JSC
2025-09-03 16:45:34 +02:00
parent 2ec58ea268
commit 9603daa5ce
2 changed files with 7 additions and 8 deletions

View File

@@ -24,10 +24,9 @@ interface AppLayoutProps {
href?: string
}>
}
noPadding?: boolean
}
export function AppLayout({ children, breadcrumb, noPadding = false }: AppLayoutProps) {
export function AppLayout({ children, breadcrumb }: AppLayoutProps) {
const [playerDisplayMode, setPlayerDisplayMode] = useState<PlayerDisplayMode>(
() => {
// Initialize from localStorage or default to 'normal'
@@ -78,7 +77,7 @@ export function AppLayout({ children, breadcrumb, noPadding = false }: AppLayout
)}
</div>
</header>
<div className={`flex flex-1 flex-col ${noPadding ? '' : 'gap-4 p-4 pt-0'}`}>{children}</div>
<div className="flex flex-1 flex-col gap-4 p-4 pt-0">{children}</div>
</SidebarInset>
<Player onPlayerModeChange={setPlayerDisplayMode} />
</SidebarProvider>

View File

@@ -235,18 +235,18 @@ export const SequencerCanvas = forwardRef<HTMLDivElement, SequencerCanvasProps>(
}
return (
<div ref={setCanvasDropRef} className="h-full w-full flex flex-col overflow-hidden">
<div ref={setCanvasDropRef} className="h-full flex flex-col overflow-hidden">
{/* Time ruler */}
<div className="h-8 bg-muted/50 border-b border-border/50 flex-shrink-0 overflow-hidden">
<div
ref={timelineRef}
className="h-full w-full overflow-x-auto [&::-webkit-scrollbar]:hidden"
className="h-full overflow-x-auto [&::-webkit-scrollbar]:hidden"
style={{
scrollbarWidth: 'none',
msOverflowStyle: 'none'
}}
>
<div className="relative h-full w-full" style={{ minWidth: `${totalWidth}px` }}>
<div className="relative h-full" style={{ width: `${totalWidth}px` }}>
{Array.from({ length: Math.ceil(duration) + 1 }).map((_, i) => (
<div key={i} className="absolute top-0 bottom-0" style={{ left: `${i * zoom}px` }}>
{/* Time markers */}
@@ -278,10 +278,10 @@ export const SequencerCanvas = forwardRef<HTMLDivElement, SequencerCanvasProps>(
{/* Tracks */}
<div
ref={ref}
className="flex-1 w-full overflow-auto"
className="flex-1 overflow-auto"
onScroll={handleTracksScroll}
>
<div style={{ minWidth: `${totalWidth}px`, paddingBottom: '52px' }}>
<div style={{ width: `${totalWidth}px`, paddingBottom: '52px' }}>
{tracks.map((track) => (
<TrackRow
key={track.id}