diff --git a/src/components/buttons/index.js b/src/components/buttons/index.js new file mode 100644 index 000000000..fcbe55cbf --- /dev/null +++ b/src/components/buttons/index.js @@ -0,0 +1,3 @@ +import GreetingHeaderButton from "./views/greetingHeaderButtonView"; + +export { GreetingHeaderButton }; diff --git a/src/components/buttons/views/greetingHeaderButtonStyles.js b/src/components/buttons/views/greetingHeaderButtonStyles.js new file mode 100644 index 000000000..8fb2f46b4 --- /dev/null +++ b/src/components/buttons/views/greetingHeaderButtonStyles.js @@ -0,0 +1,13 @@ +import EStyleSheet from "react-native-extended-stylesheet"; + +export default EStyleSheet.create({ + button: { + width: 54, + backgroundColor: "transparent", + height: 19, + }, + buttonText: { + color: "#c1c5c7", + fontSize: 16, + }, +}); diff --git a/src/components/buttons/views/greetingHeaderButtonView.js b/src/components/buttons/views/greetingHeaderButtonView.js new file mode 100644 index 000000000..7f32598dc --- /dev/null +++ b/src/components/buttons/views/greetingHeaderButtonView.js @@ -0,0 +1,17 @@ +import React, { Fragment } from "react"; +import { TouchableWithoutFeedback, Text } from "react-native"; + +import styles from "./greetingHeaderButtonStyles"; + +const GreetingHeaderButtonView = ({ text, onPress, style }) => ( + + onPress && onPress()} + > + {text} + + +); + +export default GreetingHeaderButtonView; diff --git a/src/components/loginHeader/view/loginHeaderStyles.js b/src/components/loginHeader/view/loginHeaderStyles.js index 0d72df78a..71ed9ce90 100644 --- a/src/components/loginHeader/view/loginHeaderStyles.js +++ b/src/components/loginHeader/view/loginHeaderStyles.js @@ -1,12 +1,16 @@ import EStyleSheet from "react-native-extended-stylesheet"; export default EStyleSheet.create({ - wrapper: { + container: { flex: 1, + flexDirection: "column", + height: "$deviceHeight / 3", + }, + body: { flexDirection: "row", maxHeight: "$deviceHeight / 3", overflow: "hidden", - backgroundColor: "#ffffff", + backgroundColor: "$white", }, description: { textAlignVertical: "center", @@ -31,7 +35,24 @@ export default EStyleSheet.create({ flex: 0.4, alignSelf: "center", height: 100, - marginTop: 20, - left: 20, + marginTop: 50, + marginLeft: 32, + }, + headerRow: { + width: "$deviceWidth", + flexDirection: "row", + height: 55, + justifyContent: "space-between", + }, + logo: { + width: 32, + height: 32, + marginLeft: 32, + alignSelf: "center", + }, + headerButton: { + margin: 10, + marginRight: 19, + alignSelf: "center", }, }); diff --git a/src/components/loginHeader/view/loginHeaderView.js b/src/components/loginHeader/view/loginHeaderView.js index 6116c2190..b78ed2b7a 100644 --- a/src/components/loginHeader/view/loginHeaderView.js +++ b/src/components/loginHeader/view/loginHeaderView.js @@ -3,7 +3,7 @@ import { View, Text, Image } from "react-native"; // Constants // Components - +import { GreetingHeaderButton } from "../../buttons"; // Styles // eslint-disable-next-line import styles from "./loginHeaderStyles"; @@ -28,16 +28,27 @@ class LoginHeaderView extends Component { const { description, title } = this.props; return ( - - - {title} - {description} - - + + + + + + + + + {title} + {description} + + + + ); diff --git a/src/screens/login/screen/loginScreen.js b/src/screens/login/screen/loginScreen.js index ee656175e..f7fdf4b00 100644 --- a/src/screens/login/screen/loginScreen.js +++ b/src/screens/login/screen/loginScreen.js @@ -8,6 +8,7 @@ import { TextInput, BackHandler, Linking, + StatusBar, } from "react-native"; import { Navigation } from "react-native-navigation"; @@ -154,6 +155,7 @@ class LoginScreen extends Component { render() { return ( +