This repository has been archived on 2023-03-26. You can view files and clone it, but cannot push or open issues or pull requests.
Sphere/app/components/login/token-help.js
2016-02-06 19:23:11 +00:00

72 lines
1.7 KiB
JavaScript

import React from 'react-native';
import GlobalStyles from '../../settings/styles';
import Modal from 'react-native-modalbox';
const {
StyleSheet,
Text,
View,
TouchableWithoutFeedback
} = React;
const styles = StyleSheet.create({
modal: {
justifyContent: 'center',
alignItems: 'center',
backgroundColor: GlobalStyles.get('CIRCLE_NAVBAR_BG'),
height: 200
},
title: {
fontSize: 18,
color: GlobalStyles.get('CIRCLE_NAVBAR_TEXT'),
},
text: {
fontSize: 13,
color: GlobalStyles.get('CIRCLE_NAVBAR_TEXT'),
margin: 2,
textAlign: 'center'
},
dismiss: {
fontSize: 12,
padding: 5
},
modalView: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
padding: 10
}
});
export default class Login extends React.Component {
hide() {
this.refs.modal.close();
}
render() {
return (
<Modal
isOpen={this.props.open}
style={styles.modal}
ref="modal"
onClosed={this.props.onClose}
backdrop={true}>
<View style={styles.modalView}>
<Text style={styles.title}>
What is a token?
</Text>
<Text style={styles.text}>
A token is the identifier used to authenticate with CircleCI and let the app control your account.
</Text>
<Text style={styles.text}>
To generate a new token, visit your CircleCI accounts page.
</Text>
</View>
<TouchableWithoutFeedback onPress={this.hide.bind(this)}>
<Text style={[styles.text, styles.dismiss]}>
Swipe down to dismiss
</Text>
</TouchableWithoutFeedback>
</Modal>
);
}
};