Files
cally/components/pages/grocery/AddGroceryItem.tsx
2024-10-30 23:44:37 +01:00

81 lines
2.0 KiB
TypeScript

import {StyleSheet} from "react-native";
import React from "react";
import {Button, View,} from "react-native-ui-lib";
import {useGroceryContext} from "@/contexts/GroceryContext";
import {FontAwesome6} from "@expo/vector-icons";
import PlusIcon from "@/assets/svgs/PlusIcon";
const AddGroceryItem = () => {
const {setIsAddingGrocery} = useGroceryContext();
return (
<View
row
spread
paddingH-20
style={{
position: "absolute",
bottom: 15,
width: "100%",
height: 53.26,
}}
>
<View style={styles.btnContainer} row>
<Button
color="white"
backgroundColor="#fd1775"
label="Add item"
text70L
iconSource={() => <PlusIcon />}
style={styles.finishShopBtn}
labelStyle={styles.addBtnLbl}
enableShadow
onPress={() => {
setIsAddingGrocery(true);
}}
/>
</View>
</View>
);
};
export default AddGroceryItem;
const styles = StyleSheet.create({
container: {
paddingVertical: 10,
display: "flex",
flexDirection: "column",
justifyContent: "space-between",
},
inner: {
paddingHorizontal: 20,
display: "flex",
flexDirection: "column",
},
title: {
fontSize: 20,
fontWeight: "400",
textAlign: "center",
},
divider: {
width: "100%",
height: 1,
backgroundColor: "#E0E0E0",
marginVertical: 10,
},
btnContainer: {
width: "100%",
justifyContent: "center",
},
finishShopBtn: {
width: "100%",
height: 53.26,
},
shoppingBtn: {
flex: 1,
marginHorizontal: 3,
},
addBtnLbl: {fontFamily: "Manrope_500Medium", fontSize: 17, marginLeft: 5},
});