fix style and function

ykxie
1 parent 8d96160a
Showing 13 changed files with 189 additions and 80 deletions
src/css/ide.css
src/css/main.css
src/css/recording.css
src/css/reset.css
src/gxb-ide/CodingEditer.js
src/gxb-ide/Dir.js
src/gxb-ide/Iterm.js
src/img/full-screen-icon.svg
src/scss/_animation.scss
src/scss/_bootstrapReset.scss
src/scss/main.scss
src/v1.1/index.html
src/v1.1/player.html
@@ -61,9 +61,6 @@ ul.ztree li span.button.add {
   float: left;
   border-bottom: 0; }
-.programing #resultoutput .tab-pane {
-  padding: 0 48px; }
-
 .programing .record-title .nav-tabs > li.active > a, .programing .record-title .nav-tabs > li.active > a:hover, .programing .record-title .nav-tabs > li.active > a:focus {
   color: #fff; }
@@ -77,6 +74,9 @@ ul.ztree li span.button.add {
 .programing .nav > li > a {
   padding: 0; }
+.programing .btn:hover, .programing .btn:focus {
+  outline: none; }
+
 .twinkle:before {
   animation: twinkle 1s infinite;
   -webkit-animation: twinkle 1s infinite; }
@@ -109,7 +109,7 @@ ul.ztree li span.button.add {
 #stdin .effect-2 {
   border: 0;
-  padding: 7px 0;
+  padding: 12px 0 1px;
   border-bottom: 1px solid #ccc; }
 #stdin .effect-2 ~ .focus-border {
@@ -130,13 +130,30 @@ html, body {
   width: 100%;
   height: 100%; }
+:active {
+  outline: none; }
+
+.CodeMirror,
+.CodeMirror * {
+  font-family: monospace !important;
+  font-size: 16px; }
+
+.CodeMirror-gutter {
+  width: 34px !important;
+  min-height: 1000px; }
+
+.ztree li span {
+  margin-right: 8px !important; }
+
 .tooltip-inner {
   background-color: transparent;
   color: #1FB6FF;
   padding: 3px 6px; }
 .tooltip.top {
-  background: url("../img/toptip.png") no-repeat; }
+  background: url("../img/toptip.png") no-repeat;
+  height: 36px;
+  top: -28px !important; }
 .tooltip.top .tooltip-arrow {
   border-top-color: transparent; }
@@ -206,20 +223,21 @@ html, body {
   height: 200px;
   position: absolute;
   bottom: 60px;
-  padding-left: 204px; }
+  padding-left: 204px;
+  z-index: 999;
+  overflow: hidden; }
   .console-wrap .CodeMirror-gutter {
     margin-left: 170px; }
   .console-wrap #toolbar {
     width: 100%;
-    height: 36px;
+    height: 40px;
     overflow: hidden;
-    background-color: #FAFBFC;
+    background-color: #F4F6F9;
     padding: 0 36px; }
     .console-wrap #toolbar .result-tabs {
-      height: 30px;
       border-radius: 30px;
       overflow: hidden;
-      margin: 3px 10px;
+      margin: 5px 10px;
       color: #fff; }
     .console-wrap #toolbar .text {
       color: #1FB6FF; }
@@ -232,7 +250,7 @@ html, body {
       box-shadow: 0px 0px 2px 0px #B3E5FF;
       border: none; }
     .console-wrap #toolbar .result-tabs > li > a, .console-wrap #toolbar .result-tabs > li.active > a:hover {
-      padding: 4px 36px;
+      padding: 4px 21px;
       border: none;
       margin: 1px;
       border-radius: 15px;
@@ -240,17 +258,30 @@ html, body {
       transition: all 0.1s ease; }
     .console-wrap #toolbar .func {
       height: 36px;
-      padding-top: 3px; }
+      padding-top: 5px; }
 .btn {
   padding: 3px 18px; }
 .compile-btn {
   background: #FFF;
-  border: 2px solid #3ad5f5;
+  border: 1px solid #3ad5f5;
+  color: #1FB6FF;
+  border-radius: 24px; }
+
+.static-btn {
+  background: #999;
+  border: 1px solid #3ad5f5;
   color: #1FB6FF;
   border-radius: 24px; }
