21765: changed dialog height and fixed scrolling in project picker
authorLisa Knox <lisaknox83@gmail.com>
Fri, 31 May 2024 18:10:16 +0000 (14:10 -0400)
committerLisa Knox <lisaknox83@gmail.com>
Fri, 31 May 2024 18:10:16 +0000 (14:10 -0400)
Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox@curii.com>

services/workbench2/src/components/form-dialog/form-dialog.tsx
services/workbench2/src/views-components/projects-tree-picker/projects-tree-picker.tsx
services/workbench2/src/views-components/projects-tree-picker/tree-picker-field.tsx

index b50504a6c0b7a7ef4bd8da5bb330a73a18e0406c..719fa57b4c61b918876c03f88e8e888abd6134ca 100644 (file)
@@ -62,6 +62,7 @@ export const FormDialog = withStyles(styles)((props: DialogProjectProps) =>
         disableBackdropClick
         disableEscapeKeyDown={props.submitting}
         fullWidth
+        scroll='paper'
         maxWidth='md'>
         <form data-cy='form-dialog' className={props.classes.form}>
             <DialogTitle className={props.classes.dialogTitle}>
index 16f6cceb71ce44b711c5214157c48ddaff4d3061..743467c79c5cb34c990392dbb4e732a2fce62b9a 100644 (file)
@@ -85,9 +85,9 @@ type CssRules = 'pickerHeight' | 'searchFlex' | 'scrolledBox';
 
 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     pickerHeight: {
-        height: "100%",
         display: "flex",
         flexDirection: "column",
+        overflowY: "auto",
     },
     searchFlex: {
         display: "flex",
index 75cf40c641bbe195e0c8ef02c4c2875d3adbb625..8a0793ac111f0fd068fd2af334747c770eb7e220 100644 (file)
@@ -15,7 +15,7 @@ import { Dispatch } from "redux";
 
 export const ProjectTreePickerField = (props: WrappedFieldProps & PickerIdProp) =>
     <div style={{ display: 'flex', minHeight: 0, flexDirection: 'column' }}>
-        <div style={{ flexBasis: '275px', flexShrink: 1, minHeight: 0, display: 'flex', flexDirection: 'column' }}>
+        <div style={{ flexBasis: '960px', flexShrink: 1, minHeight: 0, display: 'flex', flexDirection: 'column' }}>
             <ProjectsTreePicker
                 pickerId={props.pickerId}
                 toggleItemActive={handleChange(props)}