diff --git a/components/cycle-day/symptoms/temperature.js b/components/cycle-day/symptoms/temperature.js index 966a22770219eeb79affaef14097c7d1210ba3cb..9c0fb7a6467c55b9c38f220e905efbf416e80f7d 100644 --- a/components/cycle-day/symptoms/temperature.js +++ b/components/cycle-day/symptoms/temperature.js @@ -45,6 +45,7 @@ export default class Temp extends Component { const [integer, fractional] = prevTemp.toString().split('.') this.state.integer = integer this.state.fractional = fractional + this.state.isSuggestion = true } } } @@ -58,6 +59,7 @@ export default class Temp extends Component { integer={this.state.integer} fractional={this.state.fractional} setState={(val) => this.setState(val)} + isSuggestion={this.state.isSuggestion} /> </View> <View style={styles.symptomViewRowInline}> @@ -125,6 +127,7 @@ class TempInputPair extends Component { integer={this.props.integer} fractional={this.props.fractional} setState={this.props.setState} + isSuggestion={this.props.isSuggestion} /> <Text style={styles.temperatureTextInput}>.</Text> <TempInput @@ -132,6 +135,7 @@ class TempInputPair extends Component { integer={this.props.integer} fractional={this.props.fractional} setState={this.props.setState} + isSuggestion={this.props.isSuggestion} /> </View> ) @@ -151,12 +155,16 @@ class TempInput extends Component { } render() { + const style = [styles.temperatureTextInput] + if (this.props.isSuggestion) { + style.push(styles.temperatureTextInputSuggestion) + } return ( <TextInput - style={styles.temperatureTextInput} + style={style} onChangeText={(val) => { if (isNaN(Number(val))) return - this.props.setState({ [this.props.type]: val }) + this.props.setState({ [this.props.type]: val, isSuggestion: false }) }} keyboardType='numeric' value={this.props[this.props.type]} diff --git a/styles/index.js b/styles/index.js index 69ef0c2cc771708732bb2c94fbefda4bf01c0075..a8844b1ea92b24a8a591ab4fa9d5a519d808d8b9 100644 --- a/styles/index.js +++ b/styles/index.js @@ -66,7 +66,11 @@ export default StyleSheet.create({ marginBottom: 15 }, temperatureTextInput: { - fontSize: 20 + fontSize: 20, + color: 'black' + }, + temperatureTextInputSuggestion: { + color: '#939393' }, actionButtonRow: { flexDirection: 'row',