mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-06 08:06:43 +08:00
feat: 优化消息列表样式,增加内容存在时的底部填充,改善滚动体验
This commit is contained in:
@@ -992,6 +992,7 @@ onScopeDispose(() => {
|
|||||||
ref="messageListRef"
|
ref="messageListRef"
|
||||||
tag="main"
|
tag="main"
|
||||||
class="agent-assistant-messages"
|
class="agent-assistant-messages"
|
||||||
|
:class="{ 'agent-assistant-messages--has-content': hasMessages }"
|
||||||
:options="{ wheelPropagation: false }"
|
:options="{ wheelPropagation: false }"
|
||||||
>
|
>
|
||||||
<div v-if="!hasMessages" class="agent-assistant-empty">
|
<div v-if="!hasMessages" class="agent-assistant-empty">
|
||||||
@@ -1428,14 +1429,25 @@ onScopeDispose(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.agent-assistant-messages {
|
.agent-assistant-messages {
|
||||||
|
box-sizing: border-box;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
min-block-size: 0;
|
min-block-size: 0;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
overscroll-behavior: contain;
|
overscroll-behavior: contain;
|
||||||
padding-block: 1rem calc(env(safe-area-inset-bottom, 0px) + 6rem);
|
padding-block: 1rem;
|
||||||
padding-inline: 1rem;
|
padding-inline: 1rem;
|
||||||
scrollbar-width: thin;
|
scrollbar-width: thin;
|
||||||
|
|
||||||
|
:deep(.ps__rail-x),
|
||||||
|
:deep(.ps__rail-y) {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 只有消息态预留输入框空间,避免 iOS 空态被 padding 撑出不可滚动的滚动条。 */
|
||||||
|
.agent-assistant-messages--has-content {
|
||||||
|
padding-block-end: calc(env(safe-area-inset-bottom, 0px) + 6rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
.agent-assistant-empty {
|
.agent-assistant-empty {
|
||||||
@@ -1977,10 +1989,14 @@ onScopeDispose(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.agent-assistant-messages {
|
.agent-assistant-messages {
|
||||||
padding-block: 0.85rem calc(env(safe-area-inset-bottom, 0px) + 11.8rem);
|
padding-block: 0.85rem;
|
||||||
padding-inline: 0.85rem;
|
padding-inline: 0.85rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.agent-assistant-messages--has-content {
|
||||||
|
padding-block-end: calc(env(safe-area-inset-bottom, 0px) + 11.8rem);
|
||||||
|
}
|
||||||
|
|
||||||
.agent-assistant-composer {
|
.agent-assistant-composer {
|
||||||
inset-block-end: calc(env(safe-area-inset-bottom, 0px) + 0.7rem);
|
inset-block-end: calc(env(safe-area-inset-bottom, 0px) + 0.7rem);
|
||||||
inset-inline: 0.85rem;
|
inset-inline: 0.85rem;
|
||||||
|
|||||||
Reference in New Issue
Block a user