Refine HeaderBar styles

2 files changed, 8 insertions, 10 deletions

diff --git a/app/components/HeaderBar.js b/app/components/HeaderBar.js
index c2e02cc35c..50ab49d39f 100644
--- a/app/components/HeaderBar.js
+++ b/app/components/HeaderBar.js
@@ -49,11 +49,9 @@ export default class HeaderBar extends Component {
           : null}
 
         {this.props.showSettings ?
-          <View style={styles.headerbar__settings}>
-            <Button onPress={ this.props.onSettings } testName="headerbar__settings">
-              <Img style={ styles.headerbar__settings } source='icon-settings'/>
-            </Button>
-          </View>
+          <Button style={ styles.headerbar__settings } onPress={ this.props.onSettings } testName="headerbar__settings">
+            <Img source='icon-settings' style={ styles.headerbar__settings_icon } />
+          </Button>
           : null}
       </View>
     );
diff --git a/app/components/HeaderBarStyles.js b/app/components/HeaderBarStyles.js
index 5e80f4f635..bc7b982a41 100644
--- a/app/components/HeaderBarStyles.js
+++ b/app/components/HeaderBarStyles.js
@@ -56,14 +56,14 @@ const styles = {
     height: 50,
     width: 50,
   }),
-  headerbar__settings:
+  headerbar__settings: {
+    padding: 0
+  },
+  headerbar__settings_icon:
   Styles.createViewStyle({
     width: 24,
     height: 24,
-    backgroundColor: 'transparent',
-    marginLeft: -6, //Because of button.css, when removed remove this
-    marginTop: -1, //Because of button.css, when removed remove this
-  })
+  }),
 };
 
 module.exports = styles;