mirror of
https://github.com/urosran/cally.git
synced 2025-11-27 17:04:55 +00:00
added focus, ui changes
This commit is contained in:
@ -9,6 +9,7 @@ import { AuthContextProvider } from "@/contexts/AuthContext";
|
||||
import ProfileIcon from "@/assets/svgs/ProfileIcon";
|
||||
import CalendarIcon from "@/assets/svgs/CalendarIcon";
|
||||
import PrivacyPolicyIcon from "@/assets/svgs/PrivacyPolicyIcon";
|
||||
import ArrowRightIcon from "@/assets/svgs/ArrowRightIcon";
|
||||
|
||||
const pageIndex = {
|
||||
main: 0,
|
||||
@ -20,71 +21,83 @@ const pageIndex = {
|
||||
const SettingsPage = () => {
|
||||
const [selectedPage, setSelectedPage] = useState<number>(0);
|
||||
return (
|
||||
<View flexG>
|
||||
{selectedPage == 0 && (
|
||||
<View flexG centerH marginH-30 marginT-30>
|
||||
<Button
|
||||
backgroundColor="white"
|
||||
style={styles.mainBtn}
|
||||
label="Manage My Profile"
|
||||
labelStyle={styles.label}
|
||||
color="#07b8c7"
|
||||
iconSource={() => (
|
||||
<ProfileIcon style={{marginRight: 10}} color="#07b9c8" />
|
||||
)}
|
||||
onPress={() => setSelectedPage(pageIndex.user)}
|
||||
/>
|
||||
<Button
|
||||
backgroundColor="white"
|
||||
style={styles.mainBtn}
|
||||
label="Calendar Settings"
|
||||
labelStyle={styles.label}
|
||||
color="#fd1775"
|
||||
iconSource={() => (
|
||||
<CalendarIcon style={{marginRight: 10}}/>
|
||||
)}
|
||||
onPress={() => {
|
||||
setSelectedPage(pageIndex.calendar);
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
backgroundColor="white"
|
||||
style={styles.mainBtn}
|
||||
label="To-Do Reward Settings"
|
||||
labelStyle={styles.label}
|
||||
color="#ff9900"
|
||||
iconSource={() => (
|
||||
<View flexG>
|
||||
{selectedPage == 0 && (
|
||||
<View flexG centerH marginH-30 marginT-30>
|
||||
<Button
|
||||
backgroundColor="white"
|
||||
style={styles.mainBtn}
|
||||
children={
|
||||
<View row centerV width={"100%"}>
|
||||
<ProfileIcon style={{ marginRight: 10 }} color="#07b9c8" />
|
||||
<Text style={styles.label} color="#07b8c7">
|
||||
Manage My Profile
|
||||
</Text>
|
||||
<ArrowRightIcon style={{ marginLeft: "auto" }} />
|
||||
</View>
|
||||
}
|
||||
onPress={() => setSelectedPage(pageIndex.user)}
|
||||
/>
|
||||
<Button
|
||||
backgroundColor="white"
|
||||
style={styles.mainBtn}
|
||||
children={
|
||||
<View row centerV width={"100%"}>
|
||||
<CalendarIcon style={{ marginRight: 10 }} />
|
||||
<Text style={styles.label} color="#fd1775">
|
||||
Calendar Settings
|
||||
</Text>
|
||||
<ArrowRightIcon style={{ marginLeft: "auto" }} />
|
||||
</View>
|
||||
}
|
||||
onPress={() => {
|
||||
setSelectedPage(pageIndex.calendar);
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
backgroundColor="white"
|
||||
style={styles.mainBtn}
|
||||
children={
|
||||
<View row centerV width={"100%"}>
|
||||
<Octicons
|
||||
name="gear"
|
||||
size={24}
|
||||
color="#ff9900"
|
||||
style={{ marginRight: 10 }}
|
||||
/>
|
||||
)}
|
||||
onPress={() => setSelectedPage(pageIndex.chore)}
|
||||
/>
|
||||
<Button
|
||||
backgroundColor="white"
|
||||
style={styles.mainBtn}
|
||||
label="Cally Privacy Policy"
|
||||
labelStyle={styles.label}
|
||||
iconSource={() => (
|
||||
<PrivacyPolicyIcon style={{marginRight: 10}}/>
|
||||
)}
|
||||
color="#6c645b"
|
||||
/>
|
||||
</View>
|
||||
)}
|
||||
{selectedPage == pageIndex.calendar && (
|
||||
<CalendarSettingsPage setSelectedPage={setSelectedPage} />
|
||||
)}
|
||||
{selectedPage == pageIndex.chore && (
|
||||
<ChoreRewardSettings setSelectedPage={setSelectedPage} />
|
||||
)}
|
||||
{selectedPage == pageIndex.user && (
|
||||
<UserSettings setSelectedPage={setSelectedPage} />
|
||||
)}
|
||||
</View>
|
||||
<Text style={styles.label} color="#ff9900">
|
||||
To-Do Reward Settings
|
||||
</Text>
|
||||
<ArrowRightIcon style={{ marginLeft: "auto" }} />
|
||||
</View>
|
||||
}
|
||||
onPress={() => setSelectedPage(pageIndex.chore)}
|
||||
/>
|
||||
<Button
|
||||
backgroundColor="white"
|
||||
style={styles.mainBtn}
|
||||
children={
|
||||
<View row centerV width={"100%"}>
|
||||
<PrivacyPolicyIcon style={{ marginRight: 10 }} />
|
||||
<Text style={styles.label} color="#6c645b">
|
||||
Cally Privacy Policy
|
||||
</Text>
|
||||
<ArrowRightIcon style={{ marginLeft: "auto" }} />
|
||||
</View>
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
)}
|
||||
{selectedPage == pageIndex.calendar && (
|
||||
<CalendarSettingsPage setSelectedPage={setSelectedPage} />
|
||||
)}
|
||||
{selectedPage == pageIndex.chore && (
|
||||
<ChoreRewardSettings setSelectedPage={setSelectedPage} />
|
||||
)}
|
||||
{selectedPage == pageIndex.user && (
|
||||
<UserSettings setSelectedPage={setSelectedPage} />
|
||||
)}
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
@ -92,14 +105,14 @@ export default SettingsPage;
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
mainBtn: {
|
||||
width: "100%",
|
||||
width: 311,
|
||||
justifyContent: "flex-start",
|
||||
marginBottom: 20,
|
||||
height: 60,
|
||||
height: 57.61,
|
||||
},
|
||||
label:{
|
||||
label: {
|
||||
fontFamily: "Poppins_400Regular",
|
||||
fontSize: 14.71,
|
||||
textAlignVertical: 'center'
|
||||
}
|
||||
textAlignVertical: "center",
|
||||
},
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user