From 9c65fa5738691cae9e8b86b6b59e802f62c22e1c Mon Sep 17 00:00:00 2001
From: yanglbme <szuyanglb@outlook.com>
Date: Tue, 5 Nov 2019 19:31:36 +0800
Subject: [PATCH] feat: update scrollbar

---
 assets/css/app.css       | 26 ++++++++++++++++++++++----
 assets/scripts/editor.js | 18 ++++++++++++------
 index.html               |  2 +-
 3 files changed, 35 insertions(+), 11 deletions(-)

diff --git a/assets/css/app.css b/assets/css/app.css
index e569056..ae9bce6 100644
--- a/assets/css/app.css
+++ b/assets/css/app.css
@@ -112,10 +112,6 @@ section {
   width: 100% !important;
 }
 
-/*.preview ul, .preview ol {*/
-/*  padding-left: 40px !important;*/
-/*}*/
-
 .select-item-left {
   float: left;
 }
@@ -197,3 +193,25 @@ section {
   position: relative;
   font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
 }
+
+::-webkit-scrollbar {
+  width: 6px;
+  height: 16px;
+  background-color: #FFF;
+}
+
+::-webkit-scrollbar-track {
+  border-radius: 6px;
+  background-color: #FFF;
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 6px;
+  background-color: rgba(144, 146, 152, 0.5);
+  cursor: pointer;
+  transition: background-color .3s;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background-color: rgba(144, 146, 152, 0.5);
+}
\ No newline at end of file
diff --git a/assets/scripts/editor.js b/assets/scripts/editor.js
index 63ea26d..5925664 100644
--- a/assets/scripts/editor.js
+++ b/assets/scripts/editor.js
@@ -144,17 +144,23 @@ let app = new Vue({
       try {
         if (document.execCommand('copy')) {
           this.$message({
-            message: '已复制文章到剪贴板，可直接到公众号后台粘贴', type: 'success'
-          })
+            showClose: true,
+            message: '已复制文章到剪贴板，可直接到公众号后台粘贴', 
+            type: 'success'
+          });
         } else {
           this.$message({
-            message: '未能复制文章到剪贴板，请全选后右键复制', type: 'warning'
-          })
+            showClose: true,
+            message: '未能复制文章到剪贴板，请全选后右键复制', 
+            type: 'warning'
+          });
         }
       } catch (err) {
         this.$message({
-          message: '未能复制文章到剪贴板，请全选后右键复制', type: 'warning'
-        })
+          showClose: true,
+          message: '未能复制文章到剪贴板，请全选后右键复制', 
+          type: 'warning'
+        });
       }
     },
     openWindow: function (url) {
diff --git a/index.html b/index.html
index f0fe635..0f3eea4 100644
--- a/index.html
+++ b/index.html
@@ -88,10 +88,10 @@
               </div>
             </section>
           </el-col>
+
         </el-row>
       </el-main>
     </el-container>
-
     <el-dialog title="关于" :visible.sync="aboutDialogVisible" width="30%" center>
       <div style="text-align: center;">
         <h3>一款简洁美观的微信 Markdown 编辑器</h3>