From 9603daa5ceca1360260ce3d8dc0734e3d0398f7b Mon Sep 17 00:00:00 2001
From: JSC <jschoisy@carea5.com>
Date: Wed, 3 Sep 2025 16:45:34 +0200
Subject: [PATCH] refactor: remove noPadding prop from AppLayout and simplify
 class names in SequencerCanvas

---
 src/components/AppLayout.tsx                 |  5 ++---
 src/components/sequencer/SequencerCanvas.tsx | 10 +++++-----
 2 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/components/AppLayout.tsx b/src/components/AppLayout.tsx
index 352e2b7..a1fde25 100644
--- a/src/components/AppLayout.tsx
+++ b/src/components/AppLayout.tsx
@@ -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>
diff --git a/src/components/sequencer/SequencerCanvas.tsx b/src/components/sequencer/SequencerCanvas.tsx
index fcf8ea2..f04f11e 100644
--- a/src/components/sequencer/SequencerCanvas.tsx
+++ b/src/components/sequencer/SequencerCanvas.tsx
@@ -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}