Create a container for JSONArrow for easier clickability

Author: Jason Axelson

src/JSONArrow.js

@@ -1,11 +1,16 @@
 import React from 'react';
 
+const containerStyles = {
+  display: 'inline-block',
+  padding: '2 5',
+  cursor: 'pointer'
+};
+
 const styles = {
   base: {
     display: 'inline-block',
     marginLeft: 0,
     marginTop: 8,
-    marginRight: 5,
     'float': 'left',
     transition: '150ms',
     WebkitTransition: '150ms',
@@ -41,6 +46,8 @@ export default class JSONArrow extends React.Component {
       ...style,
       ...this.props.style
     };
-    return <div style={style} onClick={this.props.onClick}/>;
+    return <div className='JSONArrow-container' style={containerStyles} onClick={this.props.onClick}>
+      <div style={style}/>
+    </div>;
   }
 }

src/JSONNestedNode.js

@@ -17,7 +17,8 @@ const styles = {
   label: {
     margin: 0,
     padding: 0,
-    display: 'inline-block'
+    display: 'inline-block',
+    cursor: 'pointer'
   },
   span: {
     cursor: 'default'