Changing the mood icon

components/chart/chart.js

@@ -23,7 +23,7 @@ const symptomIcons = {
   desire: <DripIcon size={16} name='drip-icon-desire' color={styles.iconShades.desire[2]}/>,
   sex: <DripIcon size={16} name='drip-icon-sex' color={styles.iconShades.sex[2]}/>,
   pain: <DripIcon size={16} name='drip-icon-pain' color={styles.iconShades.pain[0]}/>,
-  mood: <DripHomeIcon size={16} name='circle' color={styles.iconShades.mood[0]}/>,
+  mood: <DripIcon size={16} name='drip-icon-mood' color={styles.iconShades.mood[0]}/>,
   note: <DripIcon size={16} name='drip-icon-note' color={styles.iconShades.note[0]}/>
 }
 

components/chart/styles.js

@@ -77,8 +77,8 @@ const styles = {
       '#9e346c',
     ],
     'pain': ['#bccd67'],
-    'mood': ['#BC6642'],
-    'note': ['#6CA299']
+    'mood': ['#bc6642'],
+    'note': ['#6ca299']
   },
   yAxis: {
     width: 27,

components/cycle-day/cycle-day-overview.js

@@ -13,7 +13,6 @@ import styles from '../../styles'
 import * as labels from '../../i18n/en/cycle-day'
 import AppText from '../app-text'
 import DripIcon from '../../assets/drip-icons'
-import DripHomeIcon from '../../assets/drip-home-icons'
 
 const bleedingLabels = labels.bleeding.labels
 const feelingLabels = labels.mucus.feeling.categories
@@ -252,7 +251,7 @@ export default class CycleDayOverView extends Component {
               onPress={() => this.navigate('MoodEditView')}
               data={this.getLabel('mood')}
               disabled={dateInFuture}
-              iconName='circle'
+              iconName='drip-icon-mood'
             >
             </SymptomBox>
             <SymptomBox
@@ -277,9 +276,9 @@ export default class CycleDayOverView extends Component {
 
 class SymptomBox extends Component {
   render() {
-    const d = this.props.data
-    const boxActive = d ? styles.symptomBoxActive : {}
-    const textActive = d ? styles.symptomTextActive : {}
+    const hasData = this.props.data
+    const boxActive = hasData ? styles.symptomBoxActive : {}
+    const textActive = hasData ? styles.symptomTextActive : {}
     const disabledStyle = this.props.disabled ? styles.symptomInFuture : {}
 
     return (
@@ -288,10 +287,7 @@ class SymptomBox extends Component {
         disabled={this.props.disabled}
       >
         <View style={[styles.symptomBox, boxActive, disabledStyle]}>
-          {this.props.iconName == 'circle'
-            ? <DripHomeIcon name='circle' size={50} color={d ? 'white' : 'black'}/>
-            : <DripIcon name={this.props.iconName} size={50} color={d ? 'white' : 'black'}/>
-          }
+          <DripIcon name={this.props.iconName} size={50} color={hasData ? 'white' : 'black'}/>
           <AppText style={[textActive, disabledStyle]}>
             {this.props.title.toLowerCase()}
           </AppText>