From b724cb5fd2a13b27173cccf224f66d558c8f7628 Mon Sep 17 00:00:00 2001 From: Suguru Hirahara Date: Fri, 5 May 2023 13:19:26 +0000 Subject: [PATCH] Make cascading of `mx_RoomHeader_closeButton` easy to understand (#10756) Signed-off-by: Suguru Hirahara --- res/css/views/rooms/_RoomHeader.pcss | 20 +++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/res/css/views/rooms/_RoomHeader.pcss b/res/css/views/rooms/_RoomHeader.pcss index 5c51aaf043..4cf1d44e10 100644 --- a/res/css/views/rooms/_RoomHeader.pcss +++ b/res/css/views/rooms/_RoomHeader.pcss @@ -179,7 +179,7 @@ limitations under the License. mask-size: contain; } - &:not(.mx_RoomHeader_closeButton):hover { + &:hover { background: rgba($accent, 0.1); &::before { @@ -232,10 +232,20 @@ limitations under the License. mask-image: url("$(res)/img/element-icons/call/spotlight.svg"); } -.mx_RoomHeader_closeButton::before { - mask-image: url("$(res)/img/cancel.svg"); - mask-size: 20px; - mask-position: center; +.mx_RoomHeader_closeButton { + &::before { + mask-image: url("$(res)/img/cancel.svg"); + mask-size: 20px; + mask-position: center; + } + + &:hover { + background: unset; /* remove background color on hover */ + + &::before { + background-color: $icon-button-color; /* set the default background color */ + } + } } .mx_RoomHeader_minimiseButton::before {