Skip to content

C
clone_excelso
Commit d3d29073 authored by Trisno's avatar Trisno
Browse files
Options

update design reward detail

parent 2cfe4ba6
Hide whitespace changes
Inline Side-by-side
Showing with 40 additions and 25 deletions
view/Auth.js
View file @ d3d29073
......@@ -376,10 +376,10 @@ class Auth extends React.Component {
headerTitleStyle: {
alignSelf: 'center',
fontFamily: 'Gotham-Black',
fontSize: 18,
fontSize: 20,
color: 'white',
textAlign: 'center'
}, title: 'Shopping Cart'
}, title: 'SHOPPING CART'
}} />
<Stack.Screen name="Order History" component={OrderHistory} />
<Stack.Screen name="Reward History" component={RewardHistory}
......@@ -528,7 +528,19 @@ class Auth extends React.Component {
title: 'REGISTER'
}} />
<Stack.Screen name="TopUpInfo" component={TopUpInfo} options={{ headerShown: false }} />
<Stack.Screen name="Reward Detail" component={RewardDetail} />
<Stack.Screen name="Reward Detail" component={RewardDetail}
options={{
headerStyle: { backgroundColor: "#CFB368" },
headerBackTitleStyle: { color: 'white' },
headerTintColor: '#fff',
headerTitleAlign: 'center',
headerTitleStyle: {
fontFamily: 'Gotham-Black',
color: 'white',
fontSize: 20,
},
title: 'REWARD DETAIL'
}} />
<Stack.Screen name="Reward Select" component={RewardSelect}
options={{
headerStyle: { backgroundColor: "#CFB368" },
......@@ -538,7 +550,7 @@ class Auth extends React.Component {
headerTitleStyle: {
fontFamily: 'Gotham-Black',
color: 'white',
fontSize: 18,
fontSize: 20,
},
title: 'REWARD SELECT'
}} />
......
view/RewardDetail.js
View file @ d3d29073
......@@ -16,7 +16,7 @@ class RewardDetail extends React.Component {
image: '',
title: '',
subtitle: '',
content: "",
content: '',
expire: '',
code: '',
used: '',
......@@ -93,18 +93,19 @@ class RewardDetail extends React.Component {
render() {
console.log(this.state.content)
return (
<View style={styles.container}>
<ScrollView>
<View style={styles.images}>
<Image style={{ height: 250, width: '100%' }} source={this.state.image ? { uri: this.state.image } : null} />
<View style={styles.voucher_code}>
<Text style={styles.text_voucher}>Voucher Code : </Text>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 18, textAlign: 'center', marginBottom: 5, top: 15 }}>{this.state.code}</Text>
<Text style={styles.text_voucher}>VOUCHER CODE : </Text>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 20, textAlign: 'center', marginBottom: 5, top: 15 }}>{this.state.code}</Text>
</View>
<View style={styles.expire_time}>
<Text style={styles.text_expire}>Expire Time : </Text>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 20, textAlign: 'center', marginBottom: 5, top: 7 }}>{this.state.expire}</Text>
<Text style={styles.text_expire}>EXPIRE TIME : </Text>
<Text style={{ fontFamily: 'Gotham-Light', color: 'white', fontSize: 14, textAlign: 'center', marginBottom: 5, top: 7 }}>{this.state.expire}</Text>
</View>
</View>
......@@ -113,32 +114,34 @@ class RewardDetail extends React.Component {
<View style={{ marginRight: 5, marginLeft: 5 }}>
<Text style={{ fontFamily: 'Gotham-Black', color: '#CFB368', fontSize: 20, textAlign: 'center', margin: 15 }}>{this.state.title}</Text>
</View>
<View style={{ marginRight: 20, marginLeft: 20 }}>
<HTML html={this.state.content} />
<View
style={{ marginHorizontal:20 }}
>
<HTML html={this.state.content} tagsStyles={{ p: {fontFamily: 'Gotham-Light', marginTop: 8, marginBottom: 8}, blockquote: { backgroundColor: "#f1f1f1", padding: 12, paddingBottom: 0, marginTop: 6 } }}/>
</View>
</View>
<View style={styles.content}>
{this.state.cur_time >= this.state.exp_time ? (
<View style={{ flex: 1, height: 50, marginRight: 70, marginLeft: 70, justifyContent: 'center' }}>
<TouchableOpacity>
<View style={{ height: 50, borderRadius: 20, backgroundColor: 'red' }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 20, textAlign: 'center', margin: 15 }}>EXPIRED</Text>
<View style={{ height: 40, borderRadius: 10, backgroundColor: 'red' }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center', margin: 11 }}>EXPIRED</Text>
</View>
</TouchableOpacity>
</View>
)
: this.state.used == 0 ? (
<View style={{ flex: 1, height: 50, marginRight: 70, marginLeft: 70, justifyContent: 'center' }}>
<View style={{ flex: 1, height: 50, marginRight: 70, marginLeft: 70, justifyContent: 'center'}}>
<TouchableOpacity onPress={() => this.useVoucher()}>
<View style={{ height: 50, borderRadius: 20, backgroundColor: '#CFB368' }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 20, textAlign: 'center', margin: 15 }}>USE VOUCHER</Text>
<View style={{ height: 40, borderRadius: 10, backgroundColor: '#CFB368' }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center', margin: 11 }}>USE VOUCHER</Text>
</View>
</TouchableOpacity>
</View>
) : (
<TouchableOpacity onPress={() => this.useDVoucher()}>
<View style={{ height: 50, borderRadius: 20, backgroundColor: '#CFB368' }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 20, textAlign: 'center', margin: 15 }}>USED VOUCHER</Text>
<View style={{ height: 40, borderRadius: 10, backgroundColor: '#CFB368' }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center', margin: 11 }}>USED VOUCHER</Text>
</View>
</TouchableOpacity>
)}
......@@ -166,24 +169,24 @@ const styles = StyleSheet.create({
height: 70,
marginLeft: 20,
marginRight: 20,
backgroundColor: '#01919c',
backgroundColor: '#CFB368',
flex: 1,
marginTop: -140
},
expire_time: {
fontFamily: 'Gotham-Black',
fontFamily: 'Gotham-Light',
flex: 1,
marginLeft: 20,
marginRight: 20,
height: 70,
justifyContent:'center',
backgroundColor: 'black',
backgroundColor: '#838383',
},
text_voucher: {
fontFamily: 'Gotham-Black',
fontFamily: 'Gotham-Light',
fontSize: 14,
marginLeft: 10,
top:5,
......@@ -200,8 +203,8 @@ const styles = StyleSheet.create({
},
text_expire: {
fontFamily: 'Gotham-Black',
fontSize: 15,
fontFamily: 'Gotham-Light',
fontSize: 14,
marginLeft: 10,
top: 5,
color: 'white'
......
view/RewardsList.js
View file @ d3d29073
......@@ -103,7 +103,7 @@ const styles = StyleSheet.create({
},
header: {
flex: 0.1,
backgroundColor: '#ccb46c',
backgroundColor: '#CFB368',
justifyContent: 'center'
},
......
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