Merge branch 'login-styling' into 'master'

Change login screen styling margins, padding, shadows and border-radii

See merge request !49

app/components/Login.js

 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import { View, TextInput, Text, Linking, Image, TouchableOpacity, KeyboardAvoidingView } from 'react-native';
+import { View, TextInput, Text, Linking, Image, TouchableHighlight, KeyboardAvoidingView } from 'react-native';
 import { connect } from 'react-redux';
 import styles from './style/login';
 import { url } from '../url';
@@ -41,12 +41,12 @@ class Login extends Component {
             onSubmitEditing={() => { login(this.state.username, this.state.password); }}
           />
         </View>
-        <TouchableOpacity
+        <TouchableHighlight
           style={styles.blackbutton} onPress={() =>
         login(this.state.username, this.state.password)}
         >
           <Text style={styles.loginText}>INLOGGEN</Text>
-        </TouchableOpacity>
+        </TouchableHighlight>
         <Text style={styles.forgotpass} onPress={() => Linking.openURL(`${url}/password_reset/`)}>
           Wachtwoord vergeten?
         </Text>

app/components/style/login.js

@@ -3,35 +3,35 @@ import { StyleSheet } from 'react-native';
 import { colors } from '../../style';
 
 const styles = StyleSheet.create({
-
   loginText: {
     color: colors.white,
     fontWeight: 'bold',
   },
-
   blackbutton: {
     marginTop: 40,
+    marginBottom: 16,
+    paddingTop: 12,
+    paddingBottom: 12,
+    paddingLeft: 38,
+    paddingRight: 38,
+    borderRadius: 2,
+    elevation: 2,
     alignSelf: 'center',
     alignItems: 'center',
-    marginBottom: 10,
-    width: 225,
-    height: 50,
     backgroundColor: colors.darkGrey,
     justifyContent: 'center',
   },
   input: {
     height: 48,
   },
-
   forgotpass: {
     alignSelf: 'center',
     color: colors.darkGrey,
     marginBottom: 10,
-    fontSize: 20,
+    fontFamily: 'sans-serif-medium',
+    fontSize: 14,
     height: 25,
-    fontWeight: 'bold',
   },
-
   loginstatus: {
     marginTop: 10,
     marginBottom: 10,
@@ -40,17 +40,13 @@ const styles = StyleSheet.create({
     alignSelf: 'center',
     color: colors.white,
   },
-
   logo: {
-    marginTop: 137,
-    marginBottom: 54,
+    width: 260,
     height: 108,
-    marginLeft: 34,
-    marginRight: 34,
+    marginBottom: 48,
     resizeMode: 'contain',
     alignSelf: 'center',
   },
-
   wrapper: {
     paddingLeft: 16,
     paddingRight: 16,