落丝记录页面文字统一为黑色加粗
- 页面根元素与编辑对话框设置 color:#000、font-weight:700, 并覆盖 Element Plus 的文本色变量(表格、输入框、表单标签) - 按钮等自带底色的控件沿用各自颜色变量,不会被黑字压暗 - 对话框会挂到 body 下,单独加了类名以保证样式生效
This commit is contained in:
@@ -135,7 +135,7 @@ onMounted(() => { load(); loadDepts(); loadZhuangkou(); loadGuige(); });
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<el-card shadow="never" class="lsjl-page">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span>落丝记录</span>
|
||||
@@ -182,7 +182,7 @@ onMounted(() => { load(); loadDepts(); loadZhuangkou(); loadGuige(); });
|
||||
|
||||
<!-- 对话框适当加宽、标签宽度收紧:车台那一行是三列布局,
|
||||
原尺寸下数字输入框太窄,框内数字与加减按钮会挤在一起 -->
|
||||
<el-dialog v-model="dialogVisible" :title="dialogTitle" width="720px">
|
||||
<el-dialog v-model="dialogVisible" :title="dialogTitle" width="720px" class="lsjl-dialog">
|
||||
<el-form :model="form" label-width="82px">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="12">
|
||||
@@ -287,4 +287,19 @@ onMounted(() => { load(); loadDepts(); loadZhuangkou(); loadGuige(); });
|
||||
.card-header { display: flex; justify-content: space-between; align-items: center; }
|
||||
.search-bar { display: flex; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
|
||||
.pagination { margin-top: 16px; justify-content: flex-end; }
|
||||
|
||||
/* 需求:本页文字统一为黑色加粗。
|
||||
做法是在容器上设置颜色与字重,由页面内的文字继承;
|
||||
按钮等自带底色的控件使用各自的颜色变量,不会被黑字压暗。
|
||||
Element Plus 的表格、输入框、标签各自读取独立的文本色变量,一并覆盖。 */
|
||||
.lsjl-page,
|
||||
.lsjl-dialog {
|
||||
color: #000;
|
||||
font-weight: 700;
|
||||
--el-text-color-primary: #000;
|
||||
--el-text-color-regular: #000;
|
||||
--el-input-text-color: #000;
|
||||
--el-table-text-color: #000;
|
||||
--el-table-header-text-color: #000;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user