Remove header and add color

app.js

@@ -7,6 +7,8 @@ import Chart from './components/chart/chart'
 import Settings from './components/settings'
 import Stats from './components/stats'
 
+import styles from './styles'
+
 // this is until react native fixes this bugg, see
 // https://github.com/facebook/react-native/issues/18868#issuecomment-382671739
 import { YellowBox } from 'react-native'
@@ -14,8 +16,8 @@ YellowBox.ignoreWarnings(['Warning: isMounted(...) is deprecated'])
 
 const routes = {
   Home: { screen: Home },
-  Calendar: createStackNavigator({Calendar, CycleDay}),
-  Chart: createStackNavigator({Chart, CycleDay}),
+  Calendar: createStackNavigator({Calendar, CycleDay}, {headerMode: 'none'}),
+  Chart: createStackNavigator({Chart, CycleDay}, {headerMode: 'none'}),
   Settings: { screen: Settings },
   Stats: { screen: Stats}
 }
@@ -23,7 +25,10 @@ const routes = {
 const config = {
   labeled: true,
   shifting: false,
-  backBehavior: 'none'
+  tabBarOptions: {
+    style: {backgroundColor: '#ff7e5f'},
+    labelStyle: {fontSize: 15, color: 'white'}
+  },
 }
 
 export default createBottomTabNavigator(routes, config)