Просмотр исходного кода

Skip objects modal overflow

Modal now has max height (85vh) with scrollable object list when printing many items on the bed

Closes #134
maziggy 4 месяцев назад
Родитель
Сommit
ea570a12f5
2 измененных файлов с 6 добавлено и 5 удалено
  1. 1 0
      CHANGELOG.md
  2. 5 5
      frontend/src/pages/PrintersPage.tsx

+ 1 - 0
CHANGELOG.md

@@ -31,6 +31,7 @@ All notable changes to Bambuddy will be documented in this file.
 
 ### Fixed
 - **Print time stats using slicer estimates** - Quick Stats "Print Time" now uses actual elapsed time (`completed_at - started_at`) instead of slicer estimates; cancelled prints only count time actually printed (Issue #137)
+- **Skip objects modal overflow** - Modal now has max height (85vh) with scrollable object list when printing many items on the bed (Issue #134)
 - **Filament cost using wrong default** - Statistics now correctly uses the "Default filament cost (per kg)" setting instead of hardcoded €25 value (Issue #120)
 - **Spoolman tag field not auto-created** - The required "tag" extra field is now automatically created in Spoolman on first connect, fixing sync failures for fresh Spoolman installs (Issue #123)
 - **P2S/X1E/H2 completion photo not captured** - Internal model codes (N7, C13, O1D, etc.) from MQTT/SSDP are now recognized for RTSP camera support (Issue #127)

+ 5 - 5
frontend/src/pages/PrintersPage.tsx

@@ -2684,7 +2684,7 @@ function PrinterCard({
           <div className="absolute inset-0 bg-black/50 z-0" />
           {/* Modal */}
           <div
-            className="relative z-10 bg-white dark:bg-bambu-dark border border-gray-200 dark:border-bambu-dark-tertiary rounded-xl shadow-2xl w-[560px] overflow-hidden"
+            className="relative z-10 bg-white dark:bg-bambu-dark border border-gray-200 dark:border-bambu-dark-tertiary rounded-xl shadow-2xl w-[560px] max-h-[85vh] flex flex-col overflow-hidden"
             onClick={(e) => e.stopPropagation()}
           >
           {/* Header */}
@@ -2711,7 +2711,7 @@ function PrinterCard({
               <p className="text-xs mt-1 opacity-70">Objects are loaded when a print starts</p>
             </div>
           ) : (
-            <div className="flex flex-col">
+            <div className="flex flex-col overflow-hidden">
               {/* Info Banner */}
               <div className="flex items-center gap-3 px-4 py-2.5 bg-blue-50 dark:bg-blue-500/10 border-b border-gray-200 dark:border-bambu-dark-tertiary">
                 <div className="flex-shrink-0 w-8 h-8 rounded-lg bg-blue-100 dark:bg-blue-500/20 flex items-center justify-center">
@@ -2737,9 +2737,9 @@ function PrinterCard({
               )}
 
               {/* Content: Image + List side by side */}
-              <div className="flex">
+              <div className="flex flex-1 overflow-hidden">
                 {/* Left: Preview Image with object markers */}
-                <div className="w-52 flex-shrink-0 p-4 border-r border-gray-200 dark:border-bambu-dark-tertiary bg-gray-50 dark:bg-bambu-dark-secondary">
+                <div className="w-52 flex-shrink-0 p-4 border-r border-gray-200 dark:border-bambu-dark-tertiary bg-gray-50 dark:bg-bambu-dark-secondary overflow-y-auto">
                   <div className="relative">
                     {status?.cover_url ? (
                       <img
@@ -2824,7 +2824,7 @@ function PrinterCard({
                 </div>
 
                 {/* Right: Object List with prominent IDs */}
-                <div className="flex-1 min-w-0">
+                <div className="flex-1 min-w-0 overflow-y-auto">
                   {objectsData.objects.map((obj) => (
                     <div
                       key={obj.id}