WIP: orange everything

README.md

@@ -10,7 +10,7 @@
     touch ~/.gradle/gradle.properties && echo -e "org.gradle.daemon=true\norg.gradle.jvmargs=-Xmx2048M" >> ~/.gradle/gradle.properties
 
     # Run android emulator (first avd)
-    npm run emulator
+    yarn emulator
 
     # Make sure you have hw.keyboard=yes in your avd config.ini (in $HOME/.android/avd/.../) for reloading when pressing R twice to work.
 
@@ -24,7 +24,7 @@
     DUSKEN_RELEASE_KEY_PASSWORD=
 
     # Build
-    npm run build-android
+    yarn build-android
 
     # Output is in android/app/build/outputs/apk
 

src/Dusken.js

@@ -8,6 +8,7 @@ import EventListScreen from "./screens/EventListScreen";
 import LoginScreen from "./screens/LoginScreen";
 import MembershipScreen from "./screens/MembershipScreen";
 
+
 /* Navigation */
 const tabBarRoutes = {
     EventList: { screen: EventListScreen },
@@ -15,7 +16,32 @@ const tabBarRoutes = {
     About: { screen: AboutScreen },
 };
 
-const tabNav = TabNavigator(tabBarRoutes, {tabBarPosition: 'bottom'});
+const tabBarOptions = {
+    tabBarPosition: 'bottom',
+    tabBarOptions: {
+        style: {
+            backgroundColor: "#fff"
+        },
+        indicatorStyle: {
+            backgroundColor: "#f58220"
+        },
+        // labelStyle: {
+        //     color: '#f58220'
+        // },
+        activeTintColor: '#f58220',
+        inactiveTintColor: '#f58220',
+        showIcon: true,
+        iconStyle: {
+            color: '#f58220'
+        },
+        labelStyle: {
+            fontSize: 10,
+            marginBottom: 0,
+        }
+    }
+};
+
+const tabNav = TabNavigator(tabBarRoutes, tabBarOptions);
 
 const DuskenContainer = StackNavigator({
     Root: { screen: tabNav },

src/modules/about/About.js

@@ -20,7 +20,7 @@ export default class About extends Component {
 
 const styles = StyleSheet.create({
     header: {
-        fontSize: 16,
+        fontSize: 20,
         fontWeight: 'bold',
         color: '#000',
     },

src/modules/membership/Membership.js

@@ -74,6 +74,7 @@ const styles = StyleSheet.create({
     },
     headerTitle: {
         textAlign: 'center',
+        fontWeight: 'bold',
         fontSize: 20,
         color: '#000',
         paddingVertical: 10,

src/screens/AboutScreen.js

@@ -1,16 +1,24 @@
 import React, { Component } from 'react';
 import AboutContainer from "../modules/about/AboutContainer";
 import Icon from 'react-native-vector-icons/SimpleLineIcons';
+import getTheme from '../../native-base-theme/components';
+import {StyleProvider} from "native-base";
 
 export default class AboutScreen extends Component {
     static navigationOptions = {
         title: 'Om oss',
+        headerStyle: {
+            backgroundColor: '#f58220',
+        },
         tabBarIcon: ({ tintColor }) => (
             <Icon name="info" size={18} color={tintColor} style={{marginTop: 5}} />
         ),
     };
 
     render() {
-        return (<AboutContainer/>);
+        return (
+            <StyleProvider style={getTheme()}>
+                <AboutContainer/>
+            </StyleProvider>);
     }
 }

src/screens/EventDetailsScreen.js

@@ -1,13 +1,22 @@
 import React, { Component } from 'react';
 import EventDetails from "../modules/events/EventDetails";
+import {StyleProvider} from "native-base";
+import getTheme from '../../native-base-theme/components';
 
 export default class EventDetailsScreen extends Component {
     static navigationOptions = ({navigation}) => ({
         title: navigation.state.params.item.title.decoded,
+        headerStyle: {
+            backgroundColor: '#f58220',
+        }
     });
 
     render() {
         const { params } = this.props.navigation.state;
-        return (<EventDetails item={params.item}/>);
+        return (
+            <StyleProvider style={getTheme()}>
+                <EventDetails item={params.item}/>
+            </StyleProvider>
+        );
     }
 }

src/screens/EventListScreen.js

@@ -1,10 +1,15 @@
 import React, { Component } from 'react';
 import EventListContainer from "../modules/events/EventListContainer";
 import Icon from 'react-native-vector-icons/SimpleLineIcons';
+import {StyleProvider} from "native-base";
+import getTheme from '../../native-base-theme/components';
 
 export default class EventsScreen extends Component {
     static navigationOptions = {
         title: 'Program',
+        headerStyle: {
+            backgroundColor: '#f58220',
+        },
         tabBarIcon: ({ tintColor }) => (
             <Icon name="event" size={18} color={tintColor} style={{marginTop: 5}}/>
         ),
@@ -16,6 +21,10 @@ export default class EventsScreen extends Component {
     };
 
     render() {
-        return (<EventListContainer showEvent={this.showEvent}/>);
+        return (
+            <StyleProvider style={getTheme()}>
+                <EventListContainer showEvent={this.showEvent}/>
+            </StyleProvider>
+        );
     }
 }

src/screens/LoginScreen.js

@@ -1,9 +1,14 @@
 import React, { Component } from 'react';
 import LoginContainer from "../modules/login/LoginContainer";
+import {StyleProvider} from "native-base";
+import getTheme from '../../native-base-theme/components';
 
 export default class LoginScreen extends Component {
     static navigationOptions = {
         title: 'Logg inn',
+        headerStyle: {
+            backgroundColor: '#f58220',
+        },
     };
 
     onLogin = () => {
@@ -13,7 +18,8 @@ export default class LoginScreen extends Component {
 
     render() {
         return (
-            <LoginContainer onLogin={this.onLogin} />
+            <StyleProvider style={getTheme()}><LoginContainer onLogin={this.onLogin} />
+            </StyleProvider>
         )
     }
 }

src/screens/MembershipScreen.js

@@ -1,10 +1,15 @@
 import React, { Component } from 'react';
 import MembershipContainer from "../modules/membership/MembershipContainer";
 import Icon from 'react-native-vector-icons/SimpleLineIcons';
+import {StyleProvider} from "native-base";
+import getTheme from '../../native-base-theme/components';
 
 export default class MembershipScreen extends Component {
     static navigationOptions = {
         title: 'Medlemskap',
+        headerStyle: {
+            backgroundColor: '#f58220',
+        },
         tabBarIcon: ({ tintColor }) => (
             <Icon name="user" size={18} color={tintColor} style={{marginTop: 5}} />
         ),
@@ -20,7 +25,9 @@ export default class MembershipScreen extends Component {
 
     render() {
         return (
-            <MembershipContainer onLoginPress={this.onLoginPress} logoutNavigate={this.logoutNavigate} />
+            <StyleProvider style={getTheme()}>
+                <MembershipContainer onLoginPress={this.onLoginPress} logoutNavigate={this.logoutNavigate} />
+            </StyleProvider>
         )
     }
 }