From 2a2f91fc5519c5a6374002a53c26f060e45d27fd Mon Sep 17 00:00:00 2001
From: Julia Friesel <julia.friesel@gmail.com>
Date: Fri, 20 Jul 2018 11:54:47 +0200
Subject: [PATCH] Make everything scrollable

---
 components/chart/chart.js     | 6 +++---
 components/cycle-day/index.js | 7 ++++---
 components/home.js            | 7 ++++---
 3 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/components/chart/chart.js b/components/chart/chart.js
index 2c70ed1..3d37139 100644
--- a/components/chart/chart.js
+++ b/components/chart/chart.js
@@ -1,5 +1,5 @@
 import React, { Component } from 'react'
-import { Text as ReactNativeText, View, FlatList } from 'react-native'
+import { Text as ReactNativeText, View, FlatList, ScrollView } from 'react-native'
 import range from 'date-range'
 import Svg,{
   G,
@@ -131,7 +131,7 @@ export default class CycleChart extends Component {
 
   render() {
     return (
-      <View style={{flex: 1, flexDirection: 'row'}}>
+      <ScrollView contentContainerStyle={{flexDirection: 'row'}}>
         <View {...styles.yAxis}>{yAxis.labels}</View>
         <FlatList
           horizontal={true}
@@ -148,7 +148,7 @@ export default class CycleChart extends Component {
           keyExtractor={item => item.dateString}
         >
         </FlatList>
-      </View>
+      </ScrollView>
     )
   }
 }
diff --git a/components/cycle-day/index.js b/components/cycle-day/index.js
index d0fac81..758fa1d 100644
--- a/components/cycle-day/index.js
+++ b/components/cycle-day/index.js
@@ -1,7 +1,8 @@
 import React, { Component } from 'react'
 import {
   View,
-  Text
+  Text,
+  ScrollView
 } from 'react-native'
 import cycleDayModule from '../../lib/get-cycle-day-number'
 import DayView from './cycle-day-overview'
@@ -33,7 +34,7 @@ export default class Day extends Component {
   render() {
     const cycleDayNumber = getCycleDayNumber(this.cycleDay.date)
     return (
-      <View>
+      <ScrollView>
         <View style={ styles.cycleDayDateView }>
           <Text style={styles.dateHeader}>
             {formatDateForViewHeader(this.cycleDay.date)}
@@ -51,7 +52,7 @@ export default class Day extends Component {
             }[this.state.visibleComponent]
           }
         </View >
-      </View >
+      </ScrollView >
     )
   }
 }
diff --git a/components/home.js b/components/home.js
index 0b00592..fa62ad7 100644
--- a/components/home.js
+++ b/components/home.js
@@ -2,7 +2,8 @@ import React, { Component } from 'react'
 import {
   View,
   Button,
-  Text
+  Text,
+  ScrollView
 } from 'react-native'
 import { LocalDate } from 'js-joda'
 import styles from '../styles'
@@ -46,7 +47,7 @@ export default class Home extends Component {
   render() {
     const navigate = this.props.navigation.navigate
     return (
-      <View>
+      <ScrollView>
         <Text style={styles.welcome}>{this.state.welcomeText}</Text>
         <View style={styles.homeButtons}>
           <View style={styles.homeButton}>
@@ -74,7 +75,7 @@ export default class Home extends Component {
             </Button>
           </View>
         </View>
-      </View>
+      </ScrollView>
     )
   }
 }