starfish-editor-custom 1.0.42 → 1.0.44

package/src/styles/nav-list.scss

@@ -1,60 +1,60 @@
-.starfish-editor {
-  .nav_list {
-    height: 40px;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    background-color: $editor-nav-background-color;
-    box-sizing: border-box;
-    border-bottom: 2px solid #d8dee8;
-    padding: 0 15px;
-    .detailBtn {
-      span {
-        padding: 0 5px;
-        font-size: 16px;
-        color: #03c0ff;
-      }
-      .noactive {
-        color: #a1a7b0;
-        cursor: no-drop;
-      }
-    }
-    .pageBtn {
-      white-space: nowrap;
-      > div {
-        margin: 0 5px;
-      }
-      .el-button-group {
-        span {
-          margin-right: 12px;
-        }
-        i {
-          font-size: 16px;
-        }
-        .info {
-          color: #03c0ff;
-        }
-      }
-    }
-    :deep(.demo-drawer) {
-      width: 20% !important;
-    }
-  }
-}
-.codeDialog {
-  height: auto;
-  .custom_code {
-    height: 100%;
-    flex: 1;
-    .upload-demo {
-      margin-top: 20px;
-    }
-  }
-}
-.custom-tree-node {
-  display: flex;
-  align-items: center;
-  span:last-child {
-    justify-content: flex-end;
-  }
-}
+.starfish-editor {
+  .nav_list {
+    height: 40px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    background-color: $editor-nav-background-color;
+    box-sizing: border-box;
+    border-bottom: 2px solid #d8dee8;
+    padding: 0 15px;
+    .detailBtn {
+      span {
+        padding: 0 5px;
+        font-size: 16px;
+        color: #03c0ff;
+      }
+      .noactive {
+        color: #a1a7b0;
+        cursor: no-drop;
+      }
+    }
+    .pageBtn {
+      white-space: nowrap;
+      > div {
+        margin: 0 5px;
+      }
+      .el-button-group {
+        span {
+          margin-right: 12px;
+        }
+        i {
+          font-size: 16px;
+        }
+        .info {
+          color: #03c0ff;
+        }
+      }
+    }
+    :deep(.demo-drawer) {
+      width: 20% !important;
+    }
+  }
+}
+.codeDialog {
+  height: auto;
+  .custom_code {
+    height: 100%;
+    flex: 1;
+    .upload-demo {
+      margin-top: 20px;
+    }
+  }
+}
+.custom-tree-node {
+  display: flex;
+  align-items: center;
+  span:last-child {
+    justify-content: flex-end;
+  }
+}

package/src/styles/props-panel.scss