+.static-btn:active {
+  outline: none; }
+
+.ladda-button .ladda-spinner {
+  width: 26px !important;
+  height: 26px !important; }
+
 #resultoutput {
   height: 164px;
   overflow-y: scroll; }
@@ -285,7 +316,7 @@ html, body {
 .pause-shodow {
   position: absolute;
   top: 0;
-  z-index: 999;
+  z-index: 998;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.4); }
@@ -324,7 +355,7 @@ html, body {
 #countdown {
   display: block;
-  z-index: 999;
+  z-index: 99999;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.6);
@@ -400,7 +431,7 @@ html, body {
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.5);
-  z-index: 999; }
+  z-index: 99999; }
 .before, .after {
   position: absolute;
@@ -428,3 +459,10 @@ html, body {
 .before .recording-time {
   height: 36px;
   line-height: 36px; }
+
+.stdin-wrap {
+  margin: 0 48px;
+  position: relative; }
+
+#stderr, #cmpinfo, #output {
+  padding: 12px 36px; }
@@ -2,13 +2,30 @@ html, body {
   width: 100%;
   height: 100%; }
+:active {
+  outline: none; }
+
+.CodeMirror,
+.CodeMirror * {
+  font-family: monospace !important;
+  font-size: 16px; }
+
+.CodeMirror-gutter {
+  width: 34px !important;
+  min-height: 1000px; }
+
+.ztree li span {
+  margin-right: 8px !important; }
+
 .tooltip-inner {
   background-color: transparent;
   color: #1FB6FF;
   padding: 3px 6px; }
 .tooltip.top {
-  background: url("../img/toptip.png") no-repeat; }
+  background: url("../img/toptip.png") no-repeat;
+  height: 36px;
+  top: -28px !important; }
 .tooltip.top .tooltip-arrow {
   border-top-color: transparent; }
@@ -78,20 +95,21 @@ html, body {
   height: 200px;
   position: absolute;
   bottom: 60px;
-  padding-left: 204px; }
+  padding-left: 204px;
+  z-index: 999;
+  overflow: hidden; }
   .console-wrap .CodeMirror-gutter {
     margin-left: 170px; }
   .console-wrap #toolbar {
     width: 100%;
-    height: 36px;
+    height: 40px;
     overflow: hidden;
-    background-color: #FAFBFC;
+    background-color: #F4F6F9;
     padding: 0 36px; }
     .console-wrap #toolbar .result-tabs {
-      height: 30px;
       border-radius: 30px;
       overflow: hidden;
-      margin: 3px 10px;
+      margin: 5px 10px;
       color: #fff; }
     .console-wrap #toolbar .text {
       color: #1FB6FF; }
@@ -104,7 +122,7 @@ html, body {
       box-shadow: 0px 0px 2px 0px #B3E5FF;
       border: none; }
     .console-wrap #toolbar .result-tabs > li > a, .console-wrap #toolbar .result-tabs > li.active > a:hover {
-      padding: 4px 36px;
+      padding: 4px 21px;
       border: none;
       margin: 1px;
       border-radius: 15px;
@@ -112,17 +130,30 @@ html, body {
       transition: all 0.1s ease; }
     .console-wrap #toolbar .func {
       height: 36px;
-      padding-top: 3px; }
+      padding-top: 5px; }
 .btn {
   padding: 3px 18px; }
 .compile-btn {
   background: #FFF;
-  border: 2px solid #3ad5f5;
+  border: 1px solid #3ad5f5;
+  color: #1FB6FF;
+  border-radius: 24px; }
+
+.static-btn {
+  background: #999;
+  border: 1px solid #3ad5f5;
   color: #1FB6FF;
   border-radius: 24px; }
+.static-btn:active {
+  outline: none; }
+
+.ladda-button .ladda-spinner {
+  width: 26px !important;
+  height: 26px !important; }
+
 #resultoutput {
   height: 164px;
   overflow-y: scroll; }
