فهرست منبع

style:订阅设置开关弹框、关键词删除弹框样式统一

yangfeng 1 سال پیش
والد
کامیت
13a28075a7

+ 28 - 9
apps/bigmember_pc/src/assets/style/reset-ele.scss

@@ -96,7 +96,8 @@
     transition: opacity 1s;
   }
 }
-.custom-message-box {
+.custom-message-box,
+.custom-alert-box {
   width: 380px !important;
   border-radius: 8px!important;
   .custom-confirm-btn {
@@ -122,25 +123,43 @@
     color: #686868;
     font-size: 16px;
   }
+  .el-message-box__message,
+  .message-text {
+    font-size: 14px;
+    color: #686868;
+    line-height: 24px;
+  }
+}
+.custom-alert-box{
+  padding-bottom: 32px!important;
+  .el-message-box__header{
+    padding-top: 32px!important;
+  }
+  .el-message-box__title{
+    line-height: 28px;
+  }
+  .el-message-box__btns{
+    display: flex;
+    align-items: center;
+    flex-direction: row-reverse;
+    justify-content: space-between;
+    padding: 17px 32px 0;
+  }
+  .custom-confirm-btn{
+    margin-left: 0!important;
+    margin-top: 0;
+  }
   .custom-default-btn,
   .custom-default-btn:hover,
   .custom-default-btn:focus{
     width: 132px;
     height: 36px;
-    margin-right: 52px;
     border-radius: 6px;
     background-color: #fff;
     border: 1px solid #DCDFE6;
     color: #686868;
     font-size: 16px;
   }
-
-  .el-message-box__message,
-  .message-text {
-    font-size: 14px;
-    color: #686868;
-    line-height: 24px;
-  }
 }
 .el-popper {
   li {

+ 5 - 5
apps/bigmember_pc/src/components/push-list/PushList.vue

@@ -2070,11 +2070,11 @@ export default {
 }
 
 .list-item:hover {
-  background: #f7f9fc;
-  // box-shadow: inset 0px -1px 0px rgb(0, 0, 0, .05);
-  // .a-i-left{
-  //   color: #2CB7CA;
-  // }
+  background: #F6F6F6;
+  box-shadow: inset 0px -1px 0px rgb(0, 0, 0, .05);
+  .a-i-left{
+    color: #2CB7CA;
+  }
 }
 
 .list-index {

+ 16 - 14
apps/bigmember_pc/src/components/scope/components/List.vue

@@ -387,16 +387,16 @@ export default {
     display: flex;
     flex-direction: column;
     align-items: center;
-    padding: 32px 32px 42px;
+    padding: 32px;
     background: #ffffff;
-    border-radius: 6px;
+    border-radius: 8px;
     .delete-class-header {
       font-size: 18px;
       line-height: 28px;
       color: #1d1d1d;
     }
     .delete-class-content {
-      padding: 20px 0 42px;
+      padding: 20px 0 32px;
       color: #686868;
       font-size: 14px;
       line-height: 22px;
@@ -404,28 +404,30 @@ export default {
     .delete-class-footer {
       display: flex;
       align-items: center;
+      justify-content: space-between;
+      width: 100%;
       .confirm,
       .cancel {
-        padding: 10px 50px;
-        margin: 0 20px;
+        padding: 9px 50px;
+        border-radius: 6px;
+        font-size: 16px;
       }
       ::v-deep {
         .el-button--primary {
-          color: #2cb7ca;
-          background: none;
+          color: #fff;
+          background: #2cb7ca;
           border-color: #2cb7ca;
           &:hover {
             color: #fff;
             background-color: #2cb7ca;
           }
         }
-        .el-button--default {
-          &:hover,
-          &:active {
-            color: #2cb7ca;
-            border-color: #2cb7ca;
-            background: #eaf8fa;
-          }
+        .el-button--default,
+        .el-button--default:hover,
+        .el-button--default:active {
+          color: #686868;
+          border-color: #E0E0E0;
+          background: #fff;
         }
       }
     }

+ 1 - 0
apps/bigmember_pc/src/components/subscribe-manager/components/List.vue

@@ -226,6 +226,7 @@
       title="删除关键词分类"
       :visible.sync="dialog.notDelClass"
       width="380px"
+      top="20vh"
       center
       :show-close="false"
       v-component-change-mount="{ selector: '.drawer-dialog' }"

+ 16 - 14
apps/bigmember_pc/src/components/subscribe-manager/index.vue

@@ -398,16 +398,16 @@ export default {
       display: flex;
       flex-direction: column;
       align-items: center;
-      padding: 32px 32px 42px;
+      padding: 32px;
       background: #ffffff;
-      border-radius: 6px;
+      border-radius: 8px;
       .delete-class-header {
         font-size: 18px;
         line-height: 28px;
         color: #1d1d1d;
       }
       .delete-class-content {
-        padding: 20px 0 42px;
+        padding: 20px 0 32px;
         color: #686868;
         font-size: 14px;
         line-height: 22px;
@@ -415,27 +415,29 @@ export default {
       .delete-class-footer {
         display: flex;
         align-items: center;
+        justify-content: space-between;
+        width: 100%;
         .confirm,
         .cancel {
-          padding: 10px 50px;
-          margin: 0 20px;
+          padding: 9px 50px;
+          font-size: 16px;
+          border-radius: 6px;
         }
         .el-button--primary {
-          color: #2cb7ca;
-          background: none;
+          color: #fff;
+          background: #2cb7ca;
           border-color: #2cb7ca;
           &:hover {
             color: #fff;
             background-color: #2cb7ca;
           }
         }
-        .el-button--default {
-          &:hover,
-          &:active {
-            color: #2cb7ca;
-            border-color: #2cb7ca;
-            background: #eaf8fa;
-          }
+        .el-button--default,
+        .el-button--default:hover,
+        .el-button--default:active {
+          color: #686868;
+          border-color: #E0E0E0;
+          background: #fff;
         }
       }
     }

+ 2 - 2
apps/bigmember_pc/src/utils/mixins/subscribe-setting-prompt.js

@@ -51,7 +51,7 @@ export const mixinNoOpenSetMessage = {
         const h = this.$createElement
         return await MessageBox({
           title: '开启订阅',
-          customClass: 'custom-message-box',
+          customClass: 'custom-alert-box',
           confirmButtonText: '立即开启',
           confirmButtonClass: 'custom-confirm-btn',
           cancelButtonText: '暂不开启',
@@ -85,7 +85,7 @@ export const mixinNoOpenSetMessage = {
       const h = this.$createElement
       return await MessageBox({
         title: '确定关闭订阅?',
-        customClass: 'custom-message-box',
+        customClass: 'custom-alert-box',
         confirmButtonText: '确定',
         confirmButtonClass: 'custom-confirm-btn',
         cancelButtonText: '取消',

+ 18 - 16
apps/bigmember_pc/src/views/subscribe/components/key/List.vue

@@ -180,7 +180,7 @@
       :close-on-click-modal="false"
       :show-close="false"
       center
-      top="30vh"
+      top="36vh"
       width="380px"
       v-if="dialog.delClass"
     >
@@ -206,7 +206,7 @@
       :visible.sync="dialog.delKey"
       :close-on-click-modal="false"
       :show-close="false"
-      top="30vh"
+      top="36vh"
       center
       width="380px"
       v-if="dialog.delKey"
@@ -660,16 +660,16 @@ export default {
     display: flex;
     flex-direction: column;
     align-items: center;
-    padding: 32px 32px 42px;
+    padding: 32px;
     background: #ffffff;
-    border-radius: 6px;
+    border-radius: 8px;
     .delete-class-header {
       font-size: 18px;
       line-height: 28px;
       color: #1d1d1d;
     }
     .delete-class-content {
-      padding: 20px 0 42px;
+      padding: 20px 0 32px;
       color: #686868;
       font-size: 14px;
       line-height: 22px;
@@ -677,28 +677,30 @@ export default {
     .delete-class-footer {
       display: flex;
       align-items: center;
+      justify-content: space-between;
+      width: 100%;
       .confirm,
       .cancel {
-        padding: 10px 50px;
-        margin: 0 20px;
+        padding: 9px 50px;
+        border-radius: 6px;
+        font-size: 16px;
       }
       ::v-deep {
         .el-button--primary {
-          color: #2cb7ca;
-          background: none;
+          color: #fff;
+          background: #2cb7ca;
           border-color: #2cb7ca;
           &:hover {
             color: #fff;
             background-color: #2cb7ca;
           }
         }
-        .el-button--default {
-          &:hover,
-          &:active {
-            color: #2cb7ca;
-            border-color: #2cb7ca;
-            background: #eaf8fa;
-          }
+        .el-button--default,
+        .el-button--default:hover,
+        .el-button--default:active {
+          color: #686868;
+          border-color: #E0E0E0;
+          background: #fff;
         }
       }
     }

+ 16 - 14
apps/bigmember_pc/src/views/subscribe/components/scope/List.vue

@@ -370,16 +370,16 @@ export default {
     display: flex;
     flex-direction: column;
     align-items: center;
-    padding: 32px 32px 42px;
+    padding: 32px;
     background: #ffffff;
-    border-radius: 6px;
+    border-radius: 8px;
     .delete-class-header {
       font-size: 18px;
       line-height: 28px;
       color: #1d1d1d;
     }
     .delete-class-content {
-      padding: 20px 0 42px;
+      padding: 20px 0 32px;
       color: #686868;
       font-size: 14px;
       line-height: 22px;
@@ -387,28 +387,30 @@ export default {
     .delete-class-footer {
       display: flex;
       align-items: center;
+      justify-content: space-between;
+      width: 100%;
       .confirm,
       .cancel {
-        padding: 10px 50px;
-        margin: 0 20px;
+        padding: 9px 50px;
+        border-radius: 6px;
+        font-size: 16px;
       }
       ::v-deep {
         .el-button--primary {
-          color: #2cb7ca;
-          background: none;
+          color: #fff;
+          background: #2cb7ca;
           border-color: #2cb7ca;
           &:hover {
             color: #fff;
             background-color: #2cb7ca;
           }
         }
-        .el-button--default {
-          &:hover,
-          &:active {
-            color: #2cb7ca;
-            border-color: #2cb7ca;
-            background: #eaf8fa;
-          }
+        .el-button--default,
+        .el-button--default:hover,
+        .el-button--default:active {
+          color: #686868;
+          border-color: #E0E0E0;
+          background: #fff;
         }
       }
     }

+ 33 - 14
packages/work-bench-frame/packages/layout/work-bench/index.vue

@@ -151,7 +151,8 @@ export default {
   @extend .content-shadow;
 }
 
-.custom-message-box {
+.custom-message-box,
+.custom-alert-box {
   width: 380px !important;
   border-radius: 8px;
 
@@ -165,19 +166,6 @@ export default {
     font-size: 16px;
   }
 
-  .custom-default-btn,
-  .custom-default-btn:hover,
-  .custom-default-btn:focus{
-    width: 132px;
-    height: 36px;
-    margin-right: 52px;
-    border-radius: 6px;
-    background-color: #fff;
-    border: 1px solid #DCDFE6;
-    color: #686868;
-    font-size: 16px;
-  }
-
   .el-message-box__message {
     font-size: 14px;
     color: #686868;
@@ -194,4 +182,35 @@ export default {
     content: '';
   }
 }
+.custom-alert-box {
+   padding-bottom: 32px!important;
+  .el-message-box__header{
+    padding-top: 32px!important;
+  }
+  .el-message-box__title{
+    line-height: 28px;
+  }
+  .el-message-box__btns{
+    display: flex;
+    align-items: center;
+    flex-direction: row-reverse;
+    justify-content: space-between;
+    padding: 0 32px;
+  }
+  .custom-confirm-btn{
+    margin-left: 0!important;
+  }
+  .custom-default-btn,
+  .custom-default-btn:hover,
+  .custom-default-btn:focus{
+    width: 132px;
+    height: 36px;
+    margin-top: 12px;
+    border-radius: 6px;
+    background-color: #fff;
+    border: 1px solid #DCDFE6;
+    color: #686868;
+    font-size: 16px;
+  }
+}
 </style>