feat: PlanEdit 移动端适配 (单列堆叠/label 上对齐/按钮全宽)
This commit is contained in:
@@ -208,4 +208,58 @@ onMounted(() => {
|
|||||||
display: flex;
|
display: flex;
|
||||||
gap: 12px;
|
gap: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* ========================================
|
||||||
|
移动端适配 (≤768px)
|
||||||
|
- 卡片 padding 收窄
|
||||||
|
- 两列改单列堆叠
|
||||||
|
- label 上方对齐
|
||||||
|
- 底部按钮垂直堆叠 + 全宽
|
||||||
|
======================================== */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.manager-plan-edit { padding: 12px !important; border-radius: 4px !important; }
|
||||||
|
.breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; }
|
||||||
|
|
||||||
|
/* el-form label 上方对齐 */
|
||||||
|
.plan-form :deep(.el-form-item) {
|
||||||
|
display: block !important;
|
||||||
|
margin-bottom: 12px !important;
|
||||||
|
}
|
||||||
|
.plan-form :deep(.el-form-item__label) {
|
||||||
|
float: none !important;
|
||||||
|
width: auto !important;
|
||||||
|
text-align: left !important;
|
||||||
|
padding: 0 0 4px !important;
|
||||||
|
font-size: 13px !important;
|
||||||
|
color: var(--el-text-color-secondary) !important;
|
||||||
|
line-height: 1.5 !important;
|
||||||
|
}
|
||||||
|
.plan-form :deep(.el-form-item__content) {
|
||||||
|
margin-left: 0 !important;
|
||||||
|
line-height: 1.6 !important;
|
||||||
|
}
|
||||||
|
.plan-form :deep(.el-row) { margin: 0 !important; }
|
||||||
|
.plan-form :deep(.el-col) { padding: 0 !important; margin-bottom: 0 !important; }
|
||||||
|
/* 强制单列 (覆盖 span="12") */
|
||||||
|
.plan-form :deep(.el-col) { max-width: 100% !important; flex: 0 0 100% !important; }
|
||||||
|
|
||||||
|
/* el-input / el-select / el-textarea 全宽 */
|
||||||
|
.plan-form :deep(.el-input),
|
||||||
|
.plan-form :deep(.el-select),
|
||||||
|
.plan-form :deep(.el-textarea) { width: 100% !important; }
|
||||||
|
|
||||||
|
/* el-textarea 移动端默认行高 */
|
||||||
|
.plan-form :deep(.el-textarea__inner) { font-size: 14px !important; min-height: 80px !important; }
|
||||||
|
|
||||||
|
/* 底部按钮: 垂直堆叠 + 全宽 */
|
||||||
|
.form-actions {
|
||||||
|
margin-top: 16px !important;
|
||||||
|
padding-top: 16px !important;
|
||||||
|
}
|
||||||
|
.form-actions :deep(.el-form-item__content) {
|
||||||
|
flex-direction: column !important;
|
||||||
|
gap: 8px !important;
|
||||||
|
}
|
||||||
|
.form-actions :deep(.el-button) { width: 100% !important; }
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user