@@ -157,7 +188,7 @@ html, body {
 .pause-shodow {
   position: absolute;
   top: 0;
-  z-index: 999;
+  z-index: 998;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.4); }
@@ -196,7 +227,7 @@ html, body {
 #countdown {
   display: block;
-  z-index: 999;
+  z-index: 99999;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.6);
@@ -272,7 +303,7 @@ html, body {
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.5);
-  z-index: 999; }
+  z-index: 99999; }
 .before, .after {
   position: absolute;
@@ -300,3 +331,10 @@ html, body {
 .before .recording-time {
   height: 36px;
   line-height: 36px; }
+
+.stdin-wrap {
+  margin: 0 48px;
+  position: relative; }
+
+#stderr, #cmpinfo, #output {
+  padding: 12px 36px; }
@@ -30,7 +30,7 @@
 #stdin .effect-2 {
   border: 0;
-  padding: 7px 0;
+  padding: 12px 0 1px;
   border-bottom: 1px solid #ccc; }
 #stdin .effect-2 ~ .focus-border {
@@ -49,7 +49,7 @@ table {
 /* custom */
 a {
-    color: #dadada;
+    color: rgba(255, 255, 255, 0.6);
     text-decoration: none;
     -webkit-backface-visibility: hidden;
 }
@@ -52,7 +52,7 @@
         },
         initCodeMirror: function(langid){
             var treeLinkEditor = Dir.treeLinkEditor;
-            var langid = getQuery('languageid');
+            var langid = getQuery('languageid') || Dir.languageid;
             initProgramPage(treeLinkEditor, langid);
         },
         /**
@@ -292,6 +292,7 @@
         // 生成 CodeMirror
         for (var i = 0; i < treeLinkEditor.length; i++) {
             var modeNameItem = modeName[i] ||  modeName[0];
+            console.log('00000----------------------00000000')
             console.log(modeNameItem)
             // 判断是否是播放页面，如果是则不显示录制区相关dom
             if(!Dir.isReplayPage){
@@ -609,6 +609,10 @@
                 initTrigger(coderecords)
                 AudioPlayer(audioUrl)
+
+                // 请求玩立刻执行
+                $.AudioPlayer.play()
+
             },
             error: function(error) {
                 console.log(error)
@@ -45,7 +45,7 @@
             }else{
                 if (_this.compileStatus && !_this.isCompile) {
-                    $('#CompileBtn').removeClass('compile-btn');
+                    $('#CompileBtn').removeClass('compile-btn').addClass('static-btn');
                     Hourglass.pauseTimer();     // 暂停计时器
                     if (role == 0) {
                        recorder.pause();        // 音频暂停 
@@ -132,7 +132,7 @@
         }
         CodingEditer.record_startime = new Date().getTime();
-        $('#CompileBtn').addClass('compile-btn');
+        $('#CompileBtn').addClass('compile-btn').removeClass('static-btn');
         isCompile = false;
     } 
 <?xml version="1.0" encoding="UTF-8"?>
-<svg width="42px" height="42px" viewBox="0 0 42 42" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<svg width="36px" height="36px" viewBox="0 0 36 36" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <!-- Generator: Sketch 41 (35326) - http://www.bohemiancoding.com/sketch -->
     <title>全屏</title>
     <desc>Created with Sketch.</desc>
     <defs>
-        <filter x="-50%" y="-50%" width="200%" height="200%" filterUnits="objectBoundingBox" id="filter-1">
-            <feOffset dx="0" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
-            <feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
-            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.5 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
-            <feMerge>
-                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
-                <feMergeNode in="SourceGraphic"></feMergeNode>
-            </feMerge>
-        </filter>
-        <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="linearGradient-2">
+        <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="linearGradient-1">
             <stop stop-color="#41DCFF" offset="0%"></stop>
             <stop stop-color="#1FB6FF" offset="100%"></stop>
         </linearGradient>
-        <rect id="path-3" x="0" y="0" width="32" height="32" rx="16"></rect>
-        <filter x="-50%" y="-50%" width="200%" height="200%" filterUnits="objectBoundingBox" id="filter-4">
+        <rect id="path-2" x="0" y="0" width="32" height="32" rx="16"></rect>
+        <filter x="-50%" y="-50%" width="200%" height="200%" filterUnits="objectBoundingBox" id="filter-3">
             <feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
             <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
             <feComposite in="shadowBlurOuter1" in2="SourceAlpha" operator="out" result="shadowBlurOuter1"></feComposite>
             <feColorMatrix values="0 0 0 0 0.7   0 0 0 0 0.9   0 0 0 0 1  0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
         </filter>
-        <mask id="mask-5" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="0" y="0" width="32" height="32" fill="white">
-            <use xlink:href="#path-3"></use>
+        <mask id="mask-4" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="0" y="0" width="32" height="32" fill="white">
+            <use xlink:href="#path-2"></use>
         </mask>
     </defs>
     <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="03-班次-录制编程界面-其他语言-copy-3" transform="translate(-1124.000000, -714.000000)">
+        <g id="03-班次-录制编程界面-其他语言-copy-3" transform="translate(-1127.000000, -715.000000)">
             <g id="右侧运行窗口" transform="translate(225.000000, 712.000000)">
-                <g id="全屏" filter="url(#filter-1)" transform="translate(904.000000, 5.000000)">
+                <g id="全屏" transform="translate(904.000000, 5.000000)">
                     <g id="Rectangle-14-Copy">
-                        <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-3"></use>
-                        <use stroke="url(#linearGradient-2)" mask="url(#mask-5)" stroke-width="2" fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-3"></use>
+                        <use fill="black" fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-2"></use>
+                        <use stroke="url(#linearGradient-1)" mask="url(#mask-4)" stroke-width="2" fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-2"></use>
                     </g>
                     <path d="M7.53846154,22.1538462 L11.3868999,22.1538462 C11.8053567,22.1538462 12.1538462,22.4982425 12.1538462,22.9230769 C12.1538462,23.3508732 11.8104726,23.6923077 11.3868999,23.6923077 L6.76694626,23.6923077 C6.5580929,23.6923077 6.36666872,23.606517 6.22730211,23.4677533 C6.08505527,23.3282023 6,23.1367711 6,22.9253614 L6,18.3054078 C6,17.886951 6.34439635,17.5384615 6.76923077,17.5384615 C7.19702706,17.5384615 7.53846154,17.8818351 7.53846154,18.3054078 L7.53846154,22.1538462 Z M6.22537503,8.5311432 C6.364106,8.39274731 6.55553689,8.30769231 6.76694626,8.30769231 L11.3868999,8.30769231 C11.8053567,8.30769231 12.1538462,8.65208865 12.1538462,9.07692308 C12.1538462,9.50471937 11.8104726,9.84615385 11.3868999,9.84615385 L7.53846154,9.84615385 L7.53846154,13.6945922 C7.53846154,14.113049 7.19406519,14.4615385 6.76923077,14.4615385 C6.34143448,14.4615385 6,14.1181649 6,13.6945922 L6,9.07463857 C6,8.8657849 6.08579095,8.67436047 6.22455504,8.5349938 Z M24.4615385,22.1538462 L20.6131001,22.1538462 C20.1946433,22.1538462 19.8461538,22.4982425 19.8461538,22.9230769 C19.8461538,23.3508732 20.1895274,23.6923077 20.6131001,23.6923077 L25.2330537,23.6923077 C25.4419071,23.6923077 25.6333313,23.606517 25.7726979,23.4677533 C25.9149447,23.3282023 26,23.1367711 26,22.9253614 L26,18.3054078 C26,17.886951 25.6556037,17.5384615 25.2307692,17.5384615 C24.8029729,17.5384615 24.4615385,17.8818351 24.4615385,18.3054078 L24.4615385,22.1538462 Z M25.774625,8.5311432 C25.635894,8.39274731 25.4444631,8.30769231 25.2330537,8.30769231 L20.6131001,8.30769231 C20.1946433,8.30769231 19.8461538,8.65208865 19.8461538,9.07692308 C19.8461538,9.50471937 20.1895274,9.84615385 20.6131001,9.84615385 L24.4615385,9.84615385 L24.4615385,13.6945922 C24.4615385,14.113049 24.8059348,14.4615385 25.2307692,14.4615385 C25.6585655,14.4615385 26,14.1181649 26,13.6945922 L26,9.07463857 C26,8.8657849 25.914209,8.67436047 25.775445,8.5349938 Z" id="放大-copy" fill="#1FB6FF"></path>
                 </g>
@@ -26,6 +26,6 @@
 #stdin input[type="text"]{font: 15px/24px "Lato", Arial, sans-serif; color: #333; width: 100%; box-sizing: border-box; letter-spacing: 1px;padding-left: 12px;}
-#stdin .effect-2{border: 0; padding: 7px 0; border-bottom: 1px solid #ccc;}
+#stdin .effect-2{border: 0; padding: 12px 0 1px; border-bottom: 1px solid #ccc;}
 #stdin .effect-2 ~ .focus-border{position: absolute; bottom: 0; left: 50%; width: 0; height: 2px; background-color: #62DCF5; transition: 1s;}
 #stdin .effect-2:focus ~ .focus-border{width: 100%; transition: 1s; left: 0;}
 \ No newline at end of file
@@ -3,12 +3,7 @@
         float: left;
         border-bottom: 0;
     }
-    #resultoutput{
-        .tab-pane{
-            padding: 0 48px;
-        }
-    }
-    
+        
     .record-title{
         .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus{
             color: #fff;
@@ -26,6 +21,9 @@
     .nav>li>a{
         padding: 0;
     }
+    .btn:hover, .btn:focus{
+        outline: none;
+    }
 }
@@ -2,7 +2,21 @@ html, body{
     width: 100%;
     height: 100%;
 }
-
+:active {
+    outline: none;
+}
+.CodeMirror,
+.CodeMirror * {
+    font-family: monospace !important;
+    font-size: 16px;
+}
+.CodeMirror-gutter{
+    width: 34px !important;
+    min-height: 1000px;
+}
+.ztree li span{
+    margin-right: 8px !important;
+}
 .tooltip-inner{
     background-color: transparent;
     color: #1FB6FF;
@@ -10,6 +24,8 @@ html, body{
 }
 .tooltip.top{
     background: url('../img/toptip.png') no-repeat;
+    height: 36px;
+    top: -28px !important;
 }
 .tooltip.top .tooltip-arrow{
     // border-top-color: #1FB6FF;
@@ -105,22 +121,24 @@ html, body{
     position: absolute;
     bottom: 60px;
     padding-left: 204px;
+    z-index: 999;
+    overflow: hidden;
     .CodeMirror-gutter{
         margin-left: 170px;
     }
     #toolbar{
         width: 100%;
-        height: 36px;
+        height: 40px;
         overflow: hidden;
-        background-color: #FAFBFC;
+        background-color: #F4F6F9;
         padding: 0 36px;
         .result-tabs{
-            height: 30px;
+            // height: 30px;
             border-radius: 30px;
             // background-color: #62DCF5;
             overflow: hidden;
-            margin: 3px 10px;
+            margin: 5px 10px;
             color: #fff;
         }
         .text{
@@ -137,7 +155,7 @@ html, body{
             border: none;
         }
         .result-tabs>li>a, .result-tabs>li.active>a:hover{
-            padding: 4px 36px;
+            padding: 4px 21px;
             border: none;
             margin: 1px;
             border-radius: 15px;
@@ -148,7 +166,7 @@ html, body{
         .func{
             height: 36px;
-            padding-top: 3px;
+            padding-top: 5px;
         }
     }
 }
@@ -162,10 +180,23 @@ html, body{
     // -webkit-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;
     // transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;
     background: #FFF;
-    border: 2px solid #3ad5f5;
+    border: 1px solid #3ad5f5;
+    color: #1FB6FF;
+    border-radius: 24px;
+}
+.static-btn{
+    background: #999;
+    border: 1px solid #3ad5f5;
     color: #1FB6FF;
     border-radius: 24px;
 }
+.static-btn:active{
+    outline: none
+}
+.ladda-button .ladda-spinner{
+    width: 26px !important;
+    height: 26px !important;
+}
 #full-screen, #back-screen{
 }
@@ -216,7 +247,7 @@ html, body{
 .pause-shodow{
     position: absolute;
     top: 0;
-    z-index: 999;
+    z-index: 998;
     width: 100%;
     height: 100%;
     background-color: rgba(0,0,0,0.4);
@@ -268,7 +299,7 @@ html, body{
 // 开始录制动画
 #countdown{
     display: block;
-    z-index: 999;
+    z-index: 99999;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.6);
@@ -360,7 +391,7 @@ html, body{
     width: 100%;
     height: 100%;
     background-color: rgba(0,0,0,0.5);
-    z-index: 999;
+    z-index: 99999;
 }
 .before, .after{
@@ -391,8 +422,13 @@ html, body{
     height: 36px;
     line-height: 36px;
 }
+.stdin-wrap{
+    margin: 0 48px;
+    position: relative;
+}
-
-
+#stderr, #cmpinfo, #output{
+    padding: 12px 36px;
+}
@@ -100,8 +100,10 @@
                     <div id="resultoutput" class="tab-content need-compile">
                         <div class="tab-pane active padall15" id="stdin">
                             <!-- <input type="text" class="form-control" id="runtimeArgus" placeholder="标准输入"> -->
-                            <input class="effect-2" id="runtimeArgus" type="text" placeholder="标准输入">
-                            <span class="focus-border"></span>
+                            <div class="stdin-wrap">
+                                <input class="effect-2" id="runtimeArgus" type="text" placeholder="标准输入">
+                                <span class="focus-border"></span>
+                            </div>
                         </div>
                         <div class="tab-pane padall15" id="cmpinfo"></div>
                         <div class="tab-pane padall15" id="stderr"></div>
@@ -4,22 +4,21 @@
     <meta charset="UTF-8">
     <title></title>
     <link rel="stylesheet" href="../css/responsive/css/bootstrap.min.css">
-    <link href="../css/codemirror.css" rel="stylesheet">
+    <!-- <link href="../css/codemirror.css" rel="stylesheet"> -->
     <link href="../css/reset.css" rel="stylesheet">
     <link rel="stylesheet" href="../js/audioPlayer/theme.default.css">
     <link rel="stylesheet" href="../js/zTree_v3-3.5.27/css/zTreeStyle/zTreeStyle.css">
     <link href="../common/fonts/iconfont.css" rel="stylesheet">
+    <link href="../css/codemirror.css" rel="stylesheet">
     <link href="../css/cm-theme/gbtags.css" rel="stylesheet">
-    <link href="../css/cm-theme/eclipse.css" rel="stylesheet">
+    <link href="../css/cm-theme/erlang-dark.css" rel="stylesheet">
     <link href="../css/cm-theme/gbtags-dark.css" rel="stylesheet">
     <link rel="stylesheet" href="../gxb-ide/toolBox.css">
     <link rel="stylesheet" href="../css/ide.css">
-    
-    
     <script>
         var gxb_api = "https://restful.gaoxiaobang.com";
         // var gxb_api = "http://192.168.80.223:8080"
@@ -101,8 +100,10 @@
                     <div id="resultoutput" class="tab-content need-compile">
                         <div class="tab-pane active padall15" id="stdin">
                             <!-- <input type="text" class="form-control" id="runtimeArgus" placeholder="标准输入"> -->
-                            <input class="effect-2" id="runtimeArgus" type="text" placeholder="标准输入">
-                            <span class="focus-border"></span>
+                            <div class="stdin-wrap">
+                                <input class="effect-2" id="runtimeArgus" type="text" placeholder="标准输入">
+                                <span class="focus-border"></span>
+                            </div>
                         </div>
                         <div class="tab-pane padall15" id="cmpinfo"></div>
                         <div class="tab-pane padall15" id="stderr"></div>