35 lines
No EOL
1 KiB
TypeScript
35 lines
No EOL
1 KiB
TypeScript
import { StyleSheet, Text, View } from "react-native";
|
|
import { useThemeColor } from "../../hooks/useThemeColor";
|
|
import SearchBar from "../common/SearchBar";
|
|
|
|
const BudgetHeader = () => {
|
|
const primaryTextColor = useThemeColor("primaryText");
|
|
const secondaryTextColor = useThemeColor("secondaryText");
|
|
|
|
|
|
|
|
return (<>
|
|
<View style={styles.containerStyle}>
|
|
<Text style={[styles.selectedHeaderTextStyle, {color: primaryTextColor}]}>Expense View</Text>
|
|
<Text style={[styles.defaultHeaderTextStyle, {color: secondaryTextColor}]}>Savings View</Text>
|
|
</View>
|
|
<SearchBar placeholder='Search...'></SearchBar>
|
|
</>);
|
|
}
|
|
|
|
export default BudgetHeader;
|
|
|
|
const styles = StyleSheet.create({
|
|
selectedHeaderTextStyle: {
|
|
fontSize: 40,
|
|
fontWeight: "bold",
|
|
},
|
|
defaultHeaderTextStyle: {
|
|
fontSize: 20,
|
|
},
|
|
containerStyle: {
|
|
backgroundColor: "blue",
|
|
flexDirection: "row",
|
|
justifyContent: "space-between",
|
|
},
|
|
}); |