Skip to content

Commit 685b71f

Browse files
dragosctdragosct
authored
Merge pull request #40 from creativetimofficial/symphony-dev
shahid updates
2 parents 9f2dc15 + bc3ee16 commit 685b71f

File tree

4 files changed

+196
-195
lines changed

4 files changed

+196
-195
lines changed

‎components/DrawerItem.js‎

Lines changed: 39 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,102 +1,102 @@
1-
import React from "react";
2-
import { StyleSheet, TouchableOpacity, Linking } from "react-native";
3-
import { Block, Text, theme } from "galio-framework";
1+
import { Block, Text, theme } from 'galio-framework';
2+
import { Linking, StyleSheet, TouchableOpacity } from 'react-native';
43

5-
import Icon from "./Icon";
6-
import nowTheme from "../constants/Theme";
4+
import Icon from './Icon';
5+
import React from 'react';
6+
import nowTheme from '../constants/Theme';
77

88
class DrawerItem extends React.Component {
99
renderIcon = () => {
1010
const { title, focused } = this.props;
1111

1212
switch (title) {
13-
case "Home":
13+
case 'Home':
1414
return (
1515
<Icon
1616
name="app2x"
1717
family="NowExtra"
1818
size={18}
19-
color={focused ? nowTheme.COLORS.PRIMARY : "white"}
19+
color={focused ? nowTheme.COLORS.PRIMARY : 'black'}
2020
style={{ opacity: 0.5 }}
2121
/>
2222
);
23-
case "Components":
23+
case 'Components':
2424
return (
2525
<Icon
2626
name="atom2x"
2727
family="NowExtra"
2828
size={18}
29-
color={focused ? nowTheme.COLORS.PRIMARY : "white"}
29+
color={focused ? nowTheme.COLORS.PRIMARY : 'black'}
3030
style={{ opacity: 0.5 }}
3131
/>
3232
);
33-
case "Articles":
33+
case 'Articles':
3434
return (
3535
<Icon
3636
name="paper"
3737
family="NowExtra"
3838
size={18}
39-
color={focused ? nowTheme.COLORS.PRIMARY : "white"}
39+
color={focused ? nowTheme.COLORS.PRIMARY : 'black'}
4040
style={{ opacity: 0.5 }}
4141
/>
4242
);
43-
case "Profile":
43+
case 'Profile':
4444
return (
4545
<Icon
4646
name="profile-circle"
4747
family="NowExtra"
4848
size={18}
49-
color={focused ? nowTheme.COLORS.PRIMARY : "white"}
49+
color={focused ? nowTheme.COLORS.PRIMARY : 'black'}
5050
style={{ opacity: 0.5 }}
5151
/>
5252
);
53-
case "Account":
53+
case 'Account':
5454
return (
5555
<Icon
5656
name="badge2x"
5757
family="NowExtra"
5858
size={18}
59-
color={focused ? nowTheme.COLORS.PRIMARY : "white"}
59+
color={focused ? nowTheme.COLORS.PRIMARY : 'black'}
6060
style={{ opacity: 0.5 }}
6161
/>
6262
);
63-
case "Settings":
63+
case 'Settings':
6464
return (
6565
<Icon
6666
name="settings-gear-642x"
6767
family="NowExtra"
6868
size={18}
69-
color={focused ? nowTheme.COLORS.PRIMARY : "white"}
69+
color={focused ? nowTheme.COLORS.PRIMARY : 'black'}
7070
style={{ opacity: 0.5 }}
7171
/>
7272
);
73-
case "Examples":
73+
case 'Examples':
7474
return (
7575
<Icon
7676
name="album"
7777
family="NowExtra"
7878
size={14}
79-
color={focused ? nowTheme.COLORS.PRIMARY : "white"}
79+
color={focused ? nowTheme.COLORS.PRIMARY : 'black'}
8080
/>
8181
);
82-
case "GETTING STARTED":
82+
case 'GETTING STARTED':
8383
return (
8484
<Icon
8585
name="spaceship2x"
8686
family="NowExtra"
8787
size={18}
88-
style={{ borderColor: "rgba(0,0,0,0.5)", opacity: 0.5 }}
89-
color={focused ? nowTheme.COLORS.PRIMARY : "white"}
88+
style={{ borderColor: 'rgba(0,0,0,0.5)', opacity: 0.5 }}
89+
color={focused ? nowTheme.COLORS.PRIMARY : 'black'}
9090
/>
9191
);
92-
case "LOGOUT":
92+
case 'LOGOUT':
9393
return (
9494
<Icon
9595
name="share"
9696
family="NowExtra"
9797
size={18}
98-
style={{ borderColor: "rgba(0,0,0,0.5)", opacity: 0.5 }}
99-
color={focused ? nowTheme.COLORS.PRIMARY : "white"}
98+
style={{ borderColor: 'rgba(0,0,0,0.5)', opacity: 0.5 }}
99+
color={focused ? nowTheme.COLORS.PRIMARY : 'black'}
100100
/>
101101
);
102102
default:
@@ -109,17 +109,17 @@ class DrawerItem extends React.Component {
109109

110110
const containerStyles = [
111111
styles.defaultStyle,
112-
focused ? [styles.activeStyle, styles.shadow] : null
112+
focused ? [styles.activeStyle, styles.shadow] : null,
113113
];
114114

115115
return (
116116
<TouchableOpacity
117117
style={{ height: 60 }}
118118
onPress={() =>
119-
title == "GETTING STARTED"
120-
? Linking.openURL(
121-
"https://demos.creative-tim.com/now-ui-pro-react-native/docs/"
122-
).catch(err => console.error("An error occurred", err))
119+
title == 'GETTING STARTED'
120+
? Linking.openURL('https://demos.creative-tim.com/now-ui-pro-react-native/docs/').catch(
121+
(err) => console.error('An error occurred', err)
122+
)
123123
: navigation.navigate(title == 'LOGOUT' ? 'Onboarding' : title)
124124
}
125125
>
@@ -130,13 +130,13 @@ class DrawerItem extends React.Component {
130130
<Block row center flex={0.9}>
131131
<Text
132132
style={{
133-
fontFamily: "montserrat-regular",
134-
textTransform: "uppercase",
135-
fontWeight: "300"
133+
fontFamily: 'montserrat-regular',
134+
textTransform: 'uppercase',
135+
fontWeight: '300',
136136
}}
137137
size={12}
138138
bold={focused ? true : false}
139-
color={focused ? nowTheme.COLORS.PRIMARY : "white"}
139+
color={focused ? nowTheme.COLORS.PRIMARY : 'black'}
140140
>
141141
{title}
142142
</Text>
@@ -151,22 +151,22 @@ const styles = StyleSheet.create({
151151
defaultStyle: {
152152
paddingVertical: 15,
153153
paddingHorizontal: 14,
154-
color: "white"
154+
color: 'white',
155155
},
156156
activeStyle: {
157157
backgroundColor: nowTheme.COLORS.WHITE,
158158
borderRadius: 30,
159-
color: "white"
159+
color: 'white',
160160
},
161161
shadow: {
162162
shadowColor: theme.COLORS.BLACK,
163163
shadowOffset: {
164164
width: 0,
165-
height: 2
165+
height: 2,
166166
},
167167
shadowRadius: 8,
168-
shadowOpacity: 0.1
169-
}
168+
shadowOpacity: 0.1,
169+
},
170170
});
171171

172172
export default DrawerItem;

‎navigation/Menu.js‎

Lines changed: 42 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,23 @@
1-
import React from "react";
2-
import {
3-
ScrollView,
4-
StyleSheet,
5-
Dimensions,
6-
Image,
7-
TouchableOpacity,
8-
Linking
9-
} from "react-native";
10-
import { Block, Text, theme } from "galio-framework";
11-
import { useSafeArea } from "react-native-safe-area-context";
12-
import Images from "../constants/Images";
13-
import { DrawerItem as DrawerCustomItem, Icon } from "../components";
1+
import { Block, Text, theme } from 'galio-framework';
2+
import { Dimensions, Image, Linking, ScrollView, StyleSheet, TouchableOpacity } from 'react-native';
3+
import { DrawerItem as DrawerCustomItem, Icon } from '../components';
144

15-
import nowTheme from "../constants/Theme";
5+
import Images from '../constants/Images';
6+
import React from 'react';
7+
import nowTheme from '../constants/Theme';
8+
import { useSafeArea } from 'react-native-safe-area-context';
169

17-
const { width } = Dimensions.get("screen");
10+
const { width } = Dimensions.get('screen');
1811

19-
function CustomDrawerContent({
20-
drawerPosition,
21-
navigation,
22-
profile,
23-
focused,
24-
state,
25-
...rest
26-
}) {
12+
function CustomDrawerContent({ drawerPosition, navigation, profile, focused, state, ...rest }) {
2713
const insets = useSafeArea();
28-
const screens = [
29-
"Home",
30-
"Components",
31-
"Articles",
32-
"Profile",
33-
"Account",
34-
];
14+
const screens = ['Home', 'Components', 'Articles', 'Profile', 'Account'];
3515
return (
36-
<Block
37-
style={styles.container}
38-
forceInset={{ top: "always", horizontal: "never" }}
39-
>
16+
<Block style={styles.container} forceInset={{ top: 'always', horizontal: 'never' }}>
4017
<Block style={styles.header}>
4118
<Image style={styles.logo} source={Images.Logo} />
4219
<Block right style={styles.headerIcon}>
43-
<Icon
44-
name="align-left-22x"
45-
family="NowExtra"
46-
size={15}
47-
color={"white"}
48-
/>
20+
<Icon name="align-left-22x" family="NowExtra" size={15} color={'black'} />
4921
</Block>
5022
</Block>
5123
<Block flex style={{ paddingLeft: 8, paddingRight: 14 }}>
@@ -61,18 +33,30 @@ function CustomDrawerContent({
6133
);
6234
})}
6335
<Block flex style={{ marginTop: 24, marginVertical: 8, paddingHorizontal: 8 }}>
64-
<Block
65-
style={{ borderColor: 'white', width: '93%', borderWidth: StyleSheet.hairlineWidth, marginHorizontal: 10}}
66-
/>
67-
<Text
68-
color={nowTheme.COLORS.WHITE}
69-
style={{ marginTop: 30, marginLeft: 20, marginBottom: 10, fontFamily: 'montserrat-regular', fontWeight: '300', fontSize: 12}}
70-
>
71-
DOCUMENTATION
72-
</Text>
73-
</Block>
74-
<DrawerCustomItem title="GETTING STARTED" navigation={navigation}/>
75-
<DrawerCustomItem title="LOGOUT" navigation={navigation}/>
36+
<Block
37+
style={{
38+
borderColor: 'black',
39+
width: '93%',
40+
borderWidth: StyleSheet.hairlineWidth,
41+
marginHorizontal: 10,
42+
}}
43+
/>
44+
<Text
45+
color={nowTheme.COLORS.BLACK}
46+
style={{
47+
marginTop: 30,
48+
marginLeft: 20,
49+
marginBottom: 10,
50+
fontFamily: 'montserrat-regular',
51+
fontWeight: '300',
52+
fontSize: 12,
53+
}}
54+
>
55+
DOCUMENTATION
56+
</Text>
57+
</Block>
58+
<DrawerCustomItem title="GETTING STARTED" navigation={navigation} />
59+
<DrawerCustomItem title="LOGOUT" navigation={navigation} />
7660
</ScrollView>
7761
</Block>
7862
</Block>
@@ -81,21 +65,22 @@ function CustomDrawerContent({
8165

8266
const styles = StyleSheet.create({
8367
container: {
84-
flex: 1
68+
flex: 1,
8569
},
8670
header: {
8771
paddingHorizontal: 28,
8872
paddingBottom: theme.SIZES.BASE,
8973
paddingTop: theme.SIZES.BASE * 3,
90-
justifyContent: "center"
74+
justifyContent: 'center',
9175
},
9276
headerIcon: {
93-
marginTop: -20
77+
marginTop: -20,
9478
},
9579
logo: {
9680
height: 40,
97-
width: 37
98-
}
81+
width: 37,
82+
tintColor: 'black',
83+
},
9984
});
10085

10186
export default CustomDrawerContent;

0 commit comments

Comments
 (0)