rework layout of "create new key" dialog
@@ -136,8 +136,8 @@ export default class AddDialog extends Component {
onRequestClose={this.handleClose}
>
<h1>Creating new {arrayKeyLength ? 'array ' : ''}key at <b>{path}</b></h1>
- <div style={{ display: 'flex', alignItems: 'center' }}>
- <div style={{ flex: 'initial' }}>
+ <div style={{ display: 'flex' }}>
+ <div style={{ flex: 1 }}>
<TextField
ref="nameField"
floatingLabelText="name"
@@ -152,8 +152,7 @@ export default class AddDialog extends Component {
}}
/>
</div>
- </div>
- <div style={{ display: 'block', marginTop: 8 }}>
+ <div style={{ flex: 1 }}>
<SelectField
floatingLabelText="type"
floatingLabelFixed={true}
@@ -168,22 +167,9 @@ export default class AddDialog extends Component {
)}
</SelectField>
</div>
- <div style={{ display: 'block', marginTop: 8 }}>
- <SelectField
- floatingLabelText="visibility"
- floatingLabelFixed={true}
- onFocus={() => !this.state.paused && this.setState({ paused: true })}
- onChange={(e, _, val) => {
- this.setState({ visibility: val, paused: false })
- }}
- value={visibility}
- >
- {Object.keys(VISIBILITY_LEVELS).map(lvl =>
- <MenuItem key={lvl} value={lvl} primaryText={lvl} />
- )}
- </SelectField>
</div>
- <div style={{ display: 'block', marginTop: 8 }}>
+ <div style={{ display: 'flex' }}>
+ <div style={{ flex: 1 }}>
{type !== 'enum' && renderField({
value,
meta: { 'check/type': type },
@@ -210,6 +196,22 @@ export default class AddDialog extends Component {
</div>
)}
</div>
+ <div style={{ flex: 1 }}>
+ <SelectField
+ floatingLabelText="visibility"
+ floatingLabelFixed={true}
+ onFocus={() => !this.state.paused && this.setState({ paused: true })}
+ onChange={(e, _, val) => {
+ this.setState({ visibility: val, paused: false })
+ }}
+ value={visibility}
+ >
+ {Object.keys(VISIBILITY_LEVELS).map(lvl =>
+ <MenuItem key={lvl} value={lvl} primaryText={lvl} />
+ )}
+ </SelectField>
+ </div>
+ </div>
</FocusTrapDialog>
)
}
