fix: #2308 improve chat actions

This commit is contained in:
Yidadaa
2023-07-09 16:15:58 +08:00
parent 3432d4df29
commit ca295588c4
6 changed files with 112 additions and 115 deletions

View File

@@ -240,24 +240,39 @@
&:last-child {
animation: slide-in ease 0.3s;
}
&:hover {
.chat-message-actions {
opacity: 1;
transform: translateY(0px);
max-width: 100%;
height: 40px;
}
.chat-message-action-date {
opacity: 0.2;
}
}
}
.chat-message-user {
display: flex;
flex-direction: row-reverse;
.chat-message-header {
flex-direction: row-reverse;
}
}
.chat-message-header {
margin-top: 20px;
display: flex;
align-items: center;
.chat-message-actions {
display: flex;
box-sizing: border-box;
font-size: 12px;
align-items: flex-end;
justify-content: space-between;
transition: all ease 0.3s;
transform: scale(0.9) translateY(5px);
margin: 0 10px;
opacity: 0;
pointer-events: none;
.chat-input-actions {
display: flex;
flex-wrap: nowrap;
}
}
}
.chat-message-container {
@@ -270,6 +285,12 @@
.chat-message-edit {
opacity: 0.9;
}
.chat-message-actions {
opacity: 1;
pointer-events: all;
transform: scale(1) translateY(0);
}
}
}
@@ -278,7 +299,6 @@
}
.chat-message-avatar {
margin-top: 20px;
position: relative;
.chat-message-edit {
@@ -318,27 +338,6 @@
border: var(--border-in-light);
position: relative;
transition: all ease 0.3s;
.chat-message-actions {
display: flex;
box-sizing: border-box;
font-size: 12px;
align-items: flex-end;
justify-content: space-between;
transition: all ease 0.3s 0.15s;
transform: translateX(-5px) scale(0.9) translateY(30px);
opacity: 0;
height: 0;
max-width: 0;
position: absolute;
left: 0;
z-index: 2;
.chat-input-actions {
display: flex;
flex-wrap: nowrap;
}
}
}
.chat-message-action-date {