mirror of
https://github.com/urosran/cally.git
synced 2025-07-16 18:16:17 +00:00
new icons
This commit is contained in:
ivic00
@ -18,6 +18,11 @@ import {
|
||||
} from "@expo/vector-icons";
|
||||
import MenuIcon from "@/assets/svgs/MenuIcon";
|
||||
import { router } from "expo-router";
|
||||
import NavGroceryIcon from "@/assets/svgs/NavGroceryIcon";
|
||||
import NavToDosIcon from "@/assets/svgs/NavToDosIcon";
|
||||
import NavBrainDumpIcon from "@/assets/svgs/NavBrainDumpIcon";
|
||||
import NavCalendarIcon from "@/assets/svgs/NavCalendarIcon";
|
||||
import NavSettingsIcon from "@/assets/svgs/NavSettingsIcon";
|
||||
|
||||
export default function TabLayout() {
|
||||
const { mutateAsync: signOut } = useSignOut();
|
||||
@ -52,26 +57,14 @@ export default function TabLayout() {
|
||||
color="rgb(7, 184, 199)"
|
||||
bgColor={"rgb(231, 248, 250)"}
|
||||
pressFunc={() => props.navigation.navigate("calendar")}
|
||||
icon={
|
||||
<Feather
|
||||
name="calendar"
|
||||
size={30}
|
||||
color="rgb(7, 184, 199)"
|
||||
/>
|
||||
}
|
||||
icon={<NavCalendarIcon />}
|
||||
/>
|
||||
<DrawerButton
|
||||
color="#50be0c"
|
||||
title={"Groceries"}
|
||||
bgColor={"#eef9e7"}
|
||||
pressFunc={() => props.navigation.navigate("grocery")}
|
||||
icon={
|
||||
<MaterialCommunityIcons
|
||||
name="food-apple-outline"
|
||||
size={30}
|
||||
color="#50be0c"
|
||||
/>
|
||||
}
|
||||
icon={<NavGroceryIcon />}
|
||||
/>
|
||||
</View>
|
||||
<View style={{ flex: 1 }}>
|
||||
@ -93,16 +86,14 @@ export default function TabLayout() {
|
||||
title={"To Do's"}
|
||||
bgColor={"#f3e6fd"}
|
||||
pressFunc={() => props.navigation.navigate("todos")}
|
||||
icon={
|
||||
<AntDesign name="checkcircleo" size={30} color="#8005eb" />
|
||||
}
|
||||
icon={<NavToDosIcon />}
|
||||
/>
|
||||
<DrawerButton
|
||||
color="#e0ca03"
|
||||
title={"Brain Dump"}
|
||||
bgColor={"#fffacb"}
|
||||
pressFunc={() => props.navigation.navigate("brain_dump")}
|
||||
icon={<AntDesign name="book" size={30} color="#e0ca03" />}
|
||||
icon={<NavBrainDumpIcon />}
|
||||
/>
|
||||
{/*<DrawerItem label="Logout" onPress={() => signOut()} />*/}
|
||||
</View>
|
||||
@ -120,7 +111,7 @@ export default function TabLayout() {
|
||||
centerV
|
||||
centerH
|
||||
>
|
||||
<Octicons name="gear" size={30} color="#6c645b" />
|
||||
<NavSettingsIcon />
|
||||
</View>
|
||||
)}
|
||||
backgroundColor="white"
|
||||
|
||||
19
assets/svgs/CalendarIcon.tsx
Normal file
19
assets/svgs/CalendarIcon.tsx
Normal file
@ -0,0 +1,19 @@
|
||||
import * as React from "react"
|
||||
import Svg, { Path, SvgProps } from "react-native-svg"
|
||||
const CalendarIcon: React.FC<SvgProps> = (props) => (
|
||||
<Svg
|
||||
width={props.width || 21}
|
||||
height={props.height || 21}
|
||||
fill="none"
|
||||
{...props}
|
||||
>
|
||||
<Path
|
||||
stroke={props.color || "#FD1775"}
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={1.455}
|
||||
d="M1.413 7.359h18.294m-4.065 4.067-10.164-.002m3.388 4.066H5.478m0-14.23v2.033m10.164-2.032v2.032M4.665 19.555h11.79c1.138 0 1.708 0 2.142-.222.383-.194.694-.505.889-.888.221-.435.221-1.004.221-2.142V6.546c0-1.139 0-1.708-.221-2.143a2.032 2.032 0 0 0-.889-.888c-.434-.222-1.004-.222-2.142-.222H4.665c-1.138 0-1.707 0-2.142.222a2.033 2.033 0 0 0-.888.888c-.222.435-.222 1.004-.222 2.143v9.757c0 1.138 0 1.707.222 2.142.195.383.505.694.888.888.435.222 1.004.222 2.142.222Z"
|
||||
/>
|
||||
</Svg>
|
||||
)
|
||||
export default CalendarIcon
|
||||
36
assets/svgs/NavBrainDumpIcon.tsx
Normal file
36
assets/svgs/NavBrainDumpIcon.tsx
Normal file
@ -0,0 +1,36 @@
|
||||
import * as React from "react"
|
||||
import Svg, { Path, SvgProps } from "react-native-svg"
|
||||
const NavBrainDumpIcon: React.FC<SvgProps> = (props) => (
|
||||
<Svg
|
||||
width={22}
|
||||
height={28}
|
||||
fill="none"
|
||||
{...props}
|
||||
>
|
||||
<Path
|
||||
stroke="#F90"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeMiterlimit={10}
|
||||
strokeWidth={1.509}
|
||||
d="M21.1.859H3.994C2.284.859.976 2.167.976 3.877c0 1.71 1.308 3.019 3.018 3.019H21.1V27.02"
|
||||
/>
|
||||
<Path
|
||||
stroke="#F90"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeMiterlimit={10}
|
||||
strokeWidth={1.509}
|
||||
d="M21.1 27.021H3.994c-1.71 0-3.018-1.308-3.018-3.018V3.878M21.097 3.878H3.991"
|
||||
/>
|
||||
<Path
|
||||
stroke="#F90"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeMiterlimit={10}
|
||||
strokeWidth={1.509}
|
||||
d="M6.007 6.897v12.075l3.019-1.006 3.018 1.006V6.897"
|
||||
/>
|
||||
</Svg>
|
||||
)
|
||||
export default NavBrainDumpIcon
|
||||
19
assets/svgs/NavCalendarIcon.tsx
Normal file
19
assets/svgs/NavCalendarIcon.tsx
Normal file
@ -0,0 +1,19 @@
|
||||
import * as React from "react"
|
||||
import Svg, { Path, SvgProps } from "react-native-svg"
|
||||
const NavCalendarIcon: React.FC<SvgProps> = (props) => (
|
||||
<Svg
|
||||
width={28}
|
||||
height={28}
|
||||
fill="none"
|
||||
{...props}
|
||||
>
|
||||
<Path
|
||||
stroke="#07B8C7"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2.124}
|
||||
d="M1.825 10.075h25.043m-5.565 5.567L7.39 15.64m4.638 5.566H7.39m0-19.478V4.51m13.913-2.782V4.51M6.277 26.77h16.139c1.558 0 2.337 0 2.933-.303.523-.267.949-.692 1.216-1.216.303-.595.303-1.375.303-2.933V8.962c0-1.558 0-2.337-.303-2.933a2.782 2.782 0 0 0-1.216-1.216c-.596-.303-1.375-.303-2.933-.303H6.277c-1.558 0-2.337 0-2.933.303-.523.267-.949.693-1.216 1.216-.303.596-.303 1.375-.303 2.933v13.356c0 1.558 0 2.338.303 2.933.267.523.693.95 1.216 1.216.596.303 1.375.303 2.933.303Z"
|
||||
/>
|
||||
</Svg>
|
||||
)
|
||||
export default NavCalendarIcon
|
||||
20
assets/svgs/NavGroceryIcon.tsx
Normal file
20
assets/svgs/NavGroceryIcon.tsx
Normal file
@ -0,0 +1,20 @@
|
||||
import * as React from "react";
|
||||
import Svg, { Path, SvgProps } from "react-native-svg";
|
||||
const NavGroceryIcon: React.FC<SvgProps> = (props) => (
|
||||
<Svg
|
||||
width={29}
|
||||
height={32}
|
||||
fill="none"
|
||||
{...props}
|
||||
>
|
||||
<Path
|
||||
fill="#50BE0C"
|
||||
d="M27.8 12c-.888-2.27-2.662-4.14-4.983-4.956-2.518-.883-5.143-.382-7.636.307-.047-1.362.068-2.728.262-4.076.11-.761.634-2.335-.668-2.389-1.081-.045-1.084 1.402-1.19 2.14-.203 1.416-.323 2.85-.284 4.281-.599-.1-1.19-.322-1.787-.446a13.485 13.485 0 0 0-2.704-.3c-1.752 0-3.48.465-4.922 1.479C1.09 10.01 0 13.446.046 16.747c.052 3.575 1.263 6.99 3.3 9.905.899 1.288 1.932 2.522 3.21 3.451 1.241.903 2.628 1.325 4.133 1.54.64.093 1.29.096 1.927-.009.557-.09 1.078-.325 1.63-.419.417-.07 1.005.258 1.408.348a6.297 6.297 0 0 0 2.096.107c2.563-.292 4.594-1.449 6.28-3.387 3.71-4.264 5.921-10.791 3.77-16.284Zm-1.69 8.743c-.474 1.663-1.225 3.182-2.195 4.608-.86 1.263-1.855 2.514-3.131 3.377-1.172.79-2.76 1.223-4.173 1.093-.719-.065-1.373-.41-2.087-.478-.8-.076-1.538.352-2.318.459-3.064.416-5.485-1.665-7.146-3.972-2.04-2.831-3.249-6.214-3.134-9.732.106-3.223 1.643-6.55 4.998-7.432 1.678-.44 3.446-.188 5.099.238.715.183 1.454.48 2.196.52.572.066 1.2-.196 1.74-.344 3.233-.89 6.873-1.105 9.124 1.855 2.08 2.732 1.925 6.666 1.027 9.808Z"
|
||||
/>
|
||||
<Path
|
||||
fill="#50BE0C"
|
||||
d="M12 17.966c-.778.285-1.977.71-2.432 1.454.11-.183.221-.363-.002.002-.222.365-.113.186-.001.003-.668 1.099.272 2.53 1.547 2.347 1.258-.18 1.378-1.419 1.364-2.443a8.822 8.822 0 0 0-.095-1.282c-.043-.264-.157-.164-.382-.08ZM18.096 18.917c-.435-.304-.919-.542-1.405-.752-.118-.05-.698-.375-.832-.297.018-.01.036-.021 0 0-.036.023-.02.012-.001.001-.11.07-.096.609-.104.716a9.003 9.003 0 0 0-.01 1.534c.1 1.117 1.049 2.082 2.228 1.517 1.165-.558 1.095-2.04.124-2.719ZM12.223 3.815C12.343.28 8.347-.271 6.922.432c.371 4.075 3.48 4.164 5.301 3.383Z"
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
export default NavGroceryIcon;
|
||||
28
assets/svgs/NavSettingsIcon.tsx
Normal file
28
assets/svgs/NavSettingsIcon.tsx
Normal file
@ -0,0 +1,28 @@
|
||||
import * as React from "react";
|
||||
import Svg, { Path, SvgProps } from "react-native-svg";
|
||||
const NavSettingsIcon: React.FC<SvgProps> = (props) => (
|
||||
<Svg
|
||||
width={26}
|
||||
height={28}
|
||||
fill="none"
|
||||
{...props}
|
||||
>
|
||||
<Path
|
||||
stroke="#6C645B"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeMiterlimit={10}
|
||||
strokeWidth={1.69}
|
||||
d="M12.972 17.893a3.887 3.887 0 1 0 0-7.774 3.887 3.887 0 0 0 0 7.774Z"
|
||||
/>
|
||||
<Path
|
||||
stroke="#6C645B"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeMiterlimit={10}
|
||||
strokeWidth={1.69}
|
||||
d="m24.398 8.531-.972-1.683a1.943 1.943 0 0 0-2.655-.711l-.511.295c-1.944 1.121-4.373-.28-4.373-2.525v-.59c0-1.074-.87-1.944-1.944-1.944H12c-1.073 0-1.943.87-1.943 1.943v.591c0 2.244-2.43 3.647-4.373 2.525l-.511-.295a1.943 1.943 0 0 0-2.655.711l-.972 1.683a1.943 1.943 0 0 0 .711 2.655l.511.296c1.944 1.122 1.944 3.927 0 5.049l-.51.295a1.943 1.943 0 0 0-.712 2.655l.972 1.684a1.943 1.943 0 0 0 2.655.71l.51-.294c1.944-1.123 4.374.28 4.374 2.524v.591c0 1.074.87 1.944 1.944 1.944h1.943c1.074 0 1.944-.87 1.944-1.944v-.59c0-2.245 2.43-3.648 4.373-2.526l.511.296c.93.536 2.119.219 2.655-.711l.972-1.684a1.943 1.943 0 0 0-.712-2.655l-.51-.295c-1.944-1.122-1.944-3.927 0-5.05l.51-.295a1.942 1.942 0 0 0 .712-2.655Z"
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
export default NavSettingsIcon;
|
||||
18
assets/svgs/NavToDosIcon.tsx
Normal file
18
assets/svgs/NavToDosIcon.tsx
Normal file
@ -0,0 +1,18 @@
|
||||
import * as React from "react"
|
||||
import Svg, { Path, SvgProps } from "react-native-svg"
|
||||
const NavToDosIcon: React.FC<SvgProps> = (props) => (
|
||||
<Svg
|
||||
width={30}
|
||||
height={30}
|
||||
fill="none"
|
||||
{...props}
|
||||
>
|
||||
<Path
|
||||
fill="#8005EB"
|
||||
stroke="#8005EB"
|
||||
strokeWidth={0.5}
|
||||
d="M15.038 29.649c-7.953 0-14.4-6.447-14.4-14.4s6.447-14.4 14.4-14.4 14.4 6.447 14.4 14.4-6.447 14.4-14.4 14.4Zm0-1.44c7.157 0 12.96-5.802 12.96-12.96 0-7.158-5.803-12.96-12.96-12.96-7.158 0-12.96 5.802-12.96 12.96 0 7.158 5.802 12.96 12.96 12.96Zm4.53-17.07a.72.72 0 1 1 1.019 1.019l-7.2 7.2a.72.72 0 0 1-1.018 0l-2.88-2.88a.72.72 0 1 1 1.018-1.018l2.37 2.37 6.692-6.69Z"
|
||||
/>
|
||||
</Svg>
|
||||
)
|
||||
export default NavToDosIcon
|
||||
23
assets/svgs/PrivacyPolicyIcon.tsx
Normal file
23
assets/svgs/PrivacyPolicyIcon.tsx
Normal file
@ -0,0 +1,23 @@
|
||||
import * as React from "react"
|
||||
import Svg, { Path, SvgProps } from "react-native-svg"
|
||||
const PrivacyPolicyIcon: React.FC<SvgProps> = (props) => (
|
||||
<Svg
|
||||
width={props.width ||20}
|
||||
height={props.height ||22}
|
||||
fill="none"
|
||||
{...props}
|
||||
>
|
||||
<Path
|
||||
stroke={props.color || "#6C645B"}
|
||||
strokeWidth={1.2}
|
||||
d="M1.413 8.656c0-3.7 0-5.55 1.15-6.7 1.15-1.15 3-1.15 6.7-1.15h1.962c3.7 0 5.55 0 6.7 1.15 1.149 1.15 1.149 3 1.149 6.7v3.925c0 3.7 0 5.55-1.15 6.7-1.15 1.149-3 1.149-6.7 1.149H9.263c-3.7 0-5.55 0-6.7-1.15-1.149-1.15-1.149-3-1.149-6.7V8.657Z"
|
||||
/>
|
||||
<Path
|
||||
stroke={props.color || "#6C645B"}
|
||||
strokeLinecap="round"
|
||||
strokeWidth={1.2}
|
||||
d="M6.324 10.617h7.85M6.324 6.694h7.85M6.324 14.541h4.906"
|
||||
/>
|
||||
</Svg>
|
||||
)
|
||||
export default PrivacyPolicyIcon
|
||||
26
assets/svgs/ProfileIcon.tsx
Normal file
26
assets/svgs/ProfileIcon.tsx
Normal file
@ -0,0 +1,26 @@
|
||||
import * as React from "react"
|
||||
import Svg, { Path, SvgProps } from "react-native-svg"
|
||||
const ProfileIcon: React.FC<SvgProps> = (props) => (
|
||||
<Svg
|
||||
width={21}
|
||||
height={21}
|
||||
fill="none"
|
||||
{...props}
|
||||
>
|
||||
<Path
|
||||
stroke={props.color || "red"}
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={1.414}
|
||||
d="M10.956 11.538a.91.91 0 0 0-.226 0 3.083 3.083 0 0 1-2.98-3.084 3.089 3.089 0 0 1 3.093-3.093 3.09 3.09 0 0 1 .113 6.176ZM17.199 17.762a9.368 9.368 0 0 1-6.356 2.47 9.368 9.368 0 0 1-6.356-2.47c.095-.886.66-1.754 1.67-2.433 2.583-1.716 6.808-1.716 9.373 0 1.009.68 1.575 1.547 1.669 2.433Z"
|
||||
/>
|
||||
<Path
|
||||
stroke={props.color || "red"}
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={1.414}
|
||||
d="M10.843 20.233a9.43 9.43 0 1 0 0-18.86 9.43 9.43 0 0 0 0 18.86Z"
|
||||
/>
|
||||
</Svg>
|
||||
)
|
||||
export default ProfileIcon
|
||||
@ -6,6 +6,9 @@ import CalendarSettingsPage from "./CalendarSettingsPage";
|
||||
import ChoreRewardSettings from "./ChoreRewardSettings";
|
||||
import UserSettings from "./UserSettings";
|
||||
import { AuthContextProvider } from "@/contexts/AuthContext";
|
||||
import ProfileIcon from "@/assets/svgs/ProfileIcon";
|
||||
import CalendarIcon from "@/assets/svgs/CalendarIcon";
|
||||
import PrivacyPolicyIcon from "@/assets/svgs/PrivacyPolicyIcon";
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
mainBtn: {
|
||||
@ -34,12 +37,7 @@ const SettingsPage = () => {
|
||||
label="Manage my profile"
|
||||
color="#07b8c7"
|
||||
iconSource={() => (
|
||||
<Ionicons
|
||||
name="person-circle-sharp"
|
||||
size={24}
|
||||
color="#07b8c7"
|
||||
style={{ marginRight: 10 }}
|
||||
/>
|
||||
<ProfileIcon style={{marginRight: 10}} color="#07b9c8" />
|
||||
)}
|
||||
onPress={() => setSelectedPage(pageIndex.user)}
|
||||
/>
|
||||
@ -49,12 +47,7 @@ const SettingsPage = () => {
|
||||
label="Calendar settings"
|
||||
color="#fd1775"
|
||||
iconSource={() => (
|
||||
<Ionicons
|
||||
name="home-outline"
|
||||
size={24}
|
||||
color="#fd1775"
|
||||
style={{ marginRight: 10 }}
|
||||
/>
|
||||
<CalendarIcon style={{marginRight: 10}}/>
|
||||
)}
|
||||
onPress={() => {
|
||||
setSelectedPage(pageIndex.calendar);
|
||||
@ -80,12 +73,7 @@ const SettingsPage = () => {
|
||||
style={styles.mainBtn}
|
||||
label="Kaly privacy policy"
|
||||
iconSource={() => (
|
||||
<Entypo
|
||||
name="text-document"
|
||||
size={24}
|
||||
color="#6c645b"
|
||||
style={{ marginRight: 10 }}
|
||||
/>
|
||||
<PrivacyPolicyIcon style={{marginRight: 10}}/>
|
||||
)}
|
||||
color="#6c645b"
|
||||
/>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { View, Text, Button, Switch } from "react-native-ui-lib";
|
||||
import React, { useState } from "react";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import PointsSlider from "@/components/shared/PointsSlider";
|
||||
import { repeatOptions, useToDosContext } from "@/contexts/ToDosContext";
|
||||
import { Feather, AntDesign, Ionicons } from "@expo/vector-icons";
|
||||
@ -27,6 +27,15 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
|
||||
const [rotate, setRotate] = useState<boolean>(false);
|
||||
const [repeatType, setRepeatType] = useState<string>("Every week");
|
||||
|
||||
const handleCLose = () => {
|
||||
setNewTitle("");
|
||||
setPoints(10);
|
||||
setChoreDate(new Date());
|
||||
setRotate(false);
|
||||
setRepeatType("every week");
|
||||
addChoreDialogProps.setIsVisible(false);
|
||||
};
|
||||
|
||||
const handleChange = (text: string) => {
|
||||
const numericValue = parseInt(text, 10);
|
||||
|
||||
@ -41,7 +50,7 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
|
||||
bottom={true}
|
||||
height={"90%"}
|
||||
panDirection={PanningDirectionsEnum.DOWN}
|
||||
onDismiss={() => addChoreDialogProps.setIsVisible(false)}
|
||||
onDismiss={() => handleCLose}
|
||||
containerStyle={{
|
||||
borderRadius: 10,
|
||||
backgroundColor: "white",
|
||||
@ -59,13 +68,13 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
|
||||
style={styles.topBtn}
|
||||
label="Cancel"
|
||||
onPress={() => {
|
||||
addChoreDialogProps.setIsVisible(false);
|
||||
handleCLose();
|
||||
}}
|
||||
/>
|
||||
<View marginT-12>
|
||||
<DropModalIcon
|
||||
onPress={() => {
|
||||
addChoreDialogProps.setIsVisible(false);
|
||||
handleCLose()
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
@ -84,7 +93,7 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
|
||||
rotate: rotate,
|
||||
repeatType: repeatType,
|
||||
});
|
||||
addChoreDialogProps.setIsVisible(false);
|
||||
handleCLose();
|
||||
console.log(toDos);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
|
||||
Reference in New Issue
Block a user