fix console css

src/App.vue

@@ -48,9 +48,7 @@ body,html{
 }
 @media (max-width: 45rem){
   .console{
-    width: calc(100% - 2rem);
+    width: 100%;
-    height: calc(100% - 2rem);
-    overflow-y: auto;
     left: 0;
   }
 }

src/components/console.vue

@@ -41,7 +41,6 @@ export default {
             });
             this.$forceUpdate();
             this.focusInput();
-            this.scrollToBottom();
           }
           this.scrollToBottom();
         }, group.delay)
@@ -49,6 +48,7 @@ export default {
     },
     focusInput(){
       this.$nextTick(() => this.$refs.consoleInput.focus());
+      this.scrollToBottom();
     },
     scrollToBottom(){
       this.$nextTick(() => this.$refs.console.scrollTop = this.$refs.console.scrollHeight);
@@ -68,9 +68,11 @@ export default {
   .console{
     color: #fff;
     overflow-y: auto;
+    overflow-x: auto;
     .content{
       height: fit-content;
-      margin: 1rem;
+      width: fit-content;
+      padding: 1rem;
       .group{
         .host{color: #02a594;}
         .white{color: #fff;}

src/render-commands.js

@@ -121,7 +121,7 @@ let commands = [
   {
     name: ["surl", "short-url", "shortURL"],
     output:[
-      {color: "blue", content: "\ngit", delay: 100},
+      {color: "blue", content: "\nsurl", delay: 100},
       {color: "white", content: " is loading\n", delay: 200},
       {color: "white", content: "forwarding", delay: 400},
       {color: "white", content: " ...", forward: "https://s.adb.sh", delay: 600}