@fonixtree/magic-design 2.0.53 → 2.0.54

package/lib/core/Designer/ViewArea/index.less

@@ -0,0 +1,89 @@
+.design-area-wrap {
+  width: calc(100vw - 354px);
+  flex: auto;
+  background: #F5F6F7;
+  display: flex;
+  flex-direction: column;
+  padding-left: 1px;
+  transition-property: all;
+  transition-duration: .3s;
+  transition-timing-function: ease;
+
+  .appointment_wrap {
+    flex-shrink: 0;
+    height: 44px;
+    background-color: #FFF8F0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    .appointment_tip {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 13px;
+      color: #FF8541;
+    }
+
+    .cancel_btn {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 13px;
+      margin-left: 10px;
+      display: flex;
+      align-items: center;
+      padding: 0 12px;
+      height: 22px;
+      background-color: #2F54EB;
+      border-radius: 4px;
+      color: #FFF;
+      cursor: pointer;
+    }
+  }
+
+  &.phone-edit {
+    margin-left: 355px;
+  }
+
+  .phone_view_area {
+    flex-grow: 1;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 24px 0;
+
+    .device_border {
+      width: 375px;
+      max-height: 691px;
+      height: calc(100vh - 150px);
+      overflow: scroll;
+      overflow-x: hidden;
+      border: 10px solid #FFF;
+      background-color: #F2F2F2;
+      border-radius: 12px;
+      box-sizing: content-box;
+
+    }
+  }
+
+  .pc_view_area {
+    flex-grow: 1;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 24px;
+
+    .device_border {
+      width: 100%;
+      padding: 1px;
+      min-height: 70vh;
+      border: 16px solid #FFF;
+      border-radius: 12px;
+      max-height: calc(100vh - 180px);
+      height: 100%;
+      overflow: scroll;
+      box-sizing: content-box;
+    }
+  }
+}