mirror of
https://github.com/element-hq/element-web
synced 2024-11-23 17:56:01 +03:00
Fix hover tile border (#7117)
* Revert "Update highlighted event line to prevent content jumping (#7090)"
This reverts commit 0f8272c6a1
.
* Fix message jumps
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
This commit is contained in:
parent
f87e9d86a4
commit
2a1a180ece
2 changed files with 15 additions and 12 deletions
|
@ -184,7 +184,6 @@ limitations under the License.
|
||||||
|
|
||||||
.mx_EventTile, .mx_EventListSummary {
|
.mx_EventTile, .mx_EventListSummary {
|
||||||
// Account for scrollbar when hovering
|
// Account for scrollbar when hovering
|
||||||
margin: 0 2px;
|
|
||||||
padding-top: 0;
|
padding-top: 0;
|
||||||
|
|
||||||
.mx_ThreadInfo {
|
.mx_ThreadInfo {
|
||||||
|
|
|
@ -221,25 +221,25 @@ $left-gutter: 64px;
|
||||||
&:hover.mx_EventTile_verified .mx_EventTile_line,
|
&:hover.mx_EventTile_verified .mx_EventTile_line,
|
||||||
&:hover.mx_EventTile_unverified .mx_EventTile_line,
|
&:hover.mx_EventTile_unverified .mx_EventTile_line,
|
||||||
&:hover.mx_EventTile_unknown .mx_EventTile_line {
|
&:hover.mx_EventTile_unknown .mx_EventTile_line {
|
||||||
padding-left: calc($left-gutter);
|
padding-left: calc($left-gutter - $selected-message-border-width);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover.mx_EventTile_verified .mx_EventTile_line {
|
&:hover.mx_EventTile_verified .mx_EventTile_line {
|
||||||
box-shadow: inset $selected-message-border-width 0 0 0 $e2e-verified-color;
|
border-left: $e2e-verified-color $selected-message-border-width solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover.mx_EventTile_unverified .mx_EventTile_line {
|
&:hover.mx_EventTile_unverified .mx_EventTile_line {
|
||||||
box-shadow: inset $selected-message-border-width 0 0 0 $e2e-verified-color;
|
border-left: $e2e-unverified-color $selected-message-border-width solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover.mx_EventTile_unknown .mx_EventTile_line {
|
&:hover.mx_EventTile_unknown .mx_EventTile_line {
|
||||||
box-shadow: inset $selected-message-border-width 0 0 0 $e2e-verified-color;
|
border-left: $e2e-unknown-color $selected-message-border-width solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover.mx_EventTile_verified.mx_EventTile_info .mx_EventTile_line,
|
&:hover.mx_EventTile_verified.mx_EventTile_info .mx_EventTile_line,
|
||||||
&:hover.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line,
|
&:hover.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line,
|
||||||
&:hover.mx_EventTile_unknown.mx_EventTile_info .mx_EventTile_line {
|
&:hover.mx_EventTile_unknown.mx_EventTile_info .mx_EventTile_line {
|
||||||
padding-left: calc($left-gutter + 18px);
|
padding-left: calc($left-gutter + 18px - $selected-message-border-width);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* End to end encryption stuff */
|
/* End to end encryption stuff */
|
||||||
|
@ -822,7 +822,7 @@ $left-gutter: 64px;
|
||||||
.mx_EventTile_senderDetails {
|
.mx_EventTile_senderDetails {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 6px;
|
gap: calc(6px + $selected-message-border-width);
|
||||||
|
|
||||||
a {
|
a {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
@ -846,17 +846,21 @@ $left-gutter: 64px;
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_EventTile_line {
|
|
||||||
padding-left: 0 !important;
|
|
||||||
order: 10 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mx_EventTile {
|
.mx_EventTile {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding-top: 0;
|
padding-top: 0;
|
||||||
|
|
||||||
|
.mx_EventTile_line {
|
||||||
|
padding-left: $selected-message-border-width !important;
|
||||||
|
order: 10 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover .mx_EventTile_line {
|
||||||
|
padding-left: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_MessageTimestamp {
|
.mx_MessageTimestamp {
|
||||||
left: auto;
|
left: auto;
|
||||||
right: 2px !important;
|
right: 2px !important;
|
||||||
|
|
Loading…
Reference in a new issue