style(editor): 优化样式配置面板

This commit is contained in:
roymondchen 2025-01-03 17:25:25 +08:00
parent e8bbdf613b
commit 9e35642879
5 changed files with 29 additions and 8 deletions

View File

@ -40,16 +40,16 @@ const list = [
component: Layout,
},
{
title: '文字',
component: Font,
title: '位置',
component: Position,
},
{
title: '背景',
component: Background,
},
{
title: '位置',
component: Position,
title: '文字',
component: Font,
},
{
title: '边框与圆角',

View File

@ -3,7 +3,12 @@
<div v-for="(item, index) in list" :key="index" :class="item.class">
<span class="help-txt" v-if="item.text">{{ item.text }}</span>
<span class="next-input">
<input v-model="model[item.name]" @change="change($event, item.name)" placeholder="0" />
<input
v-model="model[item.name]"
:title="model[item.name]"
@change="change($event, item.name)"
placeholder="0"
/>
</span>
</div>
</div>

View File

@ -2,7 +2,12 @@
<div class="layout-box-container">
<div v-for="(item, index) in list" :key="index" :class="item.class">
<span class="next-input">
<input v-model="model[item.name]" @change="change($event, item.name)" placeholder="0" />
<input
v-model="model[item.name]"
:title="model[item.name]"
@change="change($event, item.name)"
placeholder="0"
/>
</span>
</div>
</div>

View File

@ -4,6 +4,18 @@
.m-fields-style-setter {
width: 100%;
.tmagic-design-collapse-item {
> .el-collapse-item__header {
background-color: #f2f3f7;
height: 36px;
padding: 10px;
}
.el-collapse-item__wrap {
padding: 0 10px;
}
}
}
.text-align-list {

View File

@ -1,8 +1,7 @@
// 盒子模型
.layout-box-container {
position: relative;
margin: 0 0 16px 16px;
width: 270px;
width: 100%;
height: 150px;
.help-txt {