Commit 2cfe4ba6 authored by Trisno's avatar Trisno

update design reward list

parent 282acae7
...@@ -51,7 +51,7 @@ class RewardsList extends React.Component { ...@@ -51,7 +51,7 @@ class RewardsList extends React.Component {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<View style={styles.header}> <View style={styles.header}>
<Text style={{ color: 'white', textAlign: 'center', fontSize: 18, fontFamily: 'Gotham-Black' }}>REWARDS E-VOUCHER</Text> <Text style={{ color: 'white', textAlign: 'center', fontSize: 20, fontFamily: 'Gotham-Black' }}>REWARDS E-VOUCHER</Text>
</View> </View>
<ScrollView style={styles.body}> <ScrollView style={styles.body}>
{ {
...@@ -59,21 +59,21 @@ class RewardsList extends React.Component { ...@@ -59,21 +59,21 @@ class RewardsList extends React.Component {
this.state.rewardsList.map((item, key) => ( this.state.rewardsList.map((item, key) => (
<TouchableOpacity key={key} onPress={() => this.props.navigation.navigate('Reward Detail', { rewardId: item.id })}> <TouchableOpacity key={key} onPress={() => this.props.navigation.navigate('Reward Detail', { rewardId: item.id })}>
<View style={{ alignItems: 'center' }}> <View style={{ alignItems: 'center' }}>
<Card style={{ padding: 5, margin: 10 }}> <Card style={{ padding: 5, margin: 5 }}>
<View> <View>
<Image source={{ uri: item.reward.title_image }} <Image source={{ uri: item.reward.title_image }}
resizeMethod="resize" resizeMethod="resize"
resizeMode='cover' resizeMode='cover'
style={{ height: 100, width: '100%' }} /> style={{ height: 100, width: '100%' }} />
</View> </View>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', padding: 10 }}> <View style={{ flex:1, flexDirection: 'row', justifyContent: 'space-between'}}>
<View> <View style={{flex:0.6}}>
<Text style={{ textAlign: 'left', fontSize: 12, fontFamily: 'Gotham-Black' }}>{item.reward.title}</Text> <Text style={{ textAlign: 'left', fontSize: 12, fontFamily: 'Gotham-Black', color:'#838383' }}>{item.reward.title}</Text>
<Text style={{ textAlign: 'left', fontSize: 12, fontFamily: 'Gotham-Light' }}>{item.reward.subtitle}</Text> <Text style={{ textAlign: 'left', fontSize: 12, fontFamily: 'Gotham-Light', color:'#838383' }}>{item.reward.subtitle}</Text>
</View> </View>
<View> <View style={{flex:0.4}}>
<Text style={{ textAlign: 'right', fontSize: 12, fontFamily: 'Gotham-Light' }}>Expired</Text> <Text style={{ textAlign: 'right', fontSize: 12, fontFamily: 'Gotham-Light', color:'#838383' }}>Expired On</Text>
<Text style={{ textAlign: 'right', fontSize: 12, fontFamily: 'Gotham-Light' }}>{item.expire_time}</Text> <Text style={{ textAlign: 'right', fontSize: 12, fontFamily: 'Gotham-Light', color:'#838383' }}>{item.expire_time}</Text>
</View> </View>
</View> </View>
</Card> </Card>
...@@ -86,7 +86,7 @@ class RewardsList extends React.Component { ...@@ -86,7 +86,7 @@ class RewardsList extends React.Component {
</View> </View>
) )
} }
<TouchableOpacity onPress={() => this.props.navigation.navigate('Reward History')}> <TouchableOpacity style={{marginVertical:20}} onPress={() => this.props.navigation.navigate('Reward History')}>
<Text style={{ textAlign: 'center', color: '#CFB368', fontSize: 12, fontFamily: 'Gotham-Black' }}>REDEEM E-VOUCHER HISTORY</Text> <Text style={{ textAlign: 'center', color: '#CFB368', fontSize: 12, fontFamily: 'Gotham-Black' }}>REDEEM E-VOUCHER HISTORY</Text>
</TouchableOpacity> </TouchableOpacity>
<View style={{ height: 15 }} /> <View style={{ height: 15 }} />
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment