Improve autocomplete options height on mobile (#5709)

newIDE/app/src/ProjectManager/ProjectPropertiesDialog.js

@@ -31,6 +31,7 @@ import { type ResourceManagementProps } from '../ResourcesList/ResourceSource';
 import { type HotReloadPreviewButtonProps } from '../HotReload/HotReloadPreviewButton';
 import PublicGameProperties from '../GameDashboard/PublicGameProperties';
 import PreviewIcon from '../UI/CustomSvgIcons/Preview';
+import { useResponsiveWindowWidth } from '../UI/Reponsive/ResponsiveWindowMeasurer';
 
 type Props = {|
   project: gdProject,
@@ -210,6 +211,9 @@ const ProjectPropertiesDialog = (props: Props) => {
     setUseDeprecatedZeroAsDefaultZOrder,
   ] = React.useState(initialProperties.useDeprecatedZeroAsDefaultZOrder);
 
+  const windowWidth = useResponsiveWindowWidth();
+  const isMobile = windowWidth === 'small';
+
   const defaultPackageName = 'com.example.mygame';
   const defaultVersion = '1.0.0';
 
@@ -302,7 +306,13 @@ const ProjectPropertiesDialog = (props: Props) => {
                 <FlatButton
                   key="hot-reload-preview-button"
                   leftIcon={<PreviewIcon />}
-                  label={<Trans>Run a preview (with loading & branding)</Trans>}
+                  label={
+                    isMobile ? (
+                      <Trans>Preview</Trans>
+                    ) : (
+                      <Trans>Run a preview (with loading & branding)</Trans>
+                    )
+                  }
                   onClick={
                     hotReloadPreviewButtonProps.launchProjectWithLoadingScreenPreview
                   }

newIDE/app/src/UI/Theme/CreateTheme.js

@@ -300,6 +300,10 @@ export function getMuiOverrides({
       paper: {
         backgroundColor: alternateCanvasBackgroundColor,
       },
+      option: {
+        // Avoid the default min-height of 48px, which is too big to display options.
+        minHeight: 35,
+      },
     },
   };
 }