Increase node indentation

src/react/JSONTree/JSONArrayNode.js

@@ -7,10 +7,10 @@ import grabNode from './grab-node';
 const styles = {
   base: {
     position: 'relative',
-    paddingTop: 2,
-    paddingBottom: 2,
-    paddingRight: 4,
-    marginLeft: 3
+    paddingTop: 3,
+    paddingBottom: 3,
+    paddingRight: 0,
+    marginLeft: 14
   },
   label: {
     margin: 0,

src/react/JSONTree/JSONArrow.js

@@ -3,10 +3,11 @@ import React from 'react';
 const styles = {
   base: {
     display: 'inline-block',
-    marginLeft: -15,
+    marginLeft: 0,
+    marginTop: 8,
+    marginRight: 5,
     'float': 'left',
     transition: '150ms',
-    marginTop: 7,
     WebkitTransition: '150ms',
     MozTransition: '150ms',
     borderLeft: '5px solid transparent',

src/react/JSONTree/JSONBooleanNode.js

@@ -5,10 +5,10 @@ import hexToRgb from '../../utils/hexToRgb';
 
 const styles = {
   base: {
-    paddingTop: 2,
-    paddingBottom: 2,
-    paddingRight: 4,
-    marginLeft: 10
+    paddingTop: 3,
+    paddingBottom: 3,
+    paddingRight: 0,
+    marginLeft: 14
   },
   label: {
     display: 'inline-block',

src/react/JSONTree/JSONNullNode.js

@@ -5,10 +5,10 @@ import hexToRgb from '../../utils/hexToRgb';
 
 const styles = {
   base: {
-    paddingTop: 2,
-    paddingBottom: 2,
-    paddingRight: 4,
-    marginLeft: 10
+    paddingTop: 3,
+    paddingBottom: 3,
+    paddingRight: 0,
+    marginLeft: 14
   },
   label: {
     display: 'inline-block',

src/react/JSONTree/JSONNumberNode.js

@@ -5,10 +5,10 @@ import hexToRgb from '../../utils/hexToRgb';
 
 const styles = {
   base: {
-    paddingTop: 2,
-    paddingBottom: 2,
-    paddingRight: 4,
-    marginLeft: 10
+    paddingTop: 3,
+    paddingBottom: 3,
+    paddingRight: 0,
+    marginLeft: 14
   },
   label: {
     display: 'inline-block',

src/react/JSONTree/JSONObjectNode.js

@@ -7,10 +7,9 @@ import grabNode from './grab-node';
 const styles = {
   base: {
     position: 'relative',
-    paddingTop: 2,
-    paddingBottom: 2,
-    paddingRight: 4,
-    marginLeft: 3
+    paddingTop: 3,
+    paddingBottom: 3,
+    marginLeft: 14
   },
   label: {
     margin: 0,

src/react/JSONTree/JSONStringNode.js

@@ -5,10 +5,10 @@ import hexToRgb from '../../utils/hexToRgb';
 
 const styles = {
   base: {
-    paddingTop: 2,
-    paddingBottom: 2,
-    paddingRight: 4,
-    marginLeft: 10
+    paddingTop: 3,
+    paddingBottom: 3,
+    paddingRight: 0,
+    marginLeft: 14
   },
   label: {
     display: 'inline-block',

src/react/JSONTree/index.js

@@ -12,7 +12,10 @@ const styles = {
     tree: {
       border: 0,
       padding: 0,
-      margin: 0,
+      marginTop: 8,
+      marginBottom: 8,
+      marginLeft: 2,
+      marginRight: 0,
       fontSize: '0.90em',
       listStyle: 'none',
       MozUserSelect: 'none',

src/react/LogMonitorEntry.js

@@ -8,7 +8,7 @@ const styles = {
     WebkitUserSelect: 'none'
   },
   tree: {
-    paddingLeft: 5
+    paddingLeft: 0
   }
 };
 
@@ -72,9 +72,7 @@ export default class LogMonitorEntry {
           onClick={::this.handleActionClick}
           style={{...styles.entry, ...styleEntry}}/>
         {!collapsed &&
-          <div style={{
-            paddingLeft: 15
-          }}>
+          <div>
             {this.printState(state, error)}
           </div>
         }