@javaguns/flow-ui
Version:
``` <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
58 lines (57 loc) • 1.25 kB
CSS
.flow-zoom-wrap {
position: fixed;
top: 20px;
right: 20px;
flex-direction: row-reverse;
flex-wrap: wrap;
z-index: 8;
}
.flow-zoom-wrap .flow-zoom-container {
display: flex;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
height: 30px;
z-index: 999;
}
.flow-zoom-wrap .flow-zoom-container span {
font-size: 14px;
width: 60px;
height: 30px;
line-height: 30px;
text-align: center;
background: #fff;
border-color: #d9d9d9;
border-width: 1px 0;
border-style: solid;
}
.flow-zoom-wrap .flow-zoom-container .flow-zoom-less,
.flow-zoom-wrap .flow-zoom-container .flow-zoom-more {
width: 30px;
height: 30px;
border: 1px solid #d9d9d9;
cursor: pointer;
background-color: #fff;
background-size: 30px 30px;
background-repeat: no-repeat;
position: relative;
}
.flow-zoom-wrap .flow-zoom-container .flow-zoom-less::before,
.flow-zoom-wrap .flow-zoom-container .flow-zoom-more::before {
content: '';
position: absolute;
top: 14px;
left: 9px;
width: 11px;
height: 1px;
background: #008dff;
}
.flow-zoom-wrap .flow-zoom-container .flow-zoom-more::after {
content: '';
position: absolute;
top: 9px;
left: 14px;
width: 1px;
height: 11px;
background: #008dff;
}