bpmn-editor.less

@import "bpmn-js-properties-panel/styles/properties";
@import (less) "diagram-js/assets/diagram-js.css";


.bpmn-editor {
  .flex-container(row);

  .warnings-overlay;

  flex-grow: 1;

  overflow: hidden;

  > .editor-container {
    flex: 1;

    position: relative;
    outline: none;

    > .editor-parent {

      > div {
        .full-size();
      }
    }
  }

  > .properties {
    flex: initial;
    .flex-container(row);

    position: relative;
    outline: none;

    background: #f8f8f8;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);

    .toggle {
      position: absolute;
      left: -74px;
      top: 40%;
      background: #f8f8f8;
      padding: 7px 10px;

      transform: rotate(-90deg);
      white-space: nowrap;
      font-size: 13px;

      border: solid 1px #CCC;
      border-bottom: none;
      border-radius: 2px 2px 0 0;
    }

    .properties-container {
      flex: 1;
      position: relative;

      border-left: solid 1px #CCC;
    }

    .properties-parent {
      .full-size();

      overflow-y: auto;
    }
  }
}