feat: Enhance controls panel with modern scrollbar and mouse wheel support

thumbnail_editor.py

@@ -197,10 +197,56 @@ class ModernThumbnailEditor:
         self.update_canvas_frame(0)
         
     def setup_controls_panel(self, parent):
-        """Setup the right panel controls with modern design"""
+        """Setup the right panel controls with modern design and scrollbar"""
-        # Scroll container for controls
+        # Create main container
-        scroll_frame = tk.Frame(parent, bg=self.colors['bg_secondary'])
+        main_container = tk.Frame(parent, bg=self.colors['bg_secondary'])
-        scroll_frame.pack(fill="both", expand=True, padx=20, pady=20)
+        main_container.pack(fill="both", expand=True, padx=10, pady=10)
+        
+        # Create canvas for scrolling
+        self.controls_canvas = tk.Canvas(main_container, bg=self.colors['bg_secondary'], 
+                                        highlightthickness=0, bd=0)
+        
+        # Create scrollbar with modern styling
+        scrollbar = tk.Scrollbar(main_container, orient="vertical", 
+                                command=self.controls_canvas.yview,
+                                bg=self.colors['bg_tertiary'],
+                                activebackground=self.colors['accent_blue'],
+                                troughcolor=self.colors['bg_primary'],
+                                width=12, relief="flat", bd=0)
+        
+        # Create scrollable frame
+        self.scrollable_frame = tk.Frame(self.controls_canvas, bg=self.colors['bg_secondary'])
+        
+        # Create window in canvas first
+        canvas_window = self.controls_canvas.create_window((0, 0), window=self.scrollable_frame, anchor="nw")
+        
+        # Configure scrolling with better update handling
+        def configure_scroll_region(event):
+            self.controls_canvas.configure(scrollregion=self.controls_canvas.bbox("all"))
+            
+        self.scrollable_frame.bind("<Configure>", configure_scroll_region)
+        
+        # Update canvas width when it's resized
+        def on_canvas_configure(event):
+            self.controls_canvas.itemconfig(canvas_window, width=event.width)
+            
+        self.controls_canvas.bind("<Configure>", on_canvas_configure)
+        self.controls_canvas.configure(yscrollcommand=scrollbar.set)
+        
+        # Pack scrollbar and canvas
+        scrollbar.pack(side="right", fill="y")
+        self.controls_canvas.pack(side="left", fill="both", expand=True)
+        
+        # Bind mouse wheel to canvas
+        self.controls_canvas.bind("<MouseWheel>", self._on_mousewheel)
+        self.scrollable_frame.bind("<MouseWheel>", self._on_mousewheel)
+        
+        # Also bind to main container for better coverage
+        main_container.bind("<MouseWheel>", self._on_mousewheel)
+        
+        # Add padding container inside scrollable frame
+        scroll_frame = tk.Frame(self.scrollable_frame, bg=self.colors['bg_secondary'])
+        scroll_frame.pack(fill="both", expand=True, padx=10, pady=10)
         
         # Title
         controls_title = tk.Label(scroll_frame, text="🎨 Editing Tools", 
@@ -217,6 +263,12 @@ class ModernThumbnailEditor:
         # Export Card
         self.create_export_card(scroll_frame)
         
+        # Bind mousewheel to all widgets in the scroll frame
+        self.bind_mousewheel_to_widget(scroll_frame)
+        
+        # Ensure canvas starts at top
+        self.controls_canvas.yview_moveto(0)
+        
     def create_text_tools_card(self, parent):
         """Create modern text tools card"""
         text_card = self.create_modern_card(parent, "✍️ Text Tools")
@@ -350,6 +402,25 @@ class ModernThumbnailEditor:
                                             self.colors['accent_red'], self.close_editor)
         close_btn.pack(fill="x")
         
+    def _on_mousewheel(self, event):
+        """Handle mouse wheel scrolling with cross-platform support"""
+        # Check if there's content to scroll
+        if self.controls_canvas.winfo_exists():
+            # Windows
+            if event.delta:
+                self.controls_canvas.yview_scroll(int(-1*(event.delta/120)), "units")
+            # Linux
+            elif event.num == 4:
+                self.controls_canvas.yview_scroll(-1, "units")
+            elif event.num == 5:
+                self.controls_canvas.yview_scroll(1, "units")
+                
+    def bind_mousewheel_to_widget(self, widget):
+        """Recursively bind mousewheel to widget and all its children"""
+        widget.bind("<MouseWheel>", self._on_mousewheel)
+        for child in widget.winfo_children():
+            self.bind_mousewheel_to_widget(child)
+        
     def create_modern_card(self, parent, title):
         """Create a modern card container"""
         card_frame = tk.Frame(parent, bg=self.colors['bg_tertiary'], relief="flat", bd=0)