Browse Source

tree selection调整层叠顺序

任一存 3 năm trước cách đây
mục cha
commit
ef1bdcfcc4
1 tập tin đã thay đổi với 13 bổ sung8 xóa
  1. 13 8
      src/views/TreeSelection.vue

+ 13 - 8
src/views/TreeSelection.vue

@@ -224,6 +224,7 @@ export default {
   position: relative;
   width: 100vw;
   height: 100vh;
+  background: white;
   .popup-mask {
     position: absolute;
     left: 0;
@@ -231,7 +232,7 @@ export default {
     right: 0;
     bottom: 0;
     background: rgba(0, 0, 0, 0.2);
-    z-index: 1;
+    z-index: 2;
     .popup {
       box-sizing: border-box;
       position: absolute;
@@ -275,13 +276,16 @@ export default {
     width: 100%;
     height: 100%;
     .title-wrapper {
-      margin-top: 2.14rem;
-      margin-left: auto;
+      position: absolute;
+      top: 2.14rem;
+      left: 50%;
+      transform: translateX(-50%);
       margin-right: auto;
       width: 8.91rem;
       height: 2.34rem;
       border-radius: 0.3rem;
       padding: 0.23rem;
+      z-index: 2;
       .title {
         display: block;
         box-sizing: border-box;
@@ -318,15 +322,15 @@ export default {
       height: 100%;
       width: 18.28rem;
       opacity: 0.1;
-      z-index: -1;
+      z-index: 0;
       &.active {
-        animation: emerge 1s;
+        animation: emerge 1s forwards;
         opacity: 1;
-        z-index: 0;
+        z-index: 1;
       }
       &.initial-active {
         opacity: 1;
-        z-index: 0;
+        z-index: 1;
       }
       .tree {
         position: absolute;
@@ -464,6 +468,7 @@ export default {
     display: flex;
     border-radius: 0.94rem;
     overflow: hidden;
+    z-index: 1;
     button {
       font-size: 0.75rem;
       font-family: Microsoft YaHei;
@@ -489,7 +494,7 @@ export default {
     transform: translateX(-50%) scale(1.3);
   }
   100% {
-    transform: translateX(-50%)
+    transform: translateX(-50%);
   }
 }
 </style>