perf: keep the horizontal scroll bar of response preview in the bottom

clearstudio · Oct 20, 2020 · 7af4ac7 · 7af4ac7
1 parent 4ca9b3a
commit 7af4ac7
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 3 deletions.
diff --git a/NetworkPlus/index.html b/NetworkPlus/index.html
@@ -68,7 +68,7 @@
               </el-collapse>
             </el-tab-pane>
             <el-tab-pane label="Preview" name="preview">
-              <pre style="font-size: 15px;" v-html="preview"></pre>
+              <pre id="preview-pre" v-html="preview"></pre>
             </el-tab-pane>
           </el-tabs>
           <el-button type="primary" icon="el-icon-position" circle class="resend" @click="resendBtnClicked"

diff --git a/NetworkPlus/style/main.css b/NetworkPlus/style/main.css
@@ -53,6 +53,7 @@ html, body {
   padding-right: 0;
   height: 95%;
   overflow: hidden;
+  border-bottom: 1px solid #EBEEF5;
 }
 
 .json-key {
@@ -121,8 +122,19 @@ pre {
 }
 
 .el-tab-pane {
-  overflow:auto;
-  height:100%;
+  overflow: auto;
+  height: 100%;
+}
+
+#pane-preview {
+  overflow-y: hidden;
+}
+
+#preview-pre {
+  font-size: 15px;
+  height: calc(100% - 32.7px);
+  margin: 0;
+  padding: 15px 0;
 }
 
 .resend {