change layouts of cycle-day, edit symptoms screens and home

This commit is contained in:
tina
2018-06-15 19:31:29 +02:00
parent a46eb4421b
commit 4a5afd4662
6 changed files with 228 additions and 123 deletions
+29 -17
View File
@@ -39,32 +39,44 @@ export default class DayView extends Component {
const bleedingValue = this.cycleDay.bleeding && this.cycleDay.bleeding.value
let bleedingLabel
if (typeof bleedingValue === 'number') {
bleedingLabel = `Bleeding: ${labels[bleedingValue]}`
if (this.cycleDay.bleeding.exclude) bleedingLabel += " (Excluded)"
bleedingLabel = `${labels[bleedingValue]}`
if (this.cycleDay.bleeding.exclude) bleedingLabel = "( " + bleedingLabel + " )"
} else {
bleedingLabel = null
bleedingLabel = 'edit'
}
const temperatureValue = this.cycleDay.temperature && this.cycleDay.temperature.value
let temperatureLabel
if (typeof temperatureValue === 'number') {
temperatureLabel = `Temperature: ${temperatureValue}`
if (this.cycleDay.temperature.exclude) temperatureLabel += " (Excluded)"
temperatureLabel = `${temperatureValue} °C`
if (this.cycleDay.temperature.exclude) temperatureLabel = "( " + temperatureLabel + " )"
} else {
temperatureLabel = null
temperatureLabel = 'edit'
}
return (
<View>
<Text style={styles.welcome}>{bleedingLabel}</Text>
<Text style={styles.welcome}>{temperatureLabel}</Text>
<Button
onPress={() => this.showView('bleedingEditView')}
title="Edit bleeding">
</Button>
<Button
onPress={() => this.showView('temperatureEditView')}
title="Edit temperature">
</Button>
<View style={{flex: 1, flexDirection: 'column', justifyContent: 'flex-start'}}>
<View style={{flexDirection: 'row', justifyContent: 'space-evenly', alignItems: 'center'}}>
<View style={{flex: 1}}>
<Text style={styles.symptomDayView}>Bleeding</Text>
</View>
<View style={{flex: 1, margin:5}}>
<Button
onPress={() => this.showView('bleedingEditView')}
title={bleedingLabel}>
</Button>
</View>
</View>
<View style={{flexDirection: 'row', justifyContent: 'space-evenly', alignItems: 'center'}}>
<View style={{flex: 1}}>
<Text style={styles.symptomDayView}>Temperature</Text>
</View>
<View style={{flex: 1, margin:5}}>
<Button
onPress={() => this.showView('temperatureEditView')}
title={temperatureLabel}>
</Button>
</View>
</View>
</View >
)
}