mirror of
https://github.com/AIDotNet/AntSK.git
synced 2026-02-17 14:06:11 +08:00
调整聊天气泡尾部样式以优化外观
修改了`.chat-bubble.received::after`和`.chat-bubble.sent::after`伪元素的定位方式,将`bottom`替换为`top`,并调整了宽度从`16px`到`18px`。更新了`clip-path`属性以改进尾部形状,同时调整了`left`和`right`的偏移值以优化位置。
This commit is contained in:
@@ -37,7 +37,7 @@
|
||||
<GridCol Span="10">
|
||||
<Card Style="height: 75vh;overflow: auto;">
|
||||
<TitleTemplate>
|
||||
<Icon Type="search" /> 调试结果
|
||||
<Icon Type="search" /> 知识溯源
|
||||
</TitleTemplate>
|
||||
<Extra>
|
||||
|
||||
|
||||
@@ -242,8 +242,9 @@
|
||||
.chat-bubble.sent::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 16px;
|
||||
width: 16px;
|
||||
top: 16px;
|
||||
bottom: auto;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
transform: none;
|
||||
border-radius: 0;
|
||||
@@ -252,15 +253,15 @@
|
||||
}
|
||||
|
||||
.chat-bubble.received::after {
|
||||
left: -12px;
|
||||
left: -14px;
|
||||
background: var(--bubble-recv);
|
||||
clip-path: polygon(100% 0, 0 50%, 100% 100%);
|
||||
clip-path: polygon(100% 0, 0 0, 100% 100%);
|
||||
}
|
||||
|
||||
.chat-bubble.sent::after {
|
||||
right: -12px;
|
||||
right: -14px;
|
||||
background: var(--bubble-sent);
|
||||
clip-path: polygon(0 0, 100% 50%, 0 100%);
|
||||
clip-path: polygon(0 0, 100% 0, 0 100%);
|
||||
}
|
||||
|
||||
.message-meta {
|
||||
|
||||
Reference in New Issue
Block a user