Skip to content
This repository was archived by the owner on Mar 30, 2022. It is now read-only.

Commit b238e57

Browse files
authored
Merge pull request #1 from dabit3/0.0.2
upgraded to version 0.0.2
2 parents f6a2262 + 56e4e33 commit b238e57

File tree

20 files changed

+652
-182
lines changed

20 files changed

+652
-182
lines changed

ios/HackathonStarter/Images.xcassets/placeholderhome.imageset/Contents.json

-23
This file was deleted.
Binary file not shown.

package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "HackathonStarter",
3-
"version": "0.0.1",
3+
"version": "0.0.2",
44
"private": true,
55
"scripts": {
66
"start": "node node_modules/react-native/local-cli/cli.js start"
@@ -9,7 +9,7 @@
99
"lodash": "^4.15.0",
1010
"react": "15.3.1",
1111
"react-native": "0.32.0",
12-
"react-native-elements": "0.0.6",
12+
"react-native-elements": "0.3.2",
1313
"react-native-tab-navigator": "^0.3.3",
1414
"react-native-vector-icons": "^2.1.0",
1515
"react-redux": "^4.4.5",

src/App.js

+6-17
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import Icon from 'react-native-vector-icons/MaterialIcons'
55
import colors from 'HSColors'
66
import fonts from 'HSFonts'
77

8-
import Home from './home/HomeRootContainer'
8+
import Home from './home/HomeNav'
99
import About from './about/AboutRootContainer'
1010
import Contact from './contact/ContactRootContainer'
1111
import Pricing from './pricing/PricingRootContainer'
@@ -27,6 +27,7 @@ class App extends Component {
2727
})
2828
}
2929
render () {
30+
const { toggleSideMenu } = this.props
3031
const { selectedTab } = this.state
3132
return (
3233
<TabNavigator>
@@ -38,7 +39,7 @@ class App extends Component {
3839
renderIcon={() => <Icon color={colors.grey2} name='whatshot' size={26} />}
3940
renderSelectedIcon={() => <Icon color={colors.primary} name='whatshot' size={26} />}
4041
onPress={() => this.changeTab('home')}>
41-
<Home />
42+
<Home toggleSideMenu={toggleSideMenu} />
4243
</TabNavigator.Item>
4344
<TabNavigator.Item
4445
tabStyle={selectedTab !== 'about' && { marginBottom: -6 }}
@@ -52,25 +53,13 @@ class App extends Component {
5253
<About />
5354
</TabNavigator.Item>
5455
<TabNavigator.Item
55-
tabStyle={[
56-
selectedTab !== 'contact' && { marginBottom: -6 },
57-
selectedTab === 'contact' && Platform.OS === 'android' && {marginBottom: -3}
58-
]}
56+
tabStyle={selectedTab !== 'contact' && { marginBottom: -6 }}
5957
titleStyle={[styles.titleStyle, {marginTop: -1}]}
60-
selectedTitleStyle={[
61-
styles.titleSelected,
62-
{marginBottom: 7},
63-
Platform.OS === 'android' ? {marginTop: 1 } : {marginTop: -3}
64-
]}
58+
selectedTitleStyle={[styles.titleSelected, {marginTop: -3, marginBottom: 7}]}
6559
selected={selectedTab === 'contact'}
6660
title={selectedTab === 'contact' ? 'CONTACT' : null}
6761
renderIcon={() => <Icon style={{paddingBottom: 4}} color={colors.grey2} name='contacts' size={26} />}
68-
renderSelectedIcon={() => (
69-
<Icon
70-
color={colors.primary}
71-
name='contacts'
72-
size={Platform.OS === 'ios' ? 26 : 22 } />
73-
)}
62+
renderSelectedIcon={() => <Icon color={colors.primary} name='contacts' size={26} />}
7463
onPress={() => this.changeTab('contact')}>
7564
<Contact />
7665
</TabNavigator.Item>

src/AppRootContainer.js

+69-1
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,78 @@
11
import React, { Component } from 'react'
2+
import { View } from 'react-native'
23
import App from './App'
4+
import {
5+
List,
6+
ListItem,
7+
SideMenu
8+
} from 'react-native-elements'
39

410
class AppRootContainer extends Component {
11+
constructor () {
12+
super()
13+
this.state = {
14+
toggled: false
15+
}
16+
this.toggleSideMenu = this.toggleSideMenu.bind(this)
17+
}
18+
toggleSideMenu () {
19+
this.setState({
20+
toggled: !this.state.toggled
21+
})
22+
}
523
render () {
24+
const list = [
25+
{
26+
name: 'Amy Farha',
27+
avatar_url: 'https://s3.amazonaws.com/uifaces/faces/twitter/ladylexy/128.jpg',
28+
subtitle: 'Vice President'
29+
},
30+
{
31+
name: 'Chris Jackson',
32+
avatar_url: 'https://s3.amazonaws.com/uifaces/faces/twitter/adhamdannaway/128.jpg',
33+
subtitle: 'Vice Chairman'
34+
},
35+
{
36+
name: 'Amanda Martin',
37+
avatar_url: 'https://s3.amazonaws.com/uifaces/faces/twitter/brynn/128.jpg',
38+
subtitle: 'CEO'
39+
},
40+
{
41+
name: 'Christy Thomas',
42+
avatar_url: 'https://s3.amazonaws.com/uifaces/faces/twitter/kfriedson/128.jpg',
43+
subtitle: 'Lead Developer'
44+
},
45+
{
46+
name: 'Melissa Jones',
47+
avatar_url: 'https://s3.amazonaws.com/uifaces/faces/twitter/nuraika/128.jpg',
48+
subtitle: 'CTO'
49+
}
50+
]
51+
const MenuComponent = (
52+
<View style={{flex: 1, backgroundColor: '#ededed', paddingTop: 50}}>
53+
<List containerStyle={{marginBottom: 20}}>
54+
{
55+
list.map((l, i) => (
56+
<ListItem
57+
roundAvatar
58+
onPress={() => console.log('something')}
59+
avatar={l.avatar_url}
60+
key={i}
61+
title={l.name}
62+
subtitle={l.subtitle}
63+
/>
64+
))
65+
}
66+
</List>
67+
</View>
68+
)
669
return (
7-
<App />
70+
<SideMenu
71+
toggledContainerStyle={{borderLeftWidth: 1, borderLeftColor: '#ededed'}}
72+
toggled={this.state.toggled}
73+
MenuComponent={MenuComponent}>
74+
<App toggleSideMenu={this.toggleSideMenu} />
75+
</SideMenu>
876
)
977
}
1078
}

src/about/About.js

+99-36
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,9 @@ import colors from 'HSColors'
44
import Icon from 'react-native-vector-icons/MaterialIcons'
55

66
import {
7-
RNEText,
8-
RNECard,
9-
RNESocialIcon
7+
Text,
8+
Card,
9+
SocialIcon
1010
} from 'react-native-elements'
1111

1212
let styles = {}
@@ -41,80 +41,143 @@ const users = [
4141
class About extends Component {
4242
render () {
4343
return (
44-
<ScrollView>
44+
<ScrollView style={{backgroundColor: 'white'}}>
4545
<View style={styles.headerContainer}>
4646
<Icon color='white' name='invert-colors' size={62} />
47-
<RNEText style={styles.heading}>Components</RNEText>
47+
<Text style={styles.heading}>Components</Text>
4848
</View>
4949
<View style={styles.container}>
50-
<RNECard
50+
<Card
5151
title='CARD WITH DIVIDER'>
5252
{
5353
users.map((u, i) => {
5454
return (
5555
<View key={i} style={styles.user}>
5656
<Image
5757
style={styles.image}
58+
resizeMode='center'
5859
source={{uri: u.avatar}} />
59-
<RNEText style={styles.name}>{u.name}</RNEText>
60+
<Text style={styles.name}>{u.name}</Text>
6061
</View>
6162
)
6263
})
6364
}
64-
</RNECard>
65-
<RNECard containerStyle={{marginTop: 15}} title='FONTS'>
66-
<RNEText style={styles.fonts} h1>h1 Heading</RNEText>
67-
<RNEText style={styles.fonts} h2>h2 Heading</RNEText>
68-
<RNEText style={styles.fonts} h3>h3 Heading</RNEText>
69-
<RNEText style={styles.fonts} h4>h4 Heading</RNEText>
70-
<RNEText style={styles.fonts} >Normal Text</RNEText>
71-
</RNECard>
72-
<RNECard
65+
</Card>
66+
<Card containerStyle={{marginTop: 15}} title='FONTS'>
67+
<Text style={styles.fonts} h1>h1 Heading</Text>
68+
<Text style={styles.fonts} h2>h2 Heading</Text>
69+
<Text style={styles.fonts} h3>h3 Heading</Text>
70+
<Text style={styles.fonts} h4>h4 Heading</Text>
71+
<Text style={styles.fonts} >Normal Text</Text>
72+
</Card>
73+
<Card
7374
title='SOCIAL ICONS'
7475
containerStyle={{marginTop: 15}}>
7576
<View style={styles.social}>
76-
<RNESocialIcon
77+
<SocialIcon
78+
raised={false}
79+
type='gitlab'
80+
onPress={() => console.log('hi!')}
81+
/>
82+
<SocialIcon
83+
type='medium'
84+
onPress={() => console.log('hi2!')}
85+
/>
86+
<SocialIcon
87+
type='github-alt'
88+
onPress={() => console.log('hi3!')}
89+
/>
90+
<SocialIcon
91+
type='twitch'
92+
/>
93+
<SocialIcon
94+
type='soundcloud'
95+
/>
96+
</View>
97+
<View style={styles.social}>
98+
<SocialIcon
99+
raised={false}
77100
type='facebook'
101+
onPress={() => console.log('hi!')}
78102
/>
79-
<RNESocialIcon
103+
<SocialIcon
80104
type='twitter'
105+
onPress={() => console.log('hi2!')}
81106
/>
82-
<RNESocialIcon
107+
<SocialIcon
83108
type='instagram'
109+
onPress={() => console.log('hi3!')}
110+
/>
111+
<SocialIcon
112+
raised={false}
113+
type='codepen'
114+
/>
115+
<SocialIcon
116+
raised={false}
117+
type='youtube'
118+
/>
119+
</View>
120+
</Card>
121+
<Card
122+
title='LIGHT SOCIAL ICONS'
123+
containerStyle={{marginTop: 15}}>
124+
<View style={styles.social}>
125+
<SocialIcon
126+
light
127+
raised={false}
128+
type='gitlab'
129+
onPress={() => console.log('hi!')}
130+
/>
131+
<SocialIcon
132+
light
133+
type='medium'
134+
onPress={() => console.log('hi2!')}
135+
/>
136+
<SocialIcon
137+
light
138+
type='github-alt'
139+
onPress={() => console.log('hi3!')}
140+
/>
141+
<SocialIcon
142+
light
143+
type='twitch'
84144
/>
85-
<RNESocialIcon
86-
type='tumblr'
145+
<SocialIcon
146+
light
147+
type='soundcloud'
87148
/>
88149
</View>
89-
</RNECard>
90-
<RNECard
91-
containerStyle={{marginTop: 15}}
150+
</Card>
151+
<Card
152+
containerStyle={{marginTop: 15, marginBottom: 15}}
92153
title='SOCIAL BUTTONS'>
93154
<View style={styles.socialButtons}>
94-
<RNESocialIcon
155+
<SocialIcon
156+
button
157+
type='medium'
158+
/>
159+
<SocialIcon
160+
button
161+
type='twitch'
162+
/>
163+
<SocialIcon
95164
title='Sign In With Facebook'
96165
button
97166
type='facebook'
98167
/>
99-
<RNESocialIcon
168+
<SocialIcon
100169
title='Some Twitter Message'
101170
button
102171
type='twitter'
103172
/>
104-
<RNESocialIcon
173+
<SocialIcon
174+
light
105175
button
176+
title='Some Instagram Message'
106177
type='instagram'
107178
/>
108-
<RNESocialIcon
109-
button
110-
type='tumblr'
111-
/>
112-
<RNESocialIcon
113-
button
114-
type='youtube'
115-
/>
116179
</View>
117-
</RNECard>
180+
</Card>
118181
</View>
119182
</ScrollView>
120183
)

0 commit comments

Comments
 (0)