New menu page

skiser · Oct 23, 2019 · 9f91fce · 9f91fce
1 parent a427761
commit 9f91fce
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 84 deletions.
diff --git a/Routinely/app/components/img/AlarmButton.png b/Routinely/app/components/img/AlarmButton.png
diff --git a/Routinely/app/components/img/EventButton.png b/Routinely/app/components/img/EventButton.png
diff --git a/Routinely/app/components/img/ToDoButton.png b/Routinely/app/components/img/ToDoButton.png
diff --git a/Routinely/app/screens/menu.js b/Routinely/app/screens/menu.js
@@ -12,31 +12,46 @@ class MenuScreen extends Component {
   render() {
     return (
       <View>
-        <View style={styles.block}>
-          <TouchableHighlight
-            onPress={() => this.props.navigation.navigate('Task')}>
-            <Image
-              style={styles.contain}
-              source={require('../components/img/clipboard.png')}
-            />
-
-          </TouchableHighlight>
-          <Text style={styles.title}> To-Do List </Text>
+        <View style={styles.row}>
+          <View>
+            <TouchableHighlight
+              onPress={() => this.props.navigation.navigate('Alarm')}>
+              <Image
+                style={styles.alarm}
+                source={require('../components/img/AlarmButton.png')}
+              />
+            </TouchableHighlight>
+          </View>
+          <View>
+            <TouchableHighlight
+              onPress={() => this.props.navigation.navigate('Event')}>
+              <Image
+                style={styles.alarm}
+                source={require('../components/img/EventButton.png')}
+              />
+            </TouchableHighlight>
+          </View>
+        </View>
+        <View style={styles.row}>
+          <View>
+            <TouchableHighlight
+              onPress={() => this.props.navigation.navigate('Task')}>
+              <Image
+                style={styles.alarm}
+                source={require('../components/img/ToDoButton.png')}
+              />
+            </TouchableHighlight>
+          </View>
+          <View>
+            <TouchableHighlight
+              onPress={() => this.props.navigation.navigate('Alarm')}>
+              <Image
+                style={styles.alarm}
+                source={require('../components/img/AlarmButton.png')}
+              />
+            </TouchableHighlight>
+          </View>
         </View>
-        <TouchableHighlight
-          onPress={() => this.props.navigation.navigate('Event')}>
-          <Image
-            style={styles.contain}
-            source={require('../components/img/plus.png')}
-          />
-        </TouchableHighlight>
-        <TouchableHighlight
-          onPress={() => this.props.navigation.navigate('Task')}>
-          <Image
-            style={styles.clip}
-            source={require('../components/img/clipboard.png')}
-          />
-        </TouchableHighlight>
         <Button
           title="Back"
           onPress={() => this.props.navigation.navigate('Calendar')}
@@ -47,75 +62,19 @@ class MenuScreen extends Component {
 }
 
 const styles = StyleSheet.create({
-  block: {
-    margin: 15,
-    width: 150,
-    height: 50,
-    backgroundColor: 'blue',
-    flexDirection: 'row',
-    flexWrap: 'wrap',
-  },
-  title: {
-    paddingTop: 15,
-    fontSize: 18,
-    color: 'white',
-  },
-  plus: {
-    width: 20,
-    height: 20,
-    marginLeft: 350,
-  },
   container: {
     paddingTop: 10,
     paddingLeft: 40,
     paddingRight: 20,
     paddingBottom: 5,
     alignItems: 'center',
   },
-  contain: {
-    width: 50,
-    height: 50,
-    marginRight: 10,
-  },
-  clip: {
-    width: 30,
-    height: 30,
-    marginRight: 10,
-    marginBottom: 10,
-  },
-  calendar: {
-    paddingLeft: 20,
-    paddingRight: 20,
-  },
-  section: {
-    backgroundColor: '#f0f4f7',
-    color: '#79838a',
-  },
-  item: {
-    padding: 20,
-    backgroundColor: 'white',
-    borderBottomWidth: 1,
-    borderBottomColor: '#e8ecf0',
-    flexDirection: 'row',
-  },
-  itemHourText: {
-    color: 'black',
-  },
-  itemDurationText: {
-    color: 'grey',
-    fontSize: 12,
-    marginTop: 4,
+  alarm: {
+    marginRight: 4,
     marginLeft: 4,
   },
-  itemTitleText: {
-    color: 'black',
-    marginLeft: 16,
-    fontWeight: 'bold',
-    fontSize: 16,
-  },
-  itemButtonContainer: {
-    flex: 1,
-    alignItems: 'flex-end',
+  row: {
+    flexDirection: 'row',
   },
 });
 export default MenuScreen;