fix: fix Platform BPMN editor styles

camunda · Dec 9, 2021 · 9cf9553 · 9cf9553
1 parent 976402e
commit 9cf9553
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 20 deletions.
diff --git a/client/src/app/tabs/bpmn/BpmnEditor.js b/client/src/app/tabs/bpmn/BpmnEditor.js
@@ -759,18 +759,20 @@ export class BpmnEditor extends CachedComponent {
 
         <Loader hidden={ imported && !importing } />
 
-        <div
-          className="diagram"
-          ref={ this.ref }
-          onFocus={ this.handleChanged }
-          onContextMenu={ this.handleContextMenu }
-        ></div>
-
-        <PropertiesContainer
-          className="properties"
-          layout={ layout }
-          ref={ this.propertiesPanelRef }
-          onLayoutChanged={ onLayoutChanged } />
+        <div className="editor">
+          <div
+            className="diagram"
+            ref={ this.ref }
+            onFocus={ this.handleChanged }
+            onContextMenu={ this.handleContextMenu }
+          ></div>
+
+          <PropertiesContainer
+            className="properties"
+            layout={ layout }
+            ref={ this.propertiesPanelRef }
+            onLayoutChanged={ onLayoutChanged } />
+        </div>
 
         { engineProfile && <EngineProfile
           type="bpmn"

diff --git a/client/src/app/tabs/bpmn/BpmnEditor.less b/client/src/app/tabs/bpmn/BpmnEditor.less
@@ -3,18 +3,21 @@
   flex: 1;
   overflow: hidden;
 
-  flex-direction: row;
+  flex-direction: column;
 
-  .diagram {
+  .editor {
     flex: 1;
-    position: relative;
-  }
 
-  .properties {
-    flex: none;
+    display: flex;
+    flex-direction: row;
 
-    .toggle {
-      top: 350px;
+    .diagram {
+      flex: 1;
+      position: relative;
+    }
+
+    .properties {
+      flex: none;
     }
   }