diff --git a/src/js/native/index.ios.js b/src/js/native/index.ios.js index 91973aea..de1917d3 100755 --- a/src/js/native/index.ios.js +++ b/src/js/native/index.ios.js @@ -7,13 +7,7 @@ var React = require('react-native'); var { AppRegistry, - Image, Navigator, - ScrollView, - StyleSheet, - Text, - TouchableHighlight, - View, } = React; var Routes = require('../constants/Routes'); @@ -46,10 +40,4 @@ var LearnGitBranching = React.createClass({ }); -var styles = StyleSheet.create({ - headerSpacer: { - height: 40 - }, -}); - AppRegistry.registerComponent('LearnGitBranching', () => LearnGitBranching); diff --git a/src/js/native_react_views/AppViews.js b/src/js/native_react_views/AppViews.js new file mode 100644 index 00000000..26a1b9a9 --- /dev/null +++ b/src/js/native_react_views/AppViews.js @@ -0,0 +1,27 @@ +/** + * Simple views for the app that dont really change. + */ + +var React = require('react-native'); +var Routes = require('../constants/Routes'); +var { + StyleSheet, + View, +} = React; + +var HeaderSpacer = React.createClass({ + + render: function() { + return ; + } + +}); + +var styles = StyleSheet.create({ + headerSpacer: { + height: 20, + backgroundColor: '#FFF' + }, +}); + +module.exports.HeaderSpacer = HeaderSpacer; diff --git a/src/js/native_react_views/NUXView.js b/src/js/native_react_views/NUXView.js index 61942eaf..1642eb12 100644 --- a/src/js/native_react_views/NUXView.js +++ b/src/js/native_react_views/NUXView.js @@ -9,6 +9,10 @@ var { } = React; var AppStyles = require('../constants/AppStyles'); +var AppViews = require('../native_react_views/AppViews'); +var { + HeaderSpacer, +} = AppViews; var TerminalCardView = require('../native_react_views/TerminalCardView'); var NavButton = require('../native_react_views/NavButton'); @@ -21,7 +25,7 @@ var NUXView = React.createClass({ render: function() { return ( - + @@ -47,7 +51,7 @@ var NUXView = React.createClass({ text="Let's Get Started!" onPress={() => { this.props.navigator.push( - Routes.getRouteForID(Routes.LEVEL_SELECT) + Routes.getRouteForID(Routes.SEQUENCE_SELECT) ); }} /> @@ -69,10 +73,6 @@ var styles = StyleSheet.create({ container: { padding: 12, }, - headerSpacer: { - height: 20, - backgroundColor: '#FFF' - }, welcomeTextContainer: { justifyContent: 'center', alignItems: 'center', diff --git a/src/js/native_react_views/NavButton.js b/src/js/native_react_views/NavButton.js index 7aa1bd90..e8afa0e2 100644 --- a/src/js/native_react_views/NavButton.js +++ b/src/js/native_react_views/NavButton.js @@ -7,6 +7,7 @@ var { View, } = React; +// TODO -- style this! class NavButton extends React.Component { render() { return ( diff --git a/src/js/native_react_views/SequenceSelectView.js b/src/js/native_react_views/SequenceSelectView.js index 4b558eae..afe32d16 100644 --- a/src/js/native_react_views/SequenceSelectView.js +++ b/src/js/native_react_views/SequenceSelectView.js @@ -9,6 +9,12 @@ var { } = React; var AppStyles = require('../constants/AppStyles'); +var AppViews = require('../native_react_views/AppViews'); +var { + HeaderSpacer, +} = AppViews; +var TerminalCardView = require('../native_react_views/TerminalCardView'); +var NavButton = require('../native_react_views/NavButton'); var SequenceSelectView = React.createClass({ @@ -19,18 +25,21 @@ var SequenceSelectView = React.createClass({ render: function() { return ( - - - - { - this.props.navigator.push( - Routes.getRouteForID(Routes.LEVEL_SELECT) - ); - }} - /> - + + + + + + { + this.props.navigator.push( + Routes.getRouteForID(Routes.LEVEL_SELECT) + ); + }} + /> + + ); @@ -39,14 +48,16 @@ var SequenceSelectView = React.createClass({ }); var styles = StyleSheet.create({ + container: { + padding: 8, + }, + headerSpacer: { + height: 24, + }, background: { backgroundColor: AppStyles.blueBackground, flex: 1 }, - headerSpacer: { - height: 20, - backgroundColor: '#EFEDEE', - }, }); module.exports = SequenceSelectView;