107 lines
2.3 KiB
React
107 lines
2.3 KiB
React
|
import React from "react";
|
||
|
|
import { View, Text, StyleSheet, Image } from "react-native";
|
||
|
|
|
||
|
|
const CartSubCard = ({ cart }) => {
|
||
|
|
return (
|
||
|
|
<View style={styles.container}>
|
||
|
|
<View style={styles.imgWrap}>
|
||
|
|
<Image
|
||
|
|
style={{ width: 50, height: 50, resizeMode: "cover" }}
|
||
|
|
source={{ uri: cart.img }}
|
||
|
|
/>
|
||
|
|
</View>
|
||
|
|
<View style={styles.wrapper}>
|
||
|
|
<View style={styles.details}>
|
||
|
|
<Text style={styles.text} numberOfLines={2}>
|
||
|
|
{cart.name}
|
||
|
|
</Text>
|
||
|
|
|
||
|
|
<View style={styles.rateCon}>
|
||
|
|
{cart.price ? (
|
||
|
|
<>
|
||
|
|
<View style={styles.priceCon}>
|
||
|
|
<Text
|
||
|
|
style={
|
||
|
|
cart.promo ? styles.textPricePromo : styles.textPrice
|
||
|
|
}
|
||
|
|
>
|
||
|
|
₱{cart.price}
|
||
|
|
</Text>
|
||
|
|
{cart.promo ? (
|
||
|
|
<Text style={styles.textPrice}>
|
||
|
|
{" "}
|
||
|
|
{cart.price - cart.price * 0.3}{" "}
|
||
|
|
<Text style={{ fontWeight: "400" }}>
|
||
|
|
(-{cart.promo}%)
|
||
|
|
</Text>
|
||
|
|
</Text>
|
||
|
|
) : null}
|
||
|
|
</View>
|
||
|
|
</>
|
||
|
|
) : (
|
||
|
|
<Text>No price </Text>
|
||
|
|
)}
|
||
|
|
</View>
|
||
|
|
</View>
|
||
|
|
</View>
|
||
|
|
</View>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
const styles = StyleSheet.create({
|
||
|
|
container: {
|
||
|
|
// width: "95%",
|
||
|
|
margin: 5,
|
||
|
|
borderRadius: 6,
|
||
|
|
borderColor: "#dddd",
|
||
|
|
borderWidth: 1,
|
||
|
|
overflow: "hidden",
|
||
|
|
flexDirection: "row",
|
||
|
|
padding: 10,
|
||
|
|
backgroundColor:'#ffffff'
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
header: {
|
||
|
|
position: "fixed",
|
||
|
|
width: "100%",
|
||
|
|
top: 0,
|
||
|
|
},
|
||
|
|
footer: {
|
||
|
|
// position: "absolute",
|
||
|
|
bottom: 0,
|
||
|
|
width: "100%",
|
||
|
|
},
|
||
|
|
imgWrap:{
|
||
|
|
padding:10
|
||
|
|
},
|
||
|
|
wrapper: {
|
||
|
|
height: "85%",
|
||
|
|
width: "60%",
|
||
|
|
},
|
||
|
|
priceCon: {
|
||
|
|
flexDirection: "row",
|
||
|
|
paddingVertical: 10,
|
||
|
|
},
|
||
|
|
textPrice: {
|
||
|
|
fontSize: 14,
|
||
|
|
fontWeight: "600",
|
||
|
|
textTransform: "capitalize",
|
||
|
|
color: "#ffaa00",
|
||
|
|
},
|
||
|
|
textPricePromo: {
|
||
|
|
fontSize: 14,
|
||
|
|
fontWeight: "600",
|
||
|
|
textTransform: "capitalize",
|
||
|
|
textDecorationLine: "line-through",
|
||
|
|
color: "#ffaa00",
|
||
|
|
},
|
||
|
|
details: {
|
||
|
|
// width: "50%",
|
||
|
|
},
|
||
|
|
text: {
|
||
|
|
fontSize: 13,
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
export default CartSubCard;
|