From d2c0891a68c4097d5f122a50bcbedf38fbe368de Mon Sep 17 00:00:00 2001
From: Julia Friesel <julia.friesel@gmail.com>
Date: Sat, 18 May 2019 06:40:36 +0200
Subject: [PATCH] Try out moving it to body

---
 components/cycle-day/symptoms/symptom-view.js | 16 +++++++++++-
 components/header/symptom-view.js             |  6 +++--
 styles/index.js                               | 25 +++++++++++++------
 3 files changed, 36 insertions(+), 11 deletions(-)

diff --git a/components/cycle-day/symptoms/symptom-view.js b/components/cycle-day/symptoms/symptom-view.js
index b782a12..15022ed 100644
--- a/components/cycle-day/symptoms/symptom-view.js
+++ b/components/cycle-day/symptoms/symptom-view.js
@@ -1,9 +1,13 @@
 import React, { Component } from 'react'
-import { BackHandler, View, Alert } from 'react-native'
+import {
+  BackHandler, View, Alert, TouchableOpacity
+} from 'react-native'
 import { saveSymptom } from '../../../db'
 import Header from '../../header/symptom-view'
 import { headerTitles } from '../../../i18n/en/labels'
 import { sharedDialogs } from '../../../i18n/en/cycle-day'
+import FeatherIcon from 'react-native-vector-icons/Entypo'
+import styles, { iconStyles } from '../../../styles'
 
 export default class SymptomView extends Component {
   constructor(props) {
@@ -66,6 +70,16 @@ export default class SymptomView extends Component {
             )
           }}
         />
+        <TouchableOpacity
+          onPress={() => {}}
+          style={styles.infoButtonSymptomView}
+        >
+          <FeatherIcon
+            name="info-with-circle"
+            {...iconStyles.infoInSymptomView}
+            style={styles.symptomInfoIcon}
+          />
+        </TouchableOpacity>
         {this.renderContent()}
       </View>
     )
diff --git a/components/header/symptom-view.js b/components/header/symptom-view.js
index d3df585..e760377 100644
--- a/components/header/symptom-view.js
+++ b/components/header/symptom-view.js
@@ -32,12 +32,14 @@ export default function SymptomViewHeader(props) {
       </View >
       <TouchableOpacity
         onPress={props.deleteEntry}
-        style={[styles.infoButton, {opacity: props.deleteIconActive ? 1 : 0}]}
+        style={[
+          styles.headerDeleteButton,
+          {opacity: props.deleteIconActive ? 1 : 0}
+        ]}
         disabled={!props.deleteIconActive}
       >
         <Icon
           name="delete"
-          style={styles.symptomDeleteIcon}
           {...iconStyles.symptomHeaderIcons}
         />
       </TouchableOpacity>
diff --git a/styles/index.js b/styles/index.js
index 2b5d0f0..6221202 100644
--- a/styles/index.js
+++ b/styles/index.js
@@ -176,10 +176,6 @@ export default StyleSheet.create({
     fontFamily: textFontBold,
     marginTop: 10
   },
-  symptomDeleteIcon: {
-    marginRight: 20,
-    marginLeft: 20
-  },
   symptomBoxImage: {
     width: 50,
     height: 50
@@ -438,8 +434,15 @@ export default StyleSheet.create({
     marginTop: 20,
     color: 'grey'
   },
-  infoButton: {
-    paddingVertical: 20
+  headerDeleteButton: {
+    paddingHorizontal: 20,
+    paddingVertical: 20,
+    alignItems: 'flex-end'
+  },
+  infoButtonSymptomView: {
+    paddingHorizontal: 20,
+    paddingVertical: 10,
+    alignItems: 'flex-end'
   },
   licensePage: {
     paddingVertical: 20,
@@ -479,7 +482,13 @@ export const iconStyles = {
     color: colorInActive,
   },
   infoInHeading: {
-    marginRight: 5,
-    color: 'black'
+    marginRight: 5
+  },
+  infoInSymptomView: {
+    size: 20
+  },
+  hiddenIcon: {
+    size: 20,
+    display: 'none'
   }
 }