mirror of
https://github.com/discourse/discourse.git
synced 2024-11-27 00:13:37 +08:00
720cf24659
When hovering the chat message actions we are technically not hovering the message anymore, which was removing the background and is slightly unexpected. This commit ensures we keep this background until closing the message actions.
135 lines
2.4 KiB
SCSS
135 lines
2.4 KiB
SCSS
.user-card,
|
|
.group-card {
|
|
z-index: z("usercard") + 1; // bump up user card
|
|
}
|
|
|
|
.full-page-chat {
|
|
&.teams-sidebar-on {
|
|
grid-template-columns: 1fr;
|
|
|
|
.chat-live-pane {
|
|
border-radius: var(--full-page-border-radius);
|
|
}
|
|
}
|
|
|
|
.chat-full-page-header {
|
|
padding: 0 1rem;
|
|
height: var(--chat-header-offset);
|
|
min-height: var(--chat-header-offset);
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.chat-live-pane {
|
|
.chat-messages-container {
|
|
.chat-message {
|
|
&.is-reply {
|
|
grid-template-columns: var(--message-left-width) 1fr;
|
|
}
|
|
|
|
.chat-user {
|
|
width: var(--message-left-width);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.chat-message:not(.user-info-hidden) {
|
|
padding: 0.65em 1em 0.15em;
|
|
}
|
|
|
|
.chat-message-text {
|
|
img:not(.emoji):not(.avatar, .onebox-avatar-inline) {
|
|
transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
|
|
|
|
&:hover {
|
|
cursor: pointer;
|
|
border-radius: 5px;
|
|
box-shadow: 0 2px 5px 0 rgba(var(--always-black-rgb), 0.1),
|
|
0 2px 10px 0 rgba(var(--always-black-rgb), 0.1);
|
|
}
|
|
}
|
|
}
|
|
|
|
.chat-message.user-info-hidden {
|
|
padding: 0.15em 1em;
|
|
|
|
.chat-time {
|
|
color: var(--secondary-medium);
|
|
flex-shrink: 0;
|
|
font-size: var(--font-down-2);
|
|
margin-top: 0.4em;
|
|
display: none;
|
|
width: var(--message-left-width);
|
|
}
|
|
|
|
&:hover {
|
|
.chat-message-left-gutter__bookmark {
|
|
display: none;
|
|
}
|
|
|
|
.chat-time {
|
|
display: block;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Full Page Styling in Core
|
|
.has-full-page-chat:not(.discourse-sidebar) {
|
|
--max-chat-width: 1200px;
|
|
|
|
#main-outlet {
|
|
max-width: var(--max-chat-width);
|
|
padding: 0;
|
|
}
|
|
|
|
.full-page-chat {
|
|
border-right: 1px solid var(--primary-low);
|
|
border-left: 1px solid var(--primary-low);
|
|
|
|
.chat-live-pane {
|
|
border-radius: unset;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: var(--max-chat-width)) {
|
|
#main-outlet {
|
|
max-width: 100%;
|
|
padding: 0;
|
|
}
|
|
|
|
.full-page-chat {
|
|
border: none;
|
|
grid-template-columns: 250px 1fr;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Full page styling with sidebar enabled
|
|
.discourse-sidebar.has-full-page-chat {
|
|
#main-outlet {
|
|
padding: 2em 0 0 0;
|
|
}
|
|
|
|
.full-page-chat.teams-sidebar-on {
|
|
.chat-live-pane {
|
|
border-radius: 0;
|
|
}
|
|
|
|
.chat-message {
|
|
padding-left: 1em;
|
|
}
|
|
|
|
.chat-messages-container .chat-message-deleted {
|
|
padding: 0.25em 1em;
|
|
}
|
|
}
|
|
}
|
|
|
|
.chat-form {
|
|
&__description.-autojoin,
|
|
&__description.-channel-wide-mentions {
|
|
max-width: 50%;
|
|
}
|
|
}
|