@@ -1,124 +1,124 @@
-.starfish-editor {
-  .editor_pages_right {
-    width: 100%;
-    height: 100%;
-    // position: fixed;
-    // right: 0;
-    background: white;
-    // padding: 30px 0;
-    z-index: 1;
-    position: relative;
-    display: flex;
-    overflow: hidden;
-    .demo-tabs {
-      width: 380px;
-      flex: 1;
-      flex-direction: column;
-      .el-tabs__nav {
-        display: flex;
-        justify-content: space-around;
-        width: 100%;
-      }
-
-      .dynamic {
-        padding-top: 1px;
-        .el-form-item__content {
-          margin-bottom: 16px;
-        }
-      }
-    }
-    .form_tab3 {
-      padding: 5px;
-      .form_tab3_list {
-        margin-bottom: 15px;
-      }
-    }
-    .json {
-      padding: 10px;
-      height: 100%;
-      > div {
-        height: 90%;
-      }
-    }
-    .el-tabs__content {
-      padding: 0;
-      height: 100%;
-      > div {
-        height: 100%;
-      }
-    }
-    &.editor_transition {
-      transition: all 0.5s ease-in-out 0s;
-    }
-    .editor_container {
-      // position: absolute;
-      // left: 0;
-      // top: 0;
-      padding-top: 30px;
-      box-sizing: border-box;
-      height: 100%;
-      border-right: 1px solid $resizer_background_color;
-      margin-right: 5px;
-    }
-    .controlLine {
-      position: absolute;
-      left: 0;
-      height: 100%;
-      width: 5px;
-      background: red;
-      z-index: 2;
-      &:hover {
-        background: $blue;
-        cursor: ew-resize;
-      }
-    }
-    .viewAndJson {
-      display: flex;
-      justify-content: center;
-      justify-items: center;
-      margin: 5px auto;
-      width: 80%;
-      > div {
-        width: 30%;
-        border: 3px solid rgb(121, 118, 118);
-        height: 30px;
-        line-height: 30px;
-        text-align: center;
-        border-radius: 5px;
-        &.active {
-          border-color: $blue;
-          color: $blue;
-        }
-      }
-    }
-    .dynamic {
-      overflow: auto;
-      height: 100%;
-      @include scrollbar();
-    }
-
-    &.editor_pages_right_visible {
-      right: 0;
-    }
-    &.editor_pages_right_hidden {
-      transform: translateX(100%);
-      // right: -100%;
-    }
-    .editor_right_accept {
-      width: 20px;
-      height: 80px;
-      background: #fff;
-      box-shadow: -2px 0 4px 0 rgba(0, 0, 0, 0.1);
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      right: 304px;
-      top: 50%;
-      margin-top: -32px;
-      transform: translateY(-50%);
-      cursor: pointer;
-      position: absolute;
-      left: -28px;
-    }
-  }
-}
+.starfish-editor {
+  .editor_pages_right {
+    width: 100%;
+    height: 100%;
+    // position: fixed;
+    // right: 0;
+    background: white;
+    // padding: 30px 0;
+    z-index: 1;
+    position: relative;
+    display: flex;
+    overflow: hidden;
+    .demo-tabs {
+      width: 380px;
+      flex: 1;
+      flex-direction: column;
+      .el-tabs__nav {
+        display: flex;
+        justify-content: space-around;
+        width: 100%;
+      }
+
+      .dynamic {
+        padding-top: 1px;
+        .el-form-item__content {
+          margin-bottom: 16px;
+        }
+      }
+    }
+    .form_tab3 {
+      padding: 5px;
+      .form_tab3_list {
+        margin-bottom: 15px;
+      }
+    }
+    .json {
+      padding: 10px;
+      height: 100%;
+      > div {
+        height: 90%;
+      }
+    }
+    .el-tabs__content {
+      padding: 0;
+      height: 100%;
+      > div {
+        height: 100%;
+      }
+    }
+    &.editor_transition {
+      transition: all 0.5s ease-in-out 0s;
+    }
+    .editor_container {
+      // position: absolute;
+      // left: 0;
+      // top: 0;
+      padding-top: 30px;
+      box-sizing: border-box;
+      height: 100%;
+      border-right: 1px solid $resizer_background_color;
+      margin-right: 5px;
+    }
+    .controlLine {
+      position: absolute;
+      left: 0;
+      height: 100%;
+      width: 5px;
+      background: red;
+      z-index: 2;
+      &:hover {
+        background: $blue;
+        cursor: ew-resize;
+      }
+    }
+    .viewAndJson {
+      display: flex;
+      justify-content: center;
+      justify-items: center;
+      margin: 5px auto;
+      width: 80%;
+      > div {
+        width: 30%;
+        border: 3px solid rgb(121, 118, 118);
+        height: 30px;
+        line-height: 30px;
+        text-align: center;
+        border-radius: 5px;
+        &.active {
+          border-color: $blue;
+          color: $blue;
+        }
+      }
+    }
+    .dynamic {
+      overflow: auto;
+      height: 100%;
+      @include scrollbar();
+    }
+
+    &.editor_pages_right_visible {
+      right: 0;
+    }
+    &.editor_pages_right_hidden {
+      transform: translateX(100%);
+      // right: -100%;
+    }
+    .editor_right_accept {
+      width: 20px;
+      height: 80px;
+      background: #fff;
+      box-shadow: -2px 0 4px 0 rgba(0, 0, 0, 0.1);
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      right: 304px;
+      top: 50%;
+      margin-top: -32px;
+      transform: translateY(-50%);
+      cursor: pointer;
+      position: absolute;
+      left: -28px;
+    }
+  }
+}

package/src/styles/work-space.scss

@@ -1,129 +1,129 @@
-.starfish-editor {
-  background: #fafafa;
-  .editor_pages_center {
-    position: relative;
-    height: calc(100% - 40px);
-    // overflow-y: auto;
-    outline: 0;
-    .editor_nav {
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      box-shadow: 0 0 10px #ebedf0;
-    }
-    .canvasBox {
-      position: absolute;
-      // left: 16px;
-      left: 50%;
-      transform: translateX(-50%) scale(var(--scale));
-      top: 16px;
-      // right: 16px;
-      bottom: 10px;
-      width: calc(100% - 32px);
-      // margin-left: -350px;
-      background: white;
-      box-shadow: 0 4px 12px #ebedf0;
-      transform-origin: 50% 50%;
-      transition: all 0.2s linear;
-      overflow: hidden;
-      box-sizing: border-box;
-      // &.fullScreenBox {
-      //   width: 100% ;
-      // }
-      &.PC_layout {
-        width: calc(100% - 32px);
-      }
-      &.Pad_layout {
-        width: 70%;
-        border-radius: 15px;
-        // box-shadow: 0 0 1px 10px #495060;
-        border: 10px solid #495060;
-      }
-      &.H5_layout {
-        width: 50%;
-        border-radius: 15px;
-        // box-shadow: 0 0 1px 10px #495060;
-        border: 10px solid #495060;
-      }
-      .draggable_container {
-        width: 100%;
-        height: 100%;
-        // min-height: $editor_canvas_min_height;
-        min-height: 100%;
-        z-index: 1;
-        text-align: left;
-        position: relative;
-        .starfish-formitem {
-          padding-top: 12px;
-        }
-        .dragArea {
-          width: 100%;
-          height: 100%;
-          min-height: 100%;
-          @include scrollbar();
-          overflow-y: auto;
-        }
-        .form-empty {
-          position: absolute;
-          top: 50%;
-          left: 50%;
-          transform: translate(-50%, -50%);
-          text-align: center;
-          font-size: 14px;
-          color: #a3a6ad;
-        }
-      }
-      .grid_controller {
-        position: absolute;
-        top: -30px;
-        left: 50%;
-        transform: translateX(-50%);
-        height: 25px;
-        line-height: 25px;
-        display: flex;
-        background: white;
-        span {
-          font-size: 14px;
-          padding: 0 10px;
-          border: 1px solid #d9d9d9;
-          box-sizing: border-box;
-        }
-        .grid_check {
-          color: #40a9ff;
-          border-color: #40a9ff;
-        }
-        .grid_check_none2 {
-          border-left: transparent;
-        }
-        .grid_check_none1 {
-          border-right: transparent;
-        }
-      }
-    }
-    .editForm {
-      position: absolute;
-      display: flex;
-      flex-direction: column;
-      z-index: 3;
-      user-select: none;
-      background-color: #fff;
-      box-sizing: border-box;
-      box-shadow: 0 10px 20px rgb(0 0 0 / 30%), 0 0 0 1px #eee;
-      padding: 5px 0;
-      min-width: 180px;
-      span {
-        padding: 6px 12px;
-        display: flex;
-        text-align: left;
-        white-space: nowrap;
-        color: #333;
-        position: relative;
-        &:hover {
-          background: #409eff;
-          color: white;
-        }
-      }
-    }
-  }
-}
+.starfish-editor {
+  background: #fafafa;
+  .editor_pages_center {
+    position: relative;
+    height: calc(100% - 40px);
+    // overflow-y: auto;
+    outline: 0;
+    .editor_nav {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      box-shadow: 0 0 10px #ebedf0;
+    }
+    .canvasBox {
+      position: absolute;
+      // left: 16px;
+      left: 50%;
+      transform: translateX(-50%) scale(var(--scale));
+      top: 16px;
+      // right: 16px;
+      bottom: 10px;
+      width: calc(100% - 32px);
+      // margin-left: -350px;
+      background: white;
+      box-shadow: 0 4px 12px #ebedf0;
+      transform-origin: 50% 50%;
+      transition: all 0.2s linear;
+      overflow: hidden;
+      box-sizing: border-box;
+      // &.fullScreenBox {
+      //   width: 100% ;
+      // }
+      &.PC_layout {
+        width: calc(100% - 32px);
+      }
+      &.Pad_layout {
+        width: 70%;
+        border-radius: 15px;
+        // box-shadow: 0 0 1px 10px #495060;
+        border: 10px solid #495060;
+      }
+      &.H5_layout {
+        width: 50%;
+        border-radius: 15px;
+        // box-shadow: 0 0 1px 10px #495060;
+        border: 10px solid #495060;
+      }
+      .draggable_container {
+        width: 100%;
+        height: 100%;
+        // min-height: $editor_canvas_min_height;
+        min-height: 100%;
+        z-index: 1;
+        text-align: left;
+        position: relative;
+        .starfish-formitem {
+          padding-top: 12px;
+        }
+        .dragArea {
+          width: 100%;
+          height: 100%;
+          min-height: 100%;
+          @include scrollbar();
+          overflow-y: auto;
+        }
+        .form-empty {
+          position: absolute;
+          top: 50%;
+          left: 50%;
+          transform: translate(-50%, -50%);
+          text-align: center;
+          font-size: 14px;
+          color: #a3a6ad;
+        }
+      }
+      .grid_controller {
+        position: absolute;
+        top: -30px;
+        left: 50%;
+        transform: translateX(-50%);
+        height: 25px;
+        line-height: 25px;
+        display: flex;
+        background: white;
+        span {
+          font-size: 14px;
+          padding: 0 10px;
+          border: 1px solid #d9d9d9;
+          box-sizing: border-box;
+        }
+        .grid_check {
+          color: #40a9ff;
+          border-color: #40a9ff;
+        }
+        .grid_check_none2 {
+          border-left: transparent;
+        }
+        .grid_check_none1 {
+          border-right: transparent;
+        }
+      }
+    }
+    .editForm {
+      position: absolute;
+      display: flex;
+      flex-direction: column;
+      z-index: 3;
+      user-select: none;
+      background-color: #fff;
+      box-sizing: border-box;
+      box-shadow: 0 10px 20px rgb(0 0 0 / 30%), 0 0 0 1px #eee;
+      padding: 5px 0;
+      min-width: 180px;
+      span {
+        padding: 6px 12px;
+        display: flex;
+        text-align: left;
+        white-space: nowrap;
+        color: #333;
+        position: relative;
+        &:hover {
+          background: #409eff;
+          color: white;
+        }
+      }
+    }
+  }
+}