@ -1,41 +1,38 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { StyleSheet } from 'react-native';
|
import {StyleSheet, View } from 'react-native';
|
||||||
import TopBar from './components/TopBar';
|
import ProfileModification from './components/ProfileModification';
|
||||||
import { SafeAreaProvider } from 'react-native-safe-area-context';
|
import ValidateButton from './components/ValidateButton';
|
||||||
import RecipeSuggestion from './screens/RecipeSuggestion';
|
import { LinearGradient } from 'expo-linear-gradient';
|
||||||
import RecipeDetails from './screens/RecipeDetails';
|
|
||||||
import IngredientSelection from './screens/IngredientSelection';
|
|
||||||
|
|
||||||
const generateList = () => {
|
|
||||||
const list = [];
|
|
||||||
list.push('Apple');
|
|
||||||
list.push('Pineapple');
|
|
||||||
list.push('Tomato');
|
|
||||||
list.push('Meat')
|
|
||||||
list.push('d)àrok');
|
|
||||||
list.push('dddd');
|
|
||||||
list.push('fff');
|
|
||||||
list.push('fffgg')
|
|
||||||
list.push('Apple');
|
|
||||||
return list;
|
|
||||||
};
|
|
||||||
|
|
||||||
export default function App() {
|
export default function App() {
|
||||||
const imageList = [];
|
const all = [{value: "Mussels"}, {value: "Skimmed Milk"}, {value: "Nuts"}]
|
||||||
const list = generateList();
|
const die = [{value: "Dairy free"}, {value: "Gluten free"}, {value: "Porkless"}, {value: "Vegan"}, {value: "Vegetarian"}, {value: "Pescatarian"}]
|
||||||
|
|
||||||
return (
|
return (
|
||||||
/*<RecipeDetails number="34" title="Flambé banane" duree="04H00"></RecipeDetails>*/
|
<View style={styles.container}>
|
||||||
/*<RecipeSuggestion list={list}></RecipeSuggestion>*/
|
<LinearGradient colors={['#2680AA', '#59BDCD']} style={styles.linearGradient}>
|
||||||
<IngredientSelection list={list}></IngredientSelection>
|
<ProfileModification name="Johnny Silverhand" avatar="plus.png" diets={die} allergies={all}></ProfileModification>
|
||||||
|
<View style={{marginTop: 10}}/>
|
||||||
|
<ValidateButton title="Update Profile" image="update.png" colour="#ACA279" backColour="#F2F0E4"></ValidateButton>
|
||||||
|
</LinearGradient>
|
||||||
|
</View>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
const styles = StyleSheet.create({
|
||||||
container: {
|
container: {
|
||||||
flex: 1,
|
flex: 1,
|
||||||
backgroundColor: '#fff',
|
backgroundColor: '#3F3C42',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
},
|
},
|
||||||
|
linearGradient: {
|
||||||
|
//height: 844,
|
||||||
|
//width: 390,
|
||||||
|
flex: 1,
|
||||||
|
padding: 10,
|
||||||
|
paddingTop: 0,
|
||||||
|
//backgroundColor: "#59BDCD",
|
||||||
|
//alignItems: 'center',
|
||||||
|
//justifyContent: 'flex-start',
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
After Width: | Height: | Size: 323 B |
|
After Width: | Height: | Size: 5.9 KiB |
|
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 9.6 KiB |
@ -0,0 +1,102 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import {StyleSheet, Text, TextInput, View, Image, FlatList} from 'react-native';
|
||||||
|
import ValidateButton from './ValidateButton';
|
||||||
|
import HeaderFlatList from './HeaderFlatList';
|
||||||
|
import { MultipleSelectList, SelectList } from 'react-native-dropdown-select-list'
|
||||||
|
|
||||||
|
type AllergiesProps = {
|
||||||
|
title: string
|
||||||
|
content : list<string>
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function AllergiesTab(props: AllergiesProps) {
|
||||||
|
const [selected, setSelected] = React.useState([]);
|
||||||
|
const data = [
|
||||||
|
{key:'1', value:'Dairy free'},
|
||||||
|
{key:'2', value:'Gluten free'},
|
||||||
|
{key:'3', value:'Porkless'},
|
||||||
|
{key:'4', value:'Vegan'},
|
||||||
|
{key:'5', value:'Vegetatian'},
|
||||||
|
{key:'6', value:'Pescatarian'},
|
||||||
|
]
|
||||||
|
return (
|
||||||
|
<MultipleSelectList
|
||||||
|
data={props.content}
|
||||||
|
save="value"
|
||||||
|
search={false}
|
||||||
|
arrowicon={<Image source={require("../assets/images/arrow.png")} style={styles.arrow}></Image>}
|
||||||
|
boxStyles={styles.titleBar}
|
||||||
|
inputStyles={styles.title}
|
||||||
|
dropdownStyles={styles.itemList}
|
||||||
|
dropdownItemStyles={styles.itemCell}
|
||||||
|
dropdownTextStyles={styles.itemText}
|
||||||
|
checkBoxStyles={styles.box}
|
||||||
|
placeholder={props.title}
|
||||||
|
label={props.title}/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
titleBar: {
|
||||||
|
flexDirection: "row",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "stretch",
|
||||||
|
minHeight: 25,
|
||||||
|
backgroundColor: "#F2F0E4",
|
||||||
|
borderTopRightRadius: 15,
|
||||||
|
borderTopLeftRadius: 15,
|
||||||
|
borderBottomRightRadius: 0,
|
||||||
|
borderBottomLeftRadius: 0,
|
||||||
|
borderWidth: 2,
|
||||||
|
borderColor: "#ACA279",
|
||||||
|
width: 330,
|
||||||
|
marginBottom: 0,
|
||||||
|
overflow: "hidden",
|
||||||
|
},
|
||||||
|
arrow: {
|
||||||
|
height: 20,
|
||||||
|
width: 20,
|
||||||
|
resizeMode: 'contain',
|
||||||
|
tintColor: "#3F3C42",
|
||||||
|
flex: 0.1,
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
fontSize: 15,
|
||||||
|
color: '#3F3C42',
|
||||||
|
alignItems: 'center',
|
||||||
|
textAlign: "left",
|
||||||
|
flex: 0.9,
|
||||||
|
},
|
||||||
|
|
||||||
|
itemList: {
|
||||||
|
//flexDirection: "row",
|
||||||
|
alignItems: "flex-start",
|
||||||
|
//justifyContent: "stretch",
|
||||||
|
borderWidth: 0,
|
||||||
|
borderTopRightRadius: 0,
|
||||||
|
borderTopLeftRadius: 0,
|
||||||
|
borderBottomRightRadius: 15,
|
||||||
|
borderBottomLeftRadius: 15,
|
||||||
|
backgroundColor: "#E3DEC9",
|
||||||
|
width: 330,
|
||||||
|
},
|
||||||
|
itemCell: {
|
||||||
|
maxHeight: 30,
|
||||||
|
flex: 1,
|
||||||
|
padding: 0,
|
||||||
|
paddingLeft: 10,
|
||||||
|
},
|
||||||
|
itemText: {
|
||||||
|
fontSize: 13,
|
||||||
|
textAlign: "left",
|
||||||
|
flex: 1,
|
||||||
|
padding: 5,
|
||||||
|
paddingLeft: 10,
|
||||||
|
color: "#3F3C42",
|
||||||
|
},
|
||||||
|
|
||||||
|
box: {
|
||||||
|
borderWidth: 0,
|
||||||
|
flex: 0,
|
||||||
|
}
|
||||||
|
});
|
||||||
@ -0,0 +1,97 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import {StyleSheet, Text, TextInput, View, Image, FlatList} from 'react-native';
|
||||||
|
import ValidateButton from './ValidateButton';
|
||||||
|
import HeaderFlatList from './HeaderFlatList';
|
||||||
|
import { MultipleSelectList, SelectList } from 'react-native-dropdown-select-list'
|
||||||
|
|
||||||
|
type DietsProps = {
|
||||||
|
title: string
|
||||||
|
content : list<string>
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function DietsTab(props: DietsProps) {
|
||||||
|
const [selected, setSelected] = React.useState([]);
|
||||||
|
const data = [
|
||||||
|
{key:'1', value:'Dairy free'},
|
||||||
|
{key:'2', value:'Gluten free'},
|
||||||
|
{key:'3', value:'Porkless'},
|
||||||
|
{key:'4', value:'Vegan'},
|
||||||
|
{key:'5', value:'Vegetatian'},
|
||||||
|
{key:'6', value:'Pescatarian'},
|
||||||
|
]
|
||||||
|
return (
|
||||||
|
<MultipleSelectList
|
||||||
|
setSelected={(val) => setSelected(val)}
|
||||||
|
data={props.content}
|
||||||
|
save="value"
|
||||||
|
search={false}
|
||||||
|
arrowicon={<Image source={require("../assets/images/arrow.png")} style={styles.arrow}></Image>}
|
||||||
|
boxStyles={styles.titleBar}
|
||||||
|
inputStyles={styles.title}
|
||||||
|
dropdownStyles={styles.itemList}
|
||||||
|
dropdownItemStyles={styles.itemCell}
|
||||||
|
dropdownTextStyles={styles.itemText}
|
||||||
|
placeholder={props.title}
|
||||||
|
label={props.title}/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
titleBar: {
|
||||||
|
flexDirection: "row",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "stretch",
|
||||||
|
minHeight: 25,
|
||||||
|
backgroundColor: "#F2F0E4",
|
||||||
|
borderTopRightRadius: 15,
|
||||||
|
borderTopLeftRadius: 15,
|
||||||
|
borderBottomRightRadius: 0,
|
||||||
|
borderBottomLeftRadius: 0,
|
||||||
|
borderWidth: 2,
|
||||||
|
borderColor: "#ACA279",
|
||||||
|
width: 330,
|
||||||
|
marginBottom: 0,
|
||||||
|
overflow: "hidden",
|
||||||
|
},
|
||||||
|
arrow: {
|
||||||
|
height: 20,
|
||||||
|
width: 20,
|
||||||
|
resizeMode: 'contain',
|
||||||
|
tintColor: "#3F3C42",
|
||||||
|
flex: 0.1,
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
fontSize: 15,
|
||||||
|
color: '#3F3C42',
|
||||||
|
alignItems: 'center',
|
||||||
|
textAlign: "left",
|
||||||
|
flex: 0.9,
|
||||||
|
},
|
||||||
|
|
||||||
|
itemList: {
|
||||||
|
//flexDirection: "row",
|
||||||
|
alignItems: "flex-start",
|
||||||
|
//justifyContent: "stretch",
|
||||||
|
borderWidth: 0,
|
||||||
|
borderTopRightRadius: 0,
|
||||||
|
borderTopLeftRadius: 0,
|
||||||
|
borderBottomRightRadius: 15,
|
||||||
|
borderBottomLeftRadius: 15,
|
||||||
|
backgroundColor: "#E3DEC9",
|
||||||
|
width: 330,
|
||||||
|
},
|
||||||
|
itemCell: {
|
||||||
|
maxHeight: 30,
|
||||||
|
flex: 1,
|
||||||
|
padding: 0,
|
||||||
|
paddingLeft: 10,
|
||||||
|
},
|
||||||
|
itemText: {
|
||||||
|
fontSize: 13,
|
||||||
|
textAlign: "left",
|
||||||
|
flex: 1,
|
||||||
|
padding: 5,
|
||||||
|
paddingLeft: 10,
|
||||||
|
color: "#3F3C42",
|
||||||
|
},
|
||||||
|
});
|
||||||
@ -0,0 +1,45 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import {StyleSheet, Text, TextInput, View, Image, FlatList} from 'react-native';
|
||||||
|
|
||||||
|
type TitleProps = {
|
||||||
|
title: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function ListTab(props: TitleProps) {
|
||||||
|
return (
|
||||||
|
<View style={styles.titleBar}>
|
||||||
|
<Text style={styles.title}>{props.title}</Text>
|
||||||
|
<Image source={require("../assets/images/arrow.png")} style={styles.arrow}></Image>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
titleBar: {
|
||||||
|
flexDirection: "row",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "stretch",
|
||||||
|
backgroundColor: "#F2F0E4",
|
||||||
|
borderTopRightRadius: 15,
|
||||||
|
borderTopLeftRadius: 15,
|
||||||
|
borderWidth: 2,
|
||||||
|
borderColor: "#ACA279",
|
||||||
|
width: 330,
|
||||||
|
},
|
||||||
|
arrow: {
|
||||||
|
height: 20,
|
||||||
|
width: 20,
|
||||||
|
resizeMode: 'contain',
|
||||||
|
tintColor: "#3F3C42",
|
||||||
|
flex: 0.1,
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
fontSize: 12,
|
||||||
|
color: '#3F3C42',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'left',
|
||||||
|
textAlign: "left",
|
||||||
|
flex: 0.9,
|
||||||
|
padding: 5,
|
||||||
|
},
|
||||||
|
});
|
||||||
@ -0,0 +1,80 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import {StyleSheet, Text, TextInput, View, Image, FlatList} from 'react-native';
|
||||||
|
import ValidateButton from './ValidateButton';
|
||||||
|
import HeaderFlatList from './HeaderFlatList';
|
||||||
|
|
||||||
|
type ListProps = {
|
||||||
|
title: string
|
||||||
|
content : list<string>
|
||||||
|
}
|
||||||
|
|
||||||
|
type ItemProps = {value: string}
|
||||||
|
|
||||||
|
const Item = ({value}: ItemProps) => (
|
||||||
|
<View style={styles.itemList}>
|
||||||
|
<Text style={styles.itemText}>{value}</Text>
|
||||||
|
</View>
|
||||||
|
)
|
||||||
|
|
||||||
|
export default function ListTab(props: ListProps) {
|
||||||
|
return (
|
||||||
|
<View style={styles.background}>
|
||||||
|
<View>
|
||||||
|
<FlatList data={props.content} renderItem={({item}) => <Item value={item.value}/>} ListHeaderComponent={<HeaderFlatList title={props.title}/>}/>
|
||||||
|
</View>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
background: {
|
||||||
|
flexDirection: 'column',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
borderRadius: 15,
|
||||||
|
backgroundColor: '#E3DEC9',
|
||||||
|
marginBottom: 20,
|
||||||
|
},
|
||||||
|
titleBar: {
|
||||||
|
flexDirection: "row",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "stretch",
|
||||||
|
backgroundColor: "#F2F0E4",
|
||||||
|
borderTopRightRadius: 15,
|
||||||
|
borderTopLeftRadius: 15,
|
||||||
|
borderWidth: 2,
|
||||||
|
borderColor: "#ACA279",
|
||||||
|
width: 250,
|
||||||
|
},
|
||||||
|
arrow: {
|
||||||
|
height: 20,
|
||||||
|
width: 20,
|
||||||
|
resizeMode: 'contain',
|
||||||
|
tintColor: "#3F3C42",
|
||||||
|
flex: 0.5,
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
fontSize: 15,
|
||||||
|
color: '#3F3C42',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'left',
|
||||||
|
textAlign: "left",
|
||||||
|
flex: 0.5,
|
||||||
|
padding: 5,
|
||||||
|
},
|
||||||
|
|
||||||
|
itemList: {
|
||||||
|
flexDirection: "row",
|
||||||
|
alignItems: "flex-start",
|
||||||
|
justifyContent: "stretch",
|
||||||
|
width: 330,
|
||||||
|
},
|
||||||
|
itemText: {
|
||||||
|
fontSize: 13,
|
||||||
|
textAlign: "left",
|
||||||
|
flex: 1,
|
||||||
|
padding: 5,
|
||||||
|
paddingLeft: 10,
|
||||||
|
color: "#3F3C42",
|
||||||
|
},
|
||||||
|
});
|
||||||
@ -0,0 +1,113 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import {StyleSheet, Text, TextInput, View, Image} from 'react-native';
|
||||||
|
import ValidateButton from './ValidateButton';
|
||||||
|
import ListTab from './ListTab';
|
||||||
|
import DietsTab from './DietsTab';
|
||||||
|
import AllergiesTab from './AllergiesTab';
|
||||||
|
|
||||||
|
type ProfileProps = {
|
||||||
|
name: string
|
||||||
|
avatar: string
|
||||||
|
diets: list<string>
|
||||||
|
allergies: list<string>
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function ProfileModification(props: ProfileProps) {
|
||||||
|
return (
|
||||||
|
<View style={styles.background}>
|
||||||
|
<View style={styles.pseudoBar}>
|
||||||
|
<Image source={require("../assets/images/"+props.avatar)} style={styles.avatar}></Image>
|
||||||
|
<TextInput style={styles.textInput} value={props.name}></TextInput>
|
||||||
|
<Image source={require("../assets/images/modify.png")} style={styles.modify}></Image>
|
||||||
|
</View>
|
||||||
|
<View style={styles.filterBar}>
|
||||||
|
<Text style={styles.filters}>Filters</Text>
|
||||||
|
<Text style={styles.nbSelected}>3 selected</Text>
|
||||||
|
</View>
|
||||||
|
<DietsTab title="Diets" content={props.diets}></DietsTab>
|
||||||
|
<View style={{marginTop: 10}}/>
|
||||||
|
<AllergiesTab title="Allergies" content={props.allergies}></AllergiesTab>
|
||||||
|
<View style={{marginTop: 10}}/>
|
||||||
|
<ListTab title="Diets" content={props.diets}></ListTab>
|
||||||
|
<ListTab title="Allergies" content={props.allergies}></ListTab>
|
||||||
|
<ValidateButton title="Add Allergy" image="plus.png" colour="#59BDCD" backColour="#E3DEC9"></ValidateButton>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
background: {
|
||||||
|
width: 370,
|
||||||
|
flexDirection: 'column',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
borderRadius: 15,
|
||||||
|
backgroundColor: '#F2F0E4',
|
||||||
|
padding: 10,
|
||||||
|
},
|
||||||
|
pseudoBar: {
|
||||||
|
flexDirection: "row",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
flex: 0.7,
|
||||||
|
width: 330,
|
||||||
|
marginBottom: 10,
|
||||||
|
},
|
||||||
|
avatar: {
|
||||||
|
padding: 20,
|
||||||
|
resizeMode: 'contain',
|
||||||
|
borderWidth: 2,
|
||||||
|
borderColor: "#ACA279",
|
||||||
|
borderRadius: 45,
|
||||||
|
},
|
||||||
|
textInput: {
|
||||||
|
flex: 0.5,
|
||||||
|
fontSize: 15,
|
||||||
|
color: '#ACA279',
|
||||||
|
width : 150,
|
||||||
|
borderRadius: 10,
|
||||||
|
borderWidth: 2,
|
||||||
|
borderStyle: 'dashed',
|
||||||
|
borderColor: '#ACA279',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'left',
|
||||||
|
flex: 0.8,
|
||||||
|
marginLeft: 20,
|
||||||
|
padding: 5,
|
||||||
|
},
|
||||||
|
modify: {
|
||||||
|
height: 20,
|
||||||
|
width: 20,
|
||||||
|
tintColor: "#ACA279",
|
||||||
|
resizeMode: 'contain',
|
||||||
|
flex: 0.1,
|
||||||
|
marginLeft: 5,
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
filterBar: {
|
||||||
|
flexDirection: "row",
|
||||||
|
width: 300,
|
||||||
|
paddingTop: 10,
|
||||||
|
paddingBottom: 5,
|
||||||
|
alignItems: "flex-end",
|
||||||
|
justifyContent: "center",
|
||||||
|
flex: 0.2,
|
||||||
|
},
|
||||||
|
filters: {
|
||||||
|
flex: 0.5,
|
||||||
|
fontSize: 20,
|
||||||
|
color: '#ACA279',
|
||||||
|
flex: 1,
|
||||||
|
padding: 5,
|
||||||
|
paddingLeft: 0,
|
||||||
|
paddingBottom: 0,
|
||||||
|
},
|
||||||
|
nbSelected: {
|
||||||
|
fontSize: 11,
|
||||||
|
flex: 1,
|
||||||
|
color: "#3F3C42",
|
||||||
|
textAlign: "right",
|
||||||
|
}
|
||||||
|
});
|
||||||
@ -0,0 +1,80 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import {StyleSheet, Pressable, Text, View, Image} from 'react-native';
|
||||||
|
|
||||||
|
|
||||||
|
type ValidateButtonProps = {
|
||||||
|
title: string
|
||||||
|
image: string
|
||||||
|
colour: string
|
||||||
|
backColour: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function ValidateButton(props: ValidateButtonProps) {
|
||||||
|
return (
|
||||||
|
<Pressable style={{
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
borderRadius: 20,}}>
|
||||||
|
<View style={{
|
||||||
|
borderRadius: 30,
|
||||||
|
borderWidth: 2,
|
||||||
|
borderColor: props.colour,
|
||||||
|
backgroundColor: props.backColour,
|
||||||
|
alignItems: 'center',
|
||||||
|
flexDirection: "row",
|
||||||
|
padding: 5,
|
||||||
|
paddingRight: 10,}}>
|
||||||
|
<Image source={require('../assets/images/'+props.image)} style={{
|
||||||
|
height: 20,
|
||||||
|
width: 20,
|
||||||
|
marginLeft: 5,
|
||||||
|
marginRight: 10,
|
||||||
|
resizeMode: "center",
|
||||||
|
tintColor: props.colour,}}>
|
||||||
|
</Image>
|
||||||
|
<Text style={{
|
||||||
|
fontSize: 20,
|
||||||
|
color: props.colour,
|
||||||
|
}}>{props.title}</Text>
|
||||||
|
</View>
|
||||||
|
</Pressable>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
button: {
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
//width : 150,
|
||||||
|
//height: 35,
|
||||||
|
borderRadius: 20,
|
||||||
|
backgroundColor: '#F2F0E4',
|
||||||
|
},
|
||||||
|
text: {
|
||||||
|
fontSize: 20,
|
||||||
|
color: '#ACA279',
|
||||||
|
paddingLeft: 15,
|
||||||
|
flex: 0.7,
|
||||||
|
},
|
||||||
|
view: {
|
||||||
|
//width: 150,
|
||||||
|
//height: 35,
|
||||||
|
borderRadius: 20,
|
||||||
|
borderWidth: 2,
|
||||||
|
borderColor: '#ACA279',
|
||||||
|
alignItems: 'center',
|
||||||
|
flex: 1,
|
||||||
|
flexDirection: "row",
|
||||||
|
paddingLeft: 25,
|
||||||
|
paddingRight: 30,
|
||||||
|
paddingTop: 5,
|
||||||
|
paddingBottom: 5,
|
||||||
|
},
|
||||||
|
image:{
|
||||||
|
height: 20,
|
||||||
|
width: 20,
|
||||||
|
flex: 0.3,
|
||||||
|
resizeMode: "center",
|
||||||
|
tintColor: "#ACA279",
|
||||||
|
},
|
||||||
|
});
|
||||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in new issue