@zhangqingcq/vgce/src/assets/base.less

Vector graphics configure editor. svg组态编辑器。基于vue3.3+ts+element-plus+vite

@import '@/assets/variables';

*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	font-weight: normal;
}

body {
	font-family:
		Inter,
		-apple-system,
		BlinkMacSystemFont,
		'Segoe UI',
		Roboto,
		Oxygen,
		Ubuntu,
		Cantarell,
		'Fira Sans',
		'Droid Sans',
		'Helvetica Neue',
		sans-serif;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.modal-full {
	.el-dialog__body {
		padding: 0 !important;
	}
}

.bt-Icon {
	cursor: pointer;

	&:hover {
		opacity: 0.85;
		background-color: #e8f9ff;
	}

	&.active {
		background-color: #deffe4;
	}
}

.icon-out {
	fill: @iconOutColor;
}

.icon-in {
	fill: @iconInColor;
}

.icon-middle {
	fill: @iconMiddleColor;
}

.gray {
	.icon-out {
		fill: #666;
	}

	.icon-in {
		fill: #aaa;
	}

	.icon-middle {
		fill: #777;
	}
}

.active {
	.icon-out {
		fill: @activeIconOut;
	}

	.icon-in {
		fill: @activeIconIn;
	}

	.icon-middle {
		fill: @activeIconMiddle;
	}
}

.icon-disable {
	cursor: not-allowed;
}

.props-row {
	margin-bottom: 0 !important;

	.el-form-item__content,
	.el-form-item__label {
		color: #aaa;
	}
}

.foreignObject {
	> span {
		/*解决span标签显示不完整的问题*/
		position: relative;
		bottom: 2px;
	}
}

.tree-v {
	--el-color-primary-light-9: @listActiveColor;

	&.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
		color: #fff;
	}
}

.coverLayer {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
}

.can-not-select {
	user-select: none;
}

.canvasInfoTxt {
	color: #bbb;
	position: absolute;
	left: 20px;
	bottom: 10px;
	font-size: 12px;

	.icoP {
		margin-left: 10px;
		position: relative;
		top: 2px;
		cursor: pointer;

		&:hover {
			color: @activeIconOut;
		}
	}
}