PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Add a previous event safe area around action bar

Browse source 
This adds a previous event safe area so that you can't accidentally hover the
previous event while trying to mouse into the action bar or from the react
button to its tooltip.

Part of https://github.com/vector-im/riot-web/issues/10185
Fixes https://github.com/vector-im/riot-web/issues/9650
This commit is contained in:
J. Ryan Stinnett 2019-07-11 14:44:52 +01:00
parent e53b922290
commit 58a75949c3
1 changed files with 17 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
res/css/views/messages/_MessageActionBar.scss
View file

@ -1,5 +1,6 @@
/*
Copyright 2019 New Vector Ltd
Copyright 2019 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.
@ -29,6 +30,22 @@ limitations under the License.
// Ensure the action bar appears above over things, like the read marker.
z-index: 1;
// Adds a previous event safe area so that you can't accidentally hover the
// previous event while trying to mouse into the action bar or from the
// react button to its tooltip.
&::before {
content: '';
position: absolute;
// tooltip overhang + action bar + action bar offset from event
width: calc(48px + 100% + 8px);
// safe area + action bar
height: calc(20px + 100%);
top: -20px;
left: -48px;
z-index: -1;
cursor: initial;
}
> * {
white-space: nowrap;
display: inline-block;