mirror of
https://github.com/pcottle/learnGitBranching.git
synced 2025-07-22 11:45:43 +02:00
sweet some initial native views
This commit is contained in:
parent
e9476696f4
commit
ec44f19d3e
5 changed files with 117 additions and 15 deletions
50
src/js/native_react_views/NUXView.js
Normal file
50
src/js/native_react_views/NUXView.js
Normal file
|
@ -0,0 +1,50 @@
|
|||
var NavButton = require('../native_react_views/NavButton');
|
||||
var React = require('react-native');
|
||||
var Routes = require('../constants/Routes');
|
||||
var {
|
||||
ScrollView,
|
||||
StyleSheet,
|
||||
Text,
|
||||
View,
|
||||
} = React;
|
||||
|
||||
var Colors = require('../constants/Colors');
|
||||
var TerminalCardView = require('../native_react_views/TerminalCardView');
|
||||
|
||||
var NUXView = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
navigator: React.PropTypes.object.isRequired,
|
||||
},
|
||||
|
||||
render: function() {
|
||||
return (
|
||||
<View style={styles.background}>
|
||||
<View style={styles.headerSpacer} />
|
||||
<TerminalCardView />
|
||||
<NavButton
|
||||
text="Level 1"
|
||||
onPress={() => {
|
||||
this.props.navigator.push(
|
||||
Routes.getRouteForID(Routes.LEVEL_SELECT)
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
var styles = StyleSheet.create({
|
||||
background: {
|
||||
backgroundColor: Colors.blueBackground,
|
||||
flex: 1
|
||||
},
|
||||
headerSpacer: {
|
||||
height: 20,
|
||||
backgroundColor: '#EFEDEE',
|
||||
},
|
||||
});
|
||||
|
||||
module.exports = NUXView;
|
|
@ -2,13 +2,14 @@ var NavButton = require('../native_react_views/NavButton');
|
|||
var React = require('react-native');
|
||||
var Routes = require('../constants/Routes');
|
||||
var {
|
||||
PixelRatio,
|
||||
ScrollView,
|
||||
StyleSheet,
|
||||
Text,
|
||||
View,
|
||||
} = React;
|
||||
|
||||
var Colors = require('../constants/Colors');
|
||||
|
||||
var SequenceSelectView = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
|
@ -17,27 +18,34 @@ var SequenceSelectView = React.createClass({
|
|||
|
||||
render: function() {
|
||||
return (
|
||||
<ScrollView>
|
||||
<View style={styles.background}>
|
||||
<View style={styles.headerSpacer} />
|
||||
<View>
|
||||
<NavButton
|
||||
text="Level 1"
|
||||
onPress={() => {
|
||||
this.props.navigator.push(
|
||||
Routes.getRouteForID(Routes.LEVEL_SELECT)
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
</ScrollView>
|
||||
<ScrollView>
|
||||
<View>
|
||||
<NavButton
|
||||
text="Level 1"
|
||||
onPress={() => {
|
||||
this.props.navigator.push(
|
||||
Routes.getRouteForID(Routes.LEVEL_SELECT)
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
var styles = StyleSheet.create({
|
||||
background: {
|
||||
backgroundColor: Colors.blueBackground,
|
||||
flex: 1
|
||||
},
|
||||
headerSpacer: {
|
||||
height: 40
|
||||
height: 20,
|
||||
backgroundColor: '#EFEDEE',
|
||||
},
|
||||
});
|
||||
|
||||
|
|
36
src/js/native_react_views/TerminalCardView.js
Normal file
36
src/js/native_react_views/TerminalCardView.js
Normal file
|
@ -0,0 +1,36 @@
|
|||
var React = require('react-native');
|
||||
var {
|
||||
StyleSheet,
|
||||
Text,
|
||||
View,
|
||||
} = React;
|
||||
|
||||
var Colors = require('../constants/Colors');
|
||||
|
||||
var TerminalCardView = React.createClass({
|
||||
render: function() {
|
||||
return (
|
||||
<View style={styles.terminalWindow}>
|
||||
<Text style={styles.terminalText}>
|
||||
Welcome to learn git branching
|
||||
</Text>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
var styles = StyleSheet.create({
|
||||
terminalWindow: {
|
||||
backgroundColor: Colors.terminalBackground,
|
||||
},
|
||||
|
||||
terminalText: {
|
||||
color: Colors.terminalText,
|
||||
fontFamily: 'Courier',
|
||||
fontSize: 16,
|
||||
fontWeight: 'bold'
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
module.exports = TerminalCardView;
|
Loading…
Add table
Add a link
Reference in a new issue