From 2584c85a927a10d44772ffcec0ef167fb9007708 Mon Sep 17 00:00:00 2001 From: Michael Weimann Date: Thu, 25 Nov 2021 20:08:48 +0100 Subject: [PATCH] use existing resize handle classes Signed-off-by: Michael Weimann --- res/css/structures/_MainSplit.scss | 15 ++++++++------- src/components/structures/MainSplit.tsx | 2 +- 2 files changed, 9 insertions(+), 8 deletions(-) diff --git a/res/css/structures/_MainSplit.scss b/res/css/structures/_MainSplit.scss index 6dfbb14d1a3..215e87940c1 100644 --- a/res/css/structures/_MainSplit.scss +++ b/res/css/structures/_MainSplit.scss @@ -28,15 +28,16 @@ limitations under the License. margin-left: 8px; height: calc(100vh - 51px); // height of .mx_RoomHeader.light-panel - &:hover .mx_RightPanel_ResizeHandle { - // Need to use important to override element style attributes - // set by re-resizable - top: 50% !important; + &:hover .mx_ResizeHandle_horizontal::before { + position: absolute; + top: 50%; transform: translate(0, -50%); - height: 64px !important; // to match width of the ones on roomlist - width: 4px !important; - border-radius: 4px !important; + height: 64px; // to match width of the ones on roomlist + width: 4px; + border-radius: 4px; + + content: ''; background-color: $primary-content; opacity: 0.8; diff --git a/src/components/structures/MainSplit.tsx b/src/components/structures/MainSplit.tsx index af7645767dc..f4b15429493 100644 --- a/src/components/structures/MainSplit.tsx +++ b/src/components/structures/MainSplit.tsx @@ -83,7 +83,7 @@ export default class MainSplit extends React.Component { onResize={this.onResize} onResizeStop={this.onResizeStop} className="mx_RightPanel_ResizeWrapper" - handleClasses={{ left: "mx_RightPanel_ResizeHandle" }} + handleClasses={{ left: "mx_ResizeHandle_horizontal" }} > { panelView } ;