MM-11684 Fix grey highlight in the text fields in user profile (#2034)
* Fix jumpto search highlight * Change background style to be on view and rest of input styles to input
This commit is contained in:
parent
96f967ec56
commit
32e5316817
2 changed files with 55 additions and 52 deletions
|
|
@ -330,6 +330,7 @@ export default class Search extends Component {
|
|||
};
|
||||
|
||||
render() {
|
||||
const {backgroundColor, ...restOfInputPropStyles} = this.props.inputStyle;
|
||||
return (
|
||||
<Animated.View
|
||||
ref='searchContainer'
|
||||
|
|
@ -339,45 +340,47 @@ export default class Search extends Component {
|
|||
]}
|
||||
onLayout={this.onLayout}
|
||||
>
|
||||
<AnimatedTextInput
|
||||
ref='input_keyword'
|
||||
style={[
|
||||
styles.input,
|
||||
this.props.placeholderTextColor && {color: this.props.placeholderTextColor},
|
||||
this.props.inputStyle && this.props.inputStyle,
|
||||
this.props.inputHeight && {height: this.props.inputHeight},
|
||||
this.props.inputBorderRadius && {borderRadius: this.props.inputBorderRadius},
|
||||
{
|
||||
width: this.inputFocusWidthAnimated,
|
||||
paddingLeft: this.inputFocusPlaceholderAnimated,
|
||||
},
|
||||
this.props.shadowVisible && {
|
||||
shadowOffset: {width: this.props.shadowOffsetWidth, height: this.shadowHeight},
|
||||
shadowColor: this.props.shadowColor,
|
||||
shadowOpacity: this.shadowOpacityAnimated,
|
||||
shadowRadius: this.props.shadowRadius,
|
||||
},
|
||||
<View style={{backgroundColor}}>
|
||||
<AnimatedTextInput
|
||||
ref='input_keyword'
|
||||
style={[
|
||||
styles.input,
|
||||
this.props.placeholderTextColor && {color: this.props.placeholderTextColor},
|
||||
this.props.inputHeight && {height: this.props.inputHeight},
|
||||
this.props.inputBorderRadius && {borderRadius: this.props.inputBorderRadius},
|
||||
{
|
||||
width: this.inputFocusWidthAnimated,
|
||||
paddingLeft: this.inputFocusPlaceholderAnimated,
|
||||
},
|
||||
restOfInputPropStyles,
|
||||
this.props.shadowVisible && {
|
||||
shadowOffset: {width: this.props.shadowOffsetWidth, height: this.shadowHeight},
|
||||
shadowColor: this.props.shadowColor,
|
||||
shadowOpacity: this.shadowOpacityAnimated,
|
||||
shadowRadius: this.props.shadowRadius,
|
||||
},
|
||||
|
||||
]}
|
||||
autoFocus={this.props.autoFocus}
|
||||
editable={this.props.editable}
|
||||
value={this.props.value}
|
||||
onChangeText={this.onChangeText}
|
||||
placeholder={this.placeholder}
|
||||
placeholderTextColor={this.props.placeholderTextColor}
|
||||
selectionColor={this.props.selectionColor}
|
||||
onSubmitEditing={this.onSearch}
|
||||
onSelectionChange={this.onSelectionChange}
|
||||
autoCorrect={false}
|
||||
blurOnSubmit={this.props.blurOnSubmit}
|
||||
returnKeyType={this.props.returnKeyType || 'search'}
|
||||
keyboardType={this.props.keyboardType || 'default'}
|
||||
autoCapitalize={this.props.autoCapitalize}
|
||||
onBlur={this.onBlur}
|
||||
onFocus={this.onFocus}
|
||||
underlineColorAndroid='transparent'
|
||||
enablesReturnKeyAutomatically={true}
|
||||
/>
|
||||
]}
|
||||
autoFocus={this.props.autoFocus}
|
||||
editable={this.props.editable}
|
||||
value={this.props.value}
|
||||
onChangeText={this.onChangeText}
|
||||
placeholder={this.placeholder}
|
||||
placeholderTextColor={this.props.placeholderTextColor}
|
||||
selectionColor={this.props.selectionColor}
|
||||
onSubmitEditing={this.onSearch}
|
||||
onSelectionChange={this.onSelectionChange}
|
||||
autoCorrect={false}
|
||||
blurOnSubmit={this.props.blurOnSubmit}
|
||||
returnKeyType={this.props.returnKeyType || 'search'}
|
||||
keyboardType={this.props.keyboardType || 'default'}
|
||||
autoCapitalize={this.props.autoCapitalize}
|
||||
onBlur={this.onBlur}
|
||||
onFocus={this.onFocus}
|
||||
underlineColorAndroid='transparent'
|
||||
enablesReturnKeyAutomatically={true}
|
||||
/>
|
||||
</View>
|
||||
<TouchableWithoutFeedback onPress={this.onFocus}>
|
||||
{((this.props.iconSearch) ?
|
||||
<Animated.View
|
||||
|
|
@ -469,7 +472,6 @@ const styles = StyleSheet.create({
|
|||
paddingBottom: 5,
|
||||
paddingRight: 32,
|
||||
borderColor: '#444',
|
||||
backgroundColor: '#f7f7f7',
|
||||
borderRadius: 5,
|
||||
fontSize: 15,
|
||||
},
|
||||
|
|
@ -504,4 +506,3 @@ const styles = StyleSheet.create({
|
|||
color: '#fff',
|
||||
},
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -66,18 +66,20 @@ export default class AccountSettingsItem extends PureComponent {
|
|||
)}
|
||||
</View>
|
||||
<View style={style.inputContainer}>
|
||||
<QuickTextInput
|
||||
ref={this.channelNameRef}
|
||||
value={value}
|
||||
onChangeText={this.onChangeText}
|
||||
style={[style.input, disabled ? style.disabled : null]}
|
||||
autoCapitalize='none'
|
||||
autoCorrect={false}
|
||||
maxLength={this.props.maxLength}
|
||||
editable={!disabled}
|
||||
underlineColorAndroid='transparent'
|
||||
disableFullscreenUI={true}
|
||||
/>
|
||||
<View style={disabled ? style.disabled : null}>
|
||||
<QuickTextInput
|
||||
ref={this.channelNameRef}
|
||||
value={value}
|
||||
onChangeText={this.onChangeText}
|
||||
style={style.input}
|
||||
autoCapitalize='none'
|
||||
autoCorrect={false}
|
||||
maxLength={this.props.maxLength}
|
||||
editable={!disabled}
|
||||
underlineColorAndroid='transparent'
|
||||
disableFullscreenUI={true}
|
||||
/>
|
||||
</View>
|
||||
{disabled &&
|
||||
<Text style={style.helpText}>
|
||||
{helpText}
|
||||
|
|
|
|||
Loading…
Reference in a new issue