🐛 fix: 修正增加连接桩导致的渲染错误

arvinxx · Mar 19, 2021 · 4dd098e · 4dd098e
1 parent 7a3c171
commit 4dd098e
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 28 deletions.
diff --git a/packages/mindflow/src/components/CollapseIcon/style.less b/packages/mindflow/src/components/CollapseIcon/style.less
@@ -4,13 +4,14 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 20px;
-  height: 20px;
+  width: 18px;
+  height: 18px;
   border: 1px solid transparent;
   border-radius: 20px;
   cursor: pointer;
+  transition: all 150ms ease-in-out;
 
   &-icon {
-    font-size: 13px;
+    font-size: 12px;
   }
 }
diff --git a/packages/mindflow/src/components/MindNode/style.less b/packages/mindflow/src/components/MindNode/style.less
@@ -6,7 +6,6 @@
 
 .mind-node {
   &-container {
-    position: relative;
     padding: 8px;
     padding-left: 4px;
     border: 1px solid transparent;
@@ -84,7 +83,7 @@
   }
 
   &-edit {
-    position: absolute;
+    position: fixed;
     top: 10px;
     right: 16px;
     display: flex;

diff --git a/packages/mindflow/src/components/Port/style.less b/packages/mindflow/src/components/Port/style.less
@@ -1,27 +1,12 @@
-.center {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
 .mind-port-in-port {
-  //.center;
-  //width: 12px;
-  //height: 12px;
-
   width: 100%;
   height: 100%;
   background: #fff;
   border: 2px solid transparent;
   border-radius: 100%;
 }
-.mind-port-out-port {
-  .center;
-
-  width: 20px;
-  height: 20px;
-}
 
-.x6-node [magnet='true']:hover {
-  opacity: 1;
+.mind-port-out-port {
+  width: 18px;
+  height: 18px;
 }
diff --git a/packages/mindflow/src/definition/node.ts b/packages/mindflow/src/definition/node.ts
@@ -35,19 +35,20 @@ export const defaultNode = <T>(node: BaseNode<T>) => {
               magnet: 'true',
             },
           },
+          zIndex: 1,
         },
         out: {
           position: { name: 'right' },
           attrs: {
             fo: {
-              width: 20,
-              height: 20,
-              x: -10,
-              y: -10,
+              width: 18,
+              height: 18,
+              x: -9,
+              y: -9,
               // magnet: 'true',
             },
           },
-          zIndex: 100000,
+          zIndex: 10,
         },
       },
     },