style: 适配各页面弹窗窄屏布局

This commit is contained in:
2026-08-02 11:48:37 +08:00
parent c2493e4c71
commit de45c8039c
4 changed files with 30 additions and 1 deletions
+6 -1
View File
@@ -400,7 +400,7 @@ onMounted(() => {
<!-- 节点选择确认弹窗 -->
<el-dialog v-model="focusConfirmVisible" title="确认复习起点" width="400px">
<p v-if="selectedNodeInfo">
<p v-if="selectedNodeInfo" class="focus-confirm-text">
<strong>{{ selectedNodeInfo.title }}</strong> 为起点
复习该知识点下的 <strong>{{ selectedNodeInfo.childCount }}</strong> 个子知识点
</p>
@@ -618,6 +618,11 @@ onMounted(() => {
font-size: 18px;
}
.focus-confirm-text {
word-break: break-word;
overflow-wrap: anywhere;
}
.surface-card {
padding: 20px 22px;
}
+4
View File
@@ -1145,6 +1145,10 @@ onUnmounted(() => {
.info-grid {
grid-template-columns: 1fr;
}
.summary-toolbar .el-button {
flex: 1;
}
}
/* ---- 历史学习记录 ---- */
+9
View File
@@ -762,6 +762,15 @@ onMounted(() => {
}
@media (max-width: 768px) {
.weight-row {
gap: 8px;
}
.weight-label {
width: 64px;
font-size: 13px;
}
.action-card {
grid-template-columns: 1fr;
}
+11
View File
@@ -193,6 +193,7 @@ onMounted(() => {
v-model="recallCard.visible"
:title="recallCard.group?.taskName || '回忆一下'"
width="560px"
class="recall-card-dialog"
>
<template v-if="recallCard.group">
<p class="recall-question">
@@ -454,4 +455,14 @@ onMounted(() => {
grid-template-columns: 1fr;
}
}
@media (max-width: 768px) {
.recall-card-dialog :deep(.el-dialog__footer) {
flex-direction: column;
}
.recall-card-dialog :deep(.el-dialog__footer .el-button) {
width: 100%;
}
}
</style>