Fix terminal styling, keep commandline in view

CSS frameworks have opinions on what inputs should look like, and how
elements should be spaced. This is nice for design generally, but not
good for this terminal. Add overrides to all terminal elements,
particularly for the commandline input tag.

After every command is entered, refocusing the command input field keeps
it in view.

tags/terminal.tag

@@ -60,6 +60,10 @@
   <display welcome={ welcome } events={ this } />
   <commandline prompt={ prompt } events={ this } />
 
+  <style>
+    terminal * { padding: 0; margin: 0; line-height: normal; font-size: 100%; }
+  </style>
+
   /**
    * Create a new shell with the class name given to the terminal tag.
    * The terminal tag object passes events between the shell and the other tags.
@@ -130,11 +134,13 @@
   </form>
 
   <style>
-    commandline input[name='command'] {
+    commandline input[name='command'],
+    commandline input[name='command']:hover,
+    commandline input[name='command']:focus {
+      padding: 0; margin: 0; line-height: normal; font-size: 100%;
       background: transparent;
       border: none; outline: none;
-      padding: 0; margin: 0;
-      width: 70%;
+      height: auto; width: 70%;
     }
   </style>
 
@@ -166,6 +172,9 @@
     this.command.value = ''
     ev.trigger('disp_add', prompt + command + '\n')
     ev.trigger('cmd_entered', command)
+    // Refocus on the command input to scroll the display and keep it in view.
+    this.command.blur()
+    this.command.focus()
   }
 
   encode(text) {