Lots of UI updates

lib/src/components/DevTool/Modal.js

@@ -1,7 +1,9 @@
-import React, { Component, Fragment } from 'react';
+import React, { Component } from 'react';
 import {
   Button,
   Modal,
+  SafeAreaView,
+  KeyboardAvoidingView,
 } from 'react-native';
 import events from '../../events';
 import DevTool from './index';
@@ -39,6 +41,10 @@ class Events extends Component {
   }
 
   render() {
+    const {
+      includeStackTrace
+    } = this.props;
+
     return (
       <Modal
         animationType="slide"
@@ -47,15 +53,24 @@ class Events extends Component {
         onRequestClose={() => {
         }}
       >
-        <Fragment>
-          <DevTool />
-          <Button
-            title="close"
-            onPress={() => {
-              events.publish('HIDE_DEVTOOLS');
-            }}
-          />
-        </Fragment>
+        <SafeAreaView
+          forceInset={{ top: 'always', vertical: 'always' }}
+          style={{flex: 1}}
+        >
+          <KeyboardAvoidingView
+            style={{flex: 1}}
+            behavior="padding"
+            enabled
+          >
+            <DevTool includeStackTrace={includeStackTrace} />
+            <Button
+              title="close"
+              onPress={() => {
+                events.publish('HIDE_DEVTOOLS');
+              }}
+            />
+          </KeyboardAvoidingView>
+        </SafeAreaView>
       </Modal>
     )
   }