Show monitor when isVisible is true

src/react/DebugPanel.js

@@ -17,7 +17,6 @@ export function getDefaultStyle(props) {
     opacity: 0.92,
     background: 'black',
     color: 'white',
-    padding: '1em',
     left: left ? 0 : undefined,
     right: right ? 0 : undefined,
     top: top ? 0 : undefined,

src/react/LogMonitor.js

@@ -105,17 +105,26 @@ export default class LogMonitor {
       );
     }
 
+    if (this.props.monitorState.isVisible === true) {
       return (
         <div style={{
           fontFamily: 'monospace',
-        position: 'relative'
+          position: 'relative',
+          padding: '1rem'
         }}>
+          <div>
+            <div style={{
+              paddingBottom: '.5rem'
+            }}>
+              <small>Press `ctl+h` to hide.</small>
+            </div>
             <div>
               <a onClick={::this.handleReset}
                  style={{ textDecoration: 'underline', cursor: 'hand' }}>
-            Reset
+                <small>Reset</small>
               </a>
             </div>
+          </div>
           {elements}
           <div>
             {computedStates.length > 1 &&
@@ -148,4 +157,7 @@ export default class LogMonitor {
         </div>
       );
     }
+
+    return false;
+  }
 }