Fix object images not displaying on quick customization

4ian · Sep 12, 2024 · 8fbd847 · 8fbd847
1 parent ef604fd
commit 8fbd847
Showing 1 changed file with 12 additions and 1 deletion.
diff --git a/newIDE/app/src/QuickCustomization/ObjectPreview.js b/newIDE/app/src/QuickCustomization/ObjectPreview.js
@@ -13,6 +13,7 @@ type Props = {|
   object: gdObject,
 |};
 
+const paddingSize = 10;
 const styles = {
   previewContainer: {
     display: 'flex',
@@ -41,6 +42,12 @@ const styles = {
     ...textEllipsisStyle,
     overflowWrap: 'break-word',
   },
+  previewImage: {
+    position: 'relative',
+    objectFit: 'contain',
+    verticalAlign: 'middle',
+    pointerEvents: 'none',
+  },
 };
 
 export const ObjectPreview = ({ project, object }: Props) => {
@@ -65,7 +72,11 @@ export const ObjectPreview = ({ project, object }: Props) => {
               project,
               object.getConfiguration()
             )}
-            style={{ maxWidth: 120, maxHeight: 120 }}
+            style={{
+              ...styles.previewImage,
+              maxWidth: 128 - 2 * paddingSize,
+              maxHeight: 128 - 2 * paddingSize,
+            }}
           />
         )}
       </div>