fix(hub): keep AI coach page within one viewport

Lock page height and scroll summary/chat inside equal panels instead of extending the document.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-07 00:15:40 +08:00
parent ebadcb1119
commit 821e260912
3 changed files with 77 additions and 14 deletions
+73 -11
View File
@@ -3343,33 +3343,85 @@ html[data-theme="light"] button.danger {
border-color: rgba(201, 53, 82, 0.45);
}
/* --- Hub AI 教练 --- */
/* --- Hub AI 教练(整页一屏,内容区内滚动)--- */
body.hub-page-ai {
overflow: hidden;
}
body.hub-page-ai .app-shell {
padding-bottom: 12px;
height: 100dvh;
max-height: 100dvh;
overflow: hidden;
display: flex;
flex-direction: column;
box-sizing: border-box;
}
body.hub-page-ai .app-header {
flex-shrink: 0;
margin-bottom: 4px;
}
body.hub-page-ai #page-ai {
flex: 1 1 auto;
min-height: 0;
display: flex;
flex-direction: column;
overflow: hidden;
}
#page-ai .page-head {
margin-bottom: 12px;
flex-shrink: 0;
margin: 8px 0 10px;
}
#page-ai .page-head h1 {
margin-bottom: 4px;
font-size: 18px;
}
#page-ai .page-desc {
margin: 0;
font-size: 0.78rem;
line-height: 1.35;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.ai-layout {
flex: 1 1 auto;
min-height: 0;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
grid-template-rows: minmax(0, 1fr);
gap: 12px;
align-items: stretch;
min-height: calc(100vh - 168px);
overflow: hidden;
}
@media (max-width: 960px) {
body.hub-page-ai .app-shell {
height: auto;
max-height: none;
overflow: visible;
}
body.hub-page-ai {
overflow: auto;
}
body.hub-page-ai #page-ai {
overflow: visible;
}
.ai-layout {
grid-template-columns: 1fr;
min-height: 0;
grid-template-rows: minmax(280px, 42vh) minmax(280px, 42vh);
overflow: visible;
}
}
.ai-panel {
background: var(--panel);
border: 1px solid var(--border-soft);
border-radius: var(--radius);
padding: 14px 16px;
padding: 12px 14px;
min-height: 0;
max-height: 100%;
height: 100%;
display: flex;
flex-direction: column;
gap: 12px;
gap: 10px;
overflow: hidden;
}
.ai-panel-head {
@@ -3404,8 +3456,18 @@ html[data-theme="light"] button.danger {
.ai-panel-scroll {
flex: 1 1 auto;
min-height: 0;
overflow: auto;
max-height: 100%;
overflow-x: hidden;
overflow-y: auto;
overscroll-behavior: contain;
scrollbar-gutter: stable;
}
.ai-panel-scroll::-webkit-scrollbar {
width: 6px;
}
.ai-panel-scroll::-webkit-scrollbar-thumb {
background: color-mix(in srgb, var(--muted) 45%, transparent);
border-radius: 999px;
}
.ai-stats-row {
display: flex;
@@ -3533,9 +3595,9 @@ html[data-theme="light"] button.danger {
}
.ai-chat-form textarea {
width: 100%;
resize: vertical;
min-height: 72px;
max-height: 160px;
resize: none;
min-height: 52px;
max-height: 88px;
padding: 10px 12px;
border-radius: 8px;
border: 1px solid var(--border-soft);