update design menu confirmation

view/MenuConfirmation.js

@@ -256,19 +256,19 @@ class MenuConfirmation extends React.Component {
                         return (
                             <View style={{ margin: 0 }} key={index} >
                                 <View style={{ flex: 1, margin: 10, flexDirection: 'row', justifyContent: 'space-around' }}>
-                                    <View style={{ flex: 0.1, alignItems: 'center', justifyContent:'center', alignItems:'flex-end' }}>
+                                    <View style={{ flex: 0.1, alignItems: 'center', justifyContent:'center', alignItems:'center', marginLeft:10 }}>
                                         <Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color:'#838383' }}>{item.quantity}</Text>
                                     </View>
-                                    <View style={{ flex: 0.2, alignItems: 'flex-end'}}>
+                                    <View style={{ flex: 0.2, alignItems: 'center'}}>
                                         <Image source={{ uri: item.image }} style={{ height: 50, width: 50, borderRadius: 5}}></Image>
                                     </View>
                                     {/* <View style={{ flex: 0.1, alignItems: 'flex-start', justifyContent:'center', }}>
                                         <Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>x</Text>
                                     </View> */}
-                                    <View style={{ flex: 0.4, alignItems: 'baseline', justifyContent:'center', alignItems:'center'}}>
+                                    <View style={{ flex: 0.4, alignItems: 'baseline', justifyContent:'center', alignItems:'flex-start', paddingLeft:10}}>
                                         <Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color:'#838383' }}>{item.name} </Text>
                                     </View>
-                                    <View style={{ flex: 0.3, alignItems: 'flex-end', justifyContent:'center'}}>
+                                    <View style={{ flex: 0.3, alignItems: 'flex-end', justifyContent:'center', paddingRight:5}}>
                                         {/* <Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color:'#838383' }}>{item.quantity * item.price} </Text> */}
                                         <NumberFormat decimalScale={0} value={item.quantity * item.price} renderText={value => <Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color:'#838383' }}>Rp. {value}</Text>} displayType={'text'} thousandSeparator={true} prefix={''} />
                                     </View>
@@ -291,7 +291,7 @@ class MenuConfirmation extends React.Component {
                                         <Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color:'#838383' }}>{this.props.voucher.reward.title}</Text>
                                     </View>
                                     <TouchableOpacity onPress={() => this.props.navigation.navigate('Reward Detail', { rewardId: this.props.voucher.id })}>
-                                        <View style={{ flex:0.2, marginVertical:10 }}>
+                                        <View style={{ flex:0.2, marginVertical:10, paddingRight:5 }}>
                                             <Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color: '#CFB368' }}>View Detail</Text>
                                         </View>
                                     </TouchableOpacity>