mirror of
https://github.com/element-hq/element-web.git
synced 2024-12-13 23:29:51 +03:00
ee2ee3c08c
* feat: introduce new alignment types for tooltip * feat: introduce new hook for tooltips * feat: allow using onFocus callback for RovingAccessibleButton * feat: allow using custom class for ContextMenu * feat: allow setting tab index for avatar * refactor: move read receipts out of event tile * feat: implement new read receipt design * feat: update SentReceipt to match new read receipts as well
116 lines
3 KiB
SCSS
116 lines
3 KiB
SCSS
/*
|
|
Copyright 2015, 2016 OpenMarket Ltd
|
|
Copyright 2020 The Matrix.org Foundation C.I.C.
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
you may not use this file except in compliance with the License.
|
|
You may obtain a copy of the License at
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
See the License for the specific language governing permissions and
|
|
limitations under the License.
|
|
*/
|
|
|
|
$left-gutter: 64px;
|
|
|
|
.mx_GroupLayout {
|
|
.mx_EventTile {
|
|
> .mx_DisambiguatedProfile {
|
|
line-height: $font-20px;
|
|
margin-left: $left-gutter;
|
|
}
|
|
|
|
> .mx_EventTile_avatar {
|
|
position: absolute;
|
|
z-index: 9;
|
|
}
|
|
|
|
.mx_MessageTimestamp {
|
|
position: absolute;
|
|
width: $MessageTimestamp_width;
|
|
}
|
|
|
|
.mx_EventTile_line, .mx_EventTile_reply {
|
|
padding-top: 1px;
|
|
padding-bottom: 3px;
|
|
line-height: $font-22px;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Compact layout overrides */
|
|
|
|
.mx_MatrixChat_useCompactLayout {
|
|
.mx_EventTile {
|
|
padding-top: 4px;
|
|
|
|
.mx_EventTile_line, .mx_EventTile_reply {
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
&.mx_EventTile_info {
|
|
// same as the padding for non-compact .mx_EventTile.mx_EventTile_info
|
|
padding-top: 0px;
|
|
font-size: $font-13px;
|
|
.mx_EventTile_line, .mx_EventTile_reply {
|
|
line-height: $font-20px;
|
|
}
|
|
.mx_EventTile_avatar {
|
|
top: 4px;
|
|
}
|
|
}
|
|
|
|
.mx_DisambiguatedProfile {
|
|
font-size: $font-13px;
|
|
}
|
|
|
|
&.mx_EventTile_emote {
|
|
// add a bit more space for emotes so that avatars don't collide
|
|
padding-top: 8px;
|
|
.mx_EventTile_avatar {
|
|
top: 2px;
|
|
}
|
|
.mx_EventTile_line, .mx_EventTile_reply {
|
|
padding-top: 0px;
|
|
padding-bottom: 1px;
|
|
}
|
|
}
|
|
|
|
&.mx_EventTile_emote.mx_EventTile_continuation {
|
|
padding-top: 0;
|
|
.mx_EventTile_line, .mx_EventTile_reply {
|
|
padding-top: 0px;
|
|
padding-bottom: 0px;
|
|
}
|
|
}
|
|
|
|
.mx_EventTile_avatar {
|
|
top: 2px;
|
|
}
|
|
|
|
.mx_EventTile_e2eIcon {
|
|
top: 3px;
|
|
}
|
|
|
|
.mx_ReadReceiptGroup {
|
|
// This aligns the avatar with the last line of the
|
|
// message. We want to move it one line up - 2rem
|
|
top: -2rem;
|
|
}
|
|
|
|
.mx_EventTile_content .markdown-body {
|
|
p, ul, ol, dl, blockquote, pre, table {
|
|
margin-bottom: 4px; // 1/4 of the non-compact margin-bottom
|
|
}
|
|
}
|
|
}
|
|
|
|
.mx_RoomView_MessageList h2 {
|
|
margin-top: 6px;
|
|
}
|
|
}
|