Fakultas Ilmu Komputer UI

Commit 4eaa9261 authored by angelin depthios's avatar angelin depthios
Browse files

feat: add description in Plain button

parent 65364bfa
...@@ -5,13 +5,29 @@ import Colors from "../../constants/Colors"; ...@@ -5,13 +5,29 @@ import Colors from "../../constants/Colors";
type props = { type props = {
text: string; text: string;
onPress: () => void; onPress: () => void;
desc?: boolean;
descText?: string;
}; };
const PlainButton = ({ text, onPress }: props) => { const PlainButton = ({ text, desc, onPress, descText }: props) => {
return ( return (
<View> <View>
<TouchableOpacity style={styles.button} onPress={() => onPress()}> <TouchableOpacity style={styles.button} onPress={() => onPress()}>
<View style={styles.textContainter}> <View style={styles.textContainter}>
<Text style={styles.texts}>{text}</Text> <Text style={styles.texts}>{text}</Text>
{desc && (
<View style={styles.desc}>
<View style={{ marginRight: 3 }}>
<MaterialIcons
name="group"
size={15}
color={Colors.icon.inactive}
/>
</View>
<View style={{ flex: 1, paddingRight: 7 }}>
<Text style={styles.descText}>{descText}</Text>
</View>
</View>
)}
</View> </View>
<View style={styles.iconContainer}> <View style={styles.iconContainer}>
<MaterialIcons <MaterialIcons
...@@ -31,7 +47,7 @@ export default PlainButton; ...@@ -31,7 +47,7 @@ export default PlainButton;
const styles = StyleSheet.create({ const styles = StyleSheet.create({
button: { button: {
width: 363, width: "100%",
borderRadius: 8, borderRadius: 8,
elevation: 4, elevation: 4,
flexDirection: "row", flexDirection: "row",
...@@ -41,13 +57,13 @@ const styles = StyleSheet.create({ ...@@ -41,13 +57,13 @@ const styles = StyleSheet.create({
}, },
textContainter: { textContainter: {
flex: 1, flex: 1,
marginRight: 25, paddingRight: 25,
marginLeft: 8, paddingLeft: 8,
marginVertical: 8, paddingVertical: 8,
}, },
iconContainer: { iconContainer: {
marginRight: 16, paddingRight: 16,
marginVertical: 23, paddingVertical: 23,
}, },
texts: { texts: {
fontWeight: "300", fontWeight: "300",
...@@ -55,6 +71,15 @@ const styles = StyleSheet.create({ ...@@ -55,6 +71,15 @@ const styles = StyleSheet.create({
fontSize: 16, fontSize: 16,
textAlign: "left", textAlign: "left",
textAlignVertical: "center", textAlignVertical: "center",
color: "#666666", color: Colors.text.body,
},
desc: {
paddingTop: 5,
flexDirection: "row",
alignItems: "center",
},
descText: {
fontSize: 12,
color: Colors.text.disabled,
}, },
}); });
Supports Markdown
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