opt: optimize element ui dialog styles, make it to the center of screen

web/src/App.vue

@@ -24,4 +24,20 @@ html, body {
   -webkit-font-smoothing: antialiased;
   text-rendering: optimizeLegibility;
 }
+
+.el-overlay-dialog {
+  display flex
+  justify-content center
+  align-items center
+  overflow hidden
+
+  .el-dialog {
+    margin 0;
+
+    .el-dialog__body {
+      //max-height 1440px
+    }
+  }
+}
+
 </style>

web/src/components/ConfigDialog.vue

@@ -1,9 +1,9 @@
 <template>
   <el-dialog
+      class="config-dialog"
       v-model="showDialog"
-      :close-on-click-modal="false"
+      :close-on-click-modal="true"
       :before-close="close"
-      :top="50+'px'"
       title="用户设置"
   >
     <div class="user-info" id="user-info">
@@ -161,26 +161,26 @@ const close = function () {
 </script>
 
 <style lang="stylus">
-.el-dialog {
+.config-dialog {
-  --el-dialog-width 90%;
+  .el-dialog {
-  max-width 800px;
+    --el-dialog-width 90%;
+    max-width 800px;
 
-  .el-dialog__body {
+    .el-dialog__body {
-    padding-top 10px;
+      overflow-y auto;
-    max-height 600px;
-    overflow-y auto;
 
-    .user-info {
+      .user-info {
-      position relative;
+        position relative;
 
-      .el-message {
+        .el-message {
-        position: absolute;
+          position: absolute;
+        }
       }
-    }
 
-    .tip {
+      .tip {
-      color #c1c1c1
+        color #c1c1c1
-      font-size 12px;
+        font-size 12px;
+      }
     }
   }
 }

web/src/components/PasswordDialog.vue

@@ -1,7 +1,8 @@
 <template>
   <el-dialog
+      class="password-dialog"
       v-model="showDialog"
-      :close-on-click-modal="false"
+      :close-on-click-modal="true"
       :show-close="true"
       :before-close="close"
       title="修改密码"
@@ -71,20 +72,20 @@ const close = function () {
 </script>
 
 <style lang="stylus">
-.el-dialog {
+.password-dialog {
-  --el-dialog-width 90%;
+  .el-dialog {
-  max-width 650px;
+    --el-dialog-width 90%;
+    max-width 650px;
 
-  .el-dialog__body {
+    .el-dialog__body {
-    padding-top 10px;
+      overflow-y auto;
-    max-height 600px;
-    overflow-y auto;
 
-    .form {
+      .form {
-      position relative;
+        position relative;
 
-      .el-message {
+        .el-message {
-        position: absolute;
+          position: absolute;
+        }
       }
     }
   }

web/src/components/RewardVerify.vue

@@ -1,7 +1,7 @@
 <template>
   <el-dialog
       v-model="showDialog"
-      :close-on-click-modal="false"
+      :close-on-click-modal="true"
       :show-close="mobile !== ''"
       :before-close="close"
       :title="title"

web/src/views/ChatPlus.vue

@@ -1171,25 +1171,6 @@ $borderColor = #4676d0;
     min-width: 100px;
     max-width: 600px;
   }
-
-  .token-dialog {
-    .el-dialog {
-      --el-dialog-width: 90%;
-      max-width: 400px;
-
-      .el-dialog__body {
-        padding: 10px 10px 20px 10px;
-      }
-
-      .el-row {
-        flex-wrap: nowrap
-
-        button {
-          margin-left: 5px;
-        }
-      }
-    }
-  }
 }
 
 .el-select-dropdown__wrap {
@@ -1214,16 +1195,3 @@ $borderColor = #4676d0;
   }
 }
 </style>
-
-<style lang="stylus">
-.el-overlay-dialog {
-  display flex
-  justify-content center
-  align-items center
-
-  .el-dialog {
-    margin 10px;
-  }
-}
-
-</style>

web/src/views/admin/Home.vue

@@ -44,16 +44,3 @@ checkAdminSession().then(() => {
 @import '@/assets/css/color-dark.css';
 @import '@/assets/iconfont/iconfont.css';
 </style>
-
-<style lang="stylus">
-.el-overlay-dialog {
-  display flex
-  justify-content center
-  align-items center
-
-  .el-dialog {
-    margin 10px;
-  }
-}
-
-</style>