archive/Sphere
Archived
1
Fork 0
Code Packages Releases Activity

Add info button

Browse Source
This commit is contained in:
Jake Howard 2016-02-04 18:08:36 +00:00
parent 97528e62c7
commit c274fbead0
2 changed files with 32 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
app/components/routes/login.js
View File

@ -2,7 +2,7 @@ import React from 'react-native';
import GlobalStyles from '../../settings/styles'; import GlobalStyles from '../../settings/styles';
import TokenHelp from '../login/token-help'; import TokenHelp from '../login/token-help';
var dismissKeyboard = require('dismissKeyboard'); const dismissKeyboard = require('dismissKeyboard');
const { const {
StyleSheet, StyleSheet,
@ -31,24 +31,31 @@ const styles = StyleSheet.create({
textAlign: 'center' textAlign: 'center'
}, },
loginButton: { loginButton: {
flex: 1, flex: 0.9,
backgroundColor: GlobalStyles.get('CIRCLE_GREEN'), backgroundColor: GlobalStyles.get('CIRCLE_GREEN'),
borderColor: GlobalStyles.get('CIRCLE_GREEN'),
},
infoButton: {
flex: 0.15,
backgroundColor: GlobalStyles.get('CIRCLE_GREY'),
borderColor: GlobalStyles.get('CIRCLE_GREY'),
},
button: {
justifyContent: 'center', justifyContent: 'center',
alignItems: 'center', alignItems: 'center',
padding: 10, padding: 10,
borderColor: GlobalStyles.get('CIRCLE_GREEN'),
borderWidth: 2, borderWidth: 2,
borderRadius: 12 borderRadius: 12,
margin: 5
}, },
loginButtonText: { buttonText: {
fontSize: 18, fontSize: 18,
color: 'white', color: 'white',
}, },
buttonContainer: { buttonContainer: {
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'center', justifyContent: 'center',
padding: 10, margin: 5
paddingVertical: 15
}, },
title: { title: {
fontSize: 30, fontSize: 30,
@ -80,6 +87,7 @@ export default class Login extends React.Component {
this.textChanged = this.textChanged.bind(this); this.textChanged = this.textChanged.bind(this);
this.showTokenHelp = this.showTokenHelp.bind(this); this.showTokenHelp = this.showTokenHelp.bind(this);
this.hideTokenHelp = this.hideTokenHelp.bind(this); this.hideTokenHelp = this.hideTokenHelp.bind(this);
this.showAbout = this.showAbout.bind(this);
} }
textChanged(token) { textChanged(token) {
@ -90,6 +98,10 @@ export default class Login extends React.Component {
dismissKeyboard(); dismissKeyboard();
} }
showAbout() {
}
showTokenHelp() { showTokenHelp() {
dismissKeyboard(); dismissKeyboard();
this.setState({ this.setState({
@ -142,13 +154,21 @@ export default class Login extends React.Component {
</ScrollView> </ScrollView>
<View style={styles.buttonContainer}> <View style={styles.buttonContainer}>
<TouchableHighlight <TouchableHighlight
style={styles.loginButton} style={[styles.button, styles.loginButton]}
onPress={this.validate} onPress={this.validate}
underlayColor={GlobalStyles.get('CIRCLE_GREY_DARK')}> underlayColor={GlobalStyles.get('CIRCLE_GREY_DARK')}>
<Text style={[styles.loginButtonText, styles.text]}> <Text style={[styles.buttonText, styles.text]}>
Authenticate Authenticate
</Text> </Text>
</TouchableHighlight> </TouchableHighlight>
<TouchableHighlight
style={[styles.button, styles.infoButton]}
onPress={this.showAbout}
underlayColor={GlobalStyles.get('CIRCLE_GREY_DARK')}>
<Text style={[styles.buttonText, styles.text]}>
About
</Text>
</TouchableHighlight>
</View> </View>
<TokenHelp open={this.state.showTokenHelp} onClose={this.hideTokenHelp} /> <TokenHelp open={this.state.showTokenHelp} onClose={this.hideTokenHelp} />
</View> </View>

4
app/settings/styles.js
View File

@ -2,5 +2,7 @@ import { Map } from 'immutable';
export default Map({ export default Map({
CIRCLE_GREEN: '#229922', CIRCLE_GREEN: '#229922',
CIRCLE_GREY_DARK: '#343434' CIRCLE_GREY_DARK: '#343434',
CIRCLE_GREY: '#666',
CIRCLE_GREY_LIGHT: '#A7A7A7'
}); });