add react-hot-loader, smaller margin in token modal heading

.babelrc

@@ -10,6 +10,7 @@
     ]
   ],
   "plugins": [
+    "react-hot-loader/babel",
     "@babel/plugin-syntax-dynamic-import",
     "@babel/plugin-transform-member-expression-literals",
     "@babel/plugin-transform-property-literals",

package.json

@@ -77,6 +77,7 @@
     "react": "^16.4.0",
     "react-dom": "^16.4.0",
     "react-final-form": "^4.1.0",
+    "react-hot-loader": "^4.8.0",
     "react-redux": "^6.0.1",
     "react-router-dom": "^4.3.1",
     "recompose": "^0.30.0",

src/components/Root/index.js

@@ -0,0 +1,31 @@
+// @flow
+import 'babel-polyfill'
+
+import { MuiThemeProvider } from '@material-ui/core/styles'
+import React, { Suspense } from 'react'
+import { Provider } from 'react-redux'
+import { ConnectedRouter } from 'connected-react-router'
+import { hot } from 'react-hot-loader/root'
+import PageFrame from '../layout/PageFrame'
+import Loader from '../Loader'
+import { history, store } from '~/store'
+import theme from '~/theme/mui'
+import AppRoutes from '~/routes'
+
+import './index.scss'
+
+const Root = () => (
+  <Provider store={store}>
+    <MuiThemeProvider theme={theme}>
+      <ConnectedRouter history={history}>
+        <PageFrame>
+          <Suspense fallback={<Loader />}>
+            <AppRoutes />
+          </Suspense>
+        </PageFrame>
+      </ConnectedRouter>
+    </MuiThemeProvider>
+  </Provider>
+)
+
+export default hot(Root)

src/index.js

@@ -1,33 +1,8 @@
 // @flow
-/* eslint-disable */
 import 'babel-polyfill'
-require('dotenv').config()
 
-import { MuiThemeProvider } from '@material-ui/core/styles'
-import React, { Suspense } from 'react'
+import React from 'react'
 import ReactDOM from 'react-dom'
-import { Provider } from 'react-redux'
-import { ConnectedRouter } from 'connected-react-router'
-import PageFrame from '~/components/layout/PageFrame'
-import Loader from './components/Loader/index'
-import { history, store } from '~/store'
-import theme from '~/theme/mui'
-import AppRoutes from '~/routes'
-
-import './index.scss'
-
-const Root = () => (
-  <Provider store={store}>
-    <MuiThemeProvider theme={theme}>
-      <ConnectedRouter history={history}>
-        <PageFrame>
-          <Suspense fallback={<Loader />}>
-            <AppRoutes />
-          </Suspense>
-        </PageFrame>
-      </ConnectedRouter>
-    </MuiThemeProvider>
-  </Provider>
-)
+import Root from '~/components/Root'
 
 ReactDOM.render(<Root />, document.getElementById('root'))

src/routes/safe/component/Balances/Tokens/style.js

@@ -5,10 +5,10 @@ import {
 
 export const styles = () => ({
   root: {
-    minHeight: '143px',
+    minHeight: '127px',
   },
   heading: {
-    padding: `${md} ${lg}`,
+    padding: `${sm} ${lg}`,
     justifyContent: 'space-between',
   },
   manage: {