bartronx7/aretherecookies-mobile
1
0
Fork 0
mirror of https://gitlab.com/wheres-the-tp/ui-mobile.git synced 2026-01-25 04:24:56 -06:00
Code Issues Projects Releases Packages Wiki Activity Actions

Lots of style updates

Browse source
This commit is contained in:
Erick Clark 2020-01-19 22:59:57 -06:00
parent d0654b55a2
commit 514240112f
8 changed files with 41 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
design_files/arc-wireframes2.2.xd
View file

Binary file not shown.

4
js/components/PickerItemRow.js
View file

@ -17,8 +17,8 @@ const PickerItemRow = ({ isSelected, onPress, text = { text } }) => {
return (
<>
<TouchableOpacity onPress={onPress} style={pickerItemRowContainerStyle}>
<Text style={{ color, fontSize: 18 }}>{text}</Text>
{!!isSelected && <Icon name="check-circle" size={20} style={{ color }} />}
<Text style={{ color, fontSize: 16 }}>{text}</Text>
{!!isSelected && <Icon name="check" size={22} style={{ color }} />}
</TouchableOpacity>
<Divider />
</>

13
js/components/TopToolbar.js
View file

@ -89,18 +89,7 @@ class TopToolbar extends Component {
const searchPlaceholder = /\/food/.test(route) ? 'Search Food...' : 'Search Places...';
return (
<View style={{
backgroundColor: palette.primaryColor,
shadowRadius: 2,
shadowOpacity: 0.24,
shadowColor: 'black',
shadowOffset: {
height: 2,
width: 0,
},
elevation: 2,
}}
>
<View style={{backgroundColor: palette.primaryColor}}>
<SafeAreaView>
{!showSearch && (
<Toolbar

8
js/modals/FilterModal.js
View file

@ -36,7 +36,7 @@ type Props = {
const rowStyle = { flexDirection: 'row', justifyContent: 'space-between', padding: 15 };
const selectedItemText = { marginTop: 10, color: theme.palette.disabledColor };
const selectedItemText = { marginTop: 10, color: theme.palette.atcStdGrey };
const FilterModal = (props: Props) => {
const {
@ -74,7 +74,7 @@ const FilterModal = (props: Props) => {
return (
<View key={category}>
<TouchableOpacity style={rowStyle} onPress={toggleCategory(category, isChecked)}>
<Text style={{ fontSize: 15 }}>{getCategoryText(category)}</Text>
<Text style={{ fontSize: 16 }}>{getCategoryText(category)}</Text>
<View style={{ width: 40 }}>
<Checkbox
value={isChecked ? 0 : 1}
@ -91,14 +91,14 @@ const FilterModal = (props: Props) => {
<TouchableOpacity
style={[rowStyle, { flexDirection: 'column' }]}
onPress={toggleOrderByModalOpen}>
<Text>Sort By</Text>
<Text style={{ fontSize: 16 }}>Sort By</Text>
<Text style={selectedItemText}>{getOrderbyText(orderby)}</Text>
</TouchableOpacity>
<Divider />
<TouchableOpacity
style={[rowStyle, { flexDirection: 'column' }]}
onPress={toggleRadiusModalOpen}>
<Text>Search Radius</Text>
<Text style={{ fontSize: 16 }}>Search Radius</Text>
<Text style={selectedItemText}>{radius} miles</Text>
</TouchableOpacity>
<Divider />

9
js/pages/CreateFoodItem.js
View file

@ -57,13 +57,14 @@ type GooglePlaceObject = {
};
const fieldStyle = {
paddingTop: 30,
paddingTop: 24,
paddingLeft: 8,
paddingRight: 8,
};
const fieldNameStyle = {
fontSize: 18,
paddingBottom: 10,
paddingLeft: 10,
fontSize: 16,
paddingBottom: 8,
};
const Field = ({

34
js/pages/LoginPage.js
View file

@ -77,15 +77,12 @@ const LoginPageComponent = ({
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'flex-start',
padding: 20,
borderWidth: 1,
borderColor: 'pink',
}}>
{error && <Text style={{ fontSize: 16, color: 'red', fontWeight: 'bold' }}>{error}</Text>}
{error && <Text style={{ fontSize: 16, color: '#721c24', backgroundColor: '#f8d7da', padding: 16,}}>{error}</Text>}
<Text style={{ fontSize: 64, fontWeight: '600' }}>Sign In</Text>
<Text style={{ fontSize: 42, fontWeight: '300', margin: 16 }}>Sign In</Text>
<View style={{ flexDirection: 'row', marginTop: 20 }}>
<View style={{ flexDirection: 'row', padding: 16, paddingBottom: 0 }}>
<View style={{ flex: 1, flexDirection: 'column' }}>
<TextInput
editable={true}
@ -93,7 +90,8 @@ const LoginPageComponent = ({
placeholder="Email"
onChangeText={setEmail}
style={{
fontSize: 18,
fontSize: 16,
paddingLeft: 0
}}
/>
<Divider />
@ -101,7 +99,7 @@ const LoginPageComponent = ({
</View>
{isNewUser && (
<View style={{ flexDirection: 'row', marginTop: 20 }}>
<View style={{ flexDirection: 'row', padding: 16, paddingBottom: 0 }}>
<View style={{ flex: 1, flexDirection: 'column' }}>
<TextInput
editable={true}
@ -109,7 +107,8 @@ const LoginPageComponent = ({
placeholder="Username"
onChangeText={setUsername}
style={{
fontSize: 18,
fontSize: 16,
paddingLeft: 0
}}
/>
<Divider />
@ -117,7 +116,7 @@ const LoginPageComponent = ({
</View>
)}
<View style={{ flexDirection: 'row', marginTop: 20 }}>
<View style={{ flexDirection: 'row', padding: 16, paddingBottom: 0 }}>
<View style={{ flex: 1, flexDirection: 'column' }}>
<TextInput
editable={true}
@ -126,15 +125,16 @@ const LoginPageComponent = ({
placeholder="Password"
onChangeText={setPassword}
style={{
fontSize: 18,
fontSize: 16,
paddingLeft: 0
}}
/>
<Divider />
</View>
</View>
<View style={{ flexDirection: 'row', marginTop: 20 }}>
<View style={{ flex: 1, flexDirection: 'column', paddingTop: 20 }}>
<View style={{ flexDirection: 'row', padding: 16, paddingBottom: 0, paddingTop: 32 }}>
<View style={{ flex: 1, flexDirection: 'column', }}>
<Button title={submitTitle} onPress={submitAction} color={theme.palette.primaryColor} />
</View>
</View>
@ -142,7 +142,7 @@ const LoginPageComponent = ({
{!isNewUser && (
<TouchableOpacity
onPress={() => setIsNewUser(true)}
style={{ flexDirection: 'row', marginTop: 20, padding: 20 }}>
style={{ flexDirection: 'row', marginTop: 16, padding: 16, paddingBottom: 0 }}>
<Text
style={{
flex: 1,
@ -160,7 +160,7 @@ const LoginPageComponent = ({
style={{
flexDirection: 'row',
marginTop: 0,
padding: 20,
padding:16,
alignItems: 'center',
justifyContent: 'center',
}}>
@ -173,7 +173,7 @@ const LoginPageComponent = ({
}}>
Forgot your pasword?
</Text>
<Icon name="launch" color={theme.palette.primaryColor} size={18} />
<Icon name="launch" color={theme.palette.primaryColor} size={16} />
</TouchableOpacity>
</View>
);
@ -202,7 +202,7 @@ export default compose(
await AuthManager.authenticate({ email, password });
checkAuth();
} catch (err) {
setError('Login Failed! Please check the username and password and try again.');
setError('You have entered an invalid username or password. Please try again.');
}
},
}),

14
js/pages/ProfilePage.js
View file

@ -39,14 +39,14 @@ export const ProfilePage = (props: Props) => {
} = props;
const usingGPS = zipcode === 'usegps';
return (
<View style={{ flex: 1, flexDirection: 'column', padding: 15 }}>
<Text style={{ fontSize: 32, marginBottom: 20, color: '#555555' }}>Profile</Text>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<Text style={{ fontSize: 18 }}>Use My Location</Text>
<View style={{ flex: 1, flexDirection: 'column', }}>
<Text style={{ fontSize: 42, marginBottom: 8, color: '000', padding: 16 }}>Profile</Text>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', borderColor: '#ccc', borderTopWidth: 1, borderBottomWidth: 1, padding: 16 }}>
<Text style={{ fontSize: 16 }}>Use My Location</Text>
<Switch value={usingGPS} onValueChange={toggleGPS} />
</View>
{!usingGPS && (
<View style={{ flexDirection: 'row' }}>
<View style={{ flexDirection: 'row', padding: 16 }}>
<View
style={{
flex: 1,
@ -62,14 +62,14 @@ export const ProfilePage = (props: Props) => {
onEndEditing={saveZip}
keyboardType="numeric"
style={{
fontSize: 18,
fontSize: 16,
}}
/>
</View>
</View>
)}
{!!error && <Text style={{ fontSize: 16, color: 'red' }}>{error}</Text>}
<View style={{ marginTop: 20 }}>
<View style={{ marginTop: 16, padding: 8 }}>
{isLoggedIn && (
<IconButton
glyph="exit-to-app"

17
js/ui-theme.js
View file

@ -48,7 +48,7 @@ export default {
backgroundColor: 'white',
},
divider: {
container: { height: 2 },
container: { height: 1 },
},
topTabs: {
selectedUnderlineStyle: {
@ -79,7 +79,7 @@ export default {
color: COLOR.black,
},
itemPlaceStyle: {
color: 'palette.atcStdGrey',
color: palette.atcStdGrey,
paddingTop: 1,
},
availableCountStyle: {
@ -141,16 +141,9 @@ export default {
paddingTop: 8,
justifyContent: 'space-around',
alignItems: 'baseline',
borderWidth: 0,
backgroundColor : "#0000",
shadowRadius: 2,
shadowOpacity: 0.24,
shadowColor: 'black',
shadowOffset: {
height: 2,
width: 0,
},
elevation: 2,
borderWidth: 1,
borderColor: '#fff',
borderTopColor: '#ccc',
},
},
bottomNavigationAction: {