style(CuteSectionTitle): 调整标题组件样式和布局

This commit is contained in:
2026-01-30 19:09:35 +08:00
parent de83e8a278
commit a8d4340b55
@@ -5,8 +5,8 @@
* @created 2025-08-13 * @created 2025-08-13
--> -->
<template> <template>
<el-row> <el-row style="margin: 10px;" class="container-height">
<el-col :span="12"> <el-col :span="12" class="container-height">
<div class="title-container"> <div class="title-container">
<div class="main-title-line"> <div class="main-title-line">
<i class="el-icon-platform-eleme" style="color: #409EFF;font-size: 18px" /> <i class="el-icon-platform-eleme" style="color: #409EFF;font-size: 18px" />
@@ -16,8 +16,8 @@
<div v-if="thirdTitle" class="third-title-with-text-align">{{ thirdTitle }}</div> <div v-if="thirdTitle" class="third-title-with-text-align">{{ thirdTitle }}</div>
</div> </div>
</el-col> </el-col>
<el-col :span="12" style="text-align: right;line-height: 64px;height: 64px;padding-right: 30px"> <el-col v-if="$slots.operation" :span="12" class="container-height postfix-operation">
<slot /> <slot name="operation" />
</el-col> </el-col>
</el-row> </el-row>
</template> </template>
@@ -58,12 +58,13 @@ export default {
color: #303133; color: #303133;
i:first-child { i:first-child {
margin-right: 8px; // 图标与文字的间距 // 图标与文字的间距
margin-right: 8px;
} }
} }
.sub-title-with-icon-align { .sub-title-with-icon-align {
font-size: 14px; font-size: 13px;
color: #606266; color: #606266;
margin-bottom: 8px; margin-bottom: 8px;
} }
@@ -74,4 +75,15 @@ export default {
margin-left: 26px; margin-left: 26px;
margin-bottom: 0; margin-bottom: 0;
} }
.container-height {
min-height: 27px;
max-height: 27px;
}
.postfix-operation {
text-align: right;
line-height: 27px;
padding-right: 30px;
}
</style> </style>