Fixed: Styling issues in Quality Profile and Release Profiles

This commit is contained in:
Qstick 2020-06-29 21:48:02 -04:00
parent 1c1158d74c
commit 21b6d9e2eb
4 changed files with 44 additions and 26 deletions

View file

@ -8,7 +8,16 @@
} }
} }
.inputWrapper {
flex: 1 0 0;
}
.buttonWrapper {
flex: 0 0 22px;
}
.keyInput, .keyInput,
.valueInput { .valueInput {
width: 100%;
border: none; border: none;
} }

View file

@ -63,34 +63,41 @@ class KeyValueListInputItem extends Component {
return ( return (
<div className={styles.itemContainer}> <div className={styles.itemContainer}>
<TextInput <div className={styles.inputWrapper}>
className={styles.keyInput} <TextInput
name="key" className={styles.keyInput}
value={keyValue} name="key"
placeholder={keyPlaceholder} value={keyValue}
onChange={this.onKeyChange} placeholder={keyPlaceholder}
onFocus={this.onFocus} onChange={this.onKeyChange}
onBlur={this.onBlur} onFocus={this.onFocus}
/> onBlur={this.onBlur}
/>
</div>
<TextInput <div className={styles.inputWrapper}>
className={styles.valueInput} <TextInput
name="value" className={styles.valueInput}
value={value} name="value"
placeholder={valuePlaceholder} value={value}
onChange={this.onValueChange} placeholder={valuePlaceholder}
onFocus={this.onFocus} onChange={this.onValueChange}
onBlur={this.onBlur} onFocus={this.onFocus}
/> onBlur={this.onBlur}
/>
</div>
{ <div className={styles.buttonWrapper}>
!isNew && {
<IconButton isNew ?
name={icons.REMOVE} null :
tabIndex={-1} <IconButton
onPress={this.onRemovePress} name={icons.REMOVE}
/> tabIndex={-1}
} onPress={this.onRemovePress}
/>
}
</div>
</div> </div>
); );
} }

View file

@ -48,6 +48,7 @@
composes: buton from '~Components/Link/IconButton.css'; composes: buton from '~Components/Link/IconButton.css';
display: flex; display: flex;
align-items: center;
justify-content: center; justify-content: center;
flex-shrink: 0; flex-shrink: 0;
margin-right: 5px; margin-right: 5px;

View file

@ -74,6 +74,7 @@
composes: buton from '~Components/Link/IconButton.css'; composes: buton from '~Components/Link/IconButton.css';
display: flex; display: flex;
align-items: center;
justify-content: center; justify-content: center;
flex-shrink: 0; flex-shrink: 0;
margin-right: 5px; margin-right: 5px;