@javaguns/flow-ui/es/src/flow-designer/style/condition.css

``` <template> <a-spin :spinning="loading"> <FlowDesigner ref="flowDesigner" top="50px"> </FlowDesigner> </a-spin> </template> <script lang="ts" setup> import { ref, provide, onMounted } from 'vue'; import { FlowDesigner, LoadingKey } from '@j

.flow-condition-box {
  max-height: 90%;
}
.flow-condition-box .flow-condition-group {
  /*  background-color: #f2f3f5; */
  padding-bottom: 10px;
  margin-top: 15px;
}
.flow-condition-box .flow-condition-group .flow-condition-item {
  border-radius: 3px;
  display: flex;
  justify-content: flex-start;
  padding: 10px 10px 5px;
}
.flow-condition-box .flow-condition-group .flow-condition-item .flow-condition-option {
  display: flex;
  justify-content: space-around;
  width: 100%;
}
.flow-condition-box .flow-condition-group .flow-condition-item .flow-condition-value {
  /* background: #fff; */
  width: 45%;
  color: #c0c4cc;
  font-size: 13px;
  height: 40px;
  line-height: 40px;
  box-sizing: border-box;
  border-radius: 5px;
  /* border: 1px solid #dcdfe6; */
}
.flow-condition-box .flow-condition-group .flow-condition-item .flow-condition-del {
  width: 31px;
  height: 31px;
  background-color: #fff;
  border-radius: 3px;
  border: 1px solid #dee0e3;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #a3a8af;
  font-size: 16px;
  cursor: pointer;
  flex: 0 0 auto;
}
.flow-condition-box .flow-condition-group .flow-condition-item .flow-condition-del:hover {
  background-color: #dcdcdc;
}
.flow-condition-box .flow-condition-group-connector {
  margin-top: 15px;
  color: #8e8e8e;
  font-size: 14px;
}
.flow-condition-box .flow-condition-add {
  width: 100px;
  height: 34px;
  background-color: #fff;
  border-radius: 3px;
  border: 1px solid #dee0e3;
  color: #8e8e8e;
  text-align: center;
  font-size: 13px;
  cursor: pointer;
  line-height: 34px;
  margin-top: 15px;
  margin-left: 13px;
}
.flow-condition-box .flow-condition-add:hover {
  background-color: #dcdcdc;
}