统一背景色

This commit is contained in:
caixiaofeng 2024-05-21 19:57:55 +08:00
parent be7f45ff0a
commit d11704b723
3 changed files with 11 additions and 8 deletions

View File

@ -19,10 +19,12 @@ const props = withDefaults(
fields: Field[] fields: Field[]
readOnly?: boolean readOnly?: boolean
defaultZoom?: number defaultZoom?: number
bgColor?: string
}>(), }>(),
{ {
readOnly: false, readOnly: false,
defaultZoom: 100 defaultZoom: 100,
bgColor: 'var(--el-bg-color-page)'
} }
) )
@ -307,13 +309,14 @@ defineExpose({
<style scoped lang="scss"> <style scoped lang="scss">
.designer-container { .designer-container {
--flow-bg-color: v-bind(bgColor);
position: relative; position: relative;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
min-height: 100%; min-height: 100%;
min-width: 100%; min-width: 100%;
overflow: auto; overflow: auto;
background-color: var(--el-bg-color-page); background-color: var(--flow-bg-color);
.zoom { .zoom {
position: fixed; position: fixed;

View File

@ -86,7 +86,7 @@ const moveLeft = (index: number) => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
background-color: var(--el-bg-color-page); background-color: var(--flow-bg-color);
&:before { &:before {
content: ''; content: '';
@ -107,7 +107,7 @@ const moveLeft = (index: number) => {
top: -3px; top: -3px;
height: 3px; height: 3px;
width: 50%; width: 50%;
background-color: var(--el-bg-color-page); background-color: var(--flow-bg-color);
} }
.bottom-left-border { .bottom-left-border {
@ -116,7 +116,7 @@ const moveLeft = (index: number) => {
bottom: -3px; bottom: -3px;
height: 3px; height: 3px;
width: 50%; width: 50%;
background-color: var(--el-bg-color-page); background-color: var(--flow-bg-color);
} }
.top-right-border { .top-right-border {
@ -125,7 +125,7 @@ const moveLeft = (index: number) => {
top: -3px; top: -3px;
height: 3px; height: 3px;
width: 50%; width: 50%;
background-color: var(--el-bg-color-page); background-color: var(--flow-bg-color);
} }
.bottom-right-border { .bottom-right-border {
@ -134,7 +134,7 @@ const moveLeft = (index: number) => {
bottom: -3px; bottom: -3px;
height: 3px; height: 3px;
width: 50%; width: 50%;
background-color: var(--el-bg-color-page); background-color: var(--flow-bg-color);
} }
} }
} }

View File

@ -150,7 +150,7 @@ const delNode = () => {
width: 0; width: 0;
border-width: 8px 6px 4px; border-width: 8px 6px 4px;
border-color: var(--el-border-color) transparent transparent; border-color: var(--el-border-color) transparent transparent;
background-color: var(--el-bg-color-page); background-color: var(--flow-bg-color);
} }
.warn-icon { .warn-icon {