From bd15a88c89d2a11eecb638984b1cac51cf93a84e Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Tue, 24 Oct 2017 17:10:29 +0100
Subject: [PATCH] Use CSS to stop greyed Right/LeftPanel UI from being
 interactable

---
 src/components/structures/LeftPanel.js  | 11 +++++++++--
 src/components/structures/RightPanel.js |  7 ++++++-
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/components/structures/LeftPanel.js b/src/components/structures/LeftPanel.js
index 1988dc5ef9..b48d03be1b 100644
--- a/src/components/structures/LeftPanel.js
+++ b/src/components/structures/LeftPanel.js
@@ -182,8 +182,15 @@ var LeftPanel = React.createClass({
         }
 
         return (
-            <aside className={classes} style={{ opacity: this.props.opacity }}
-                   onKeyDown={ this._onKeyDown } onFocus={ this._onFocus } onBlur={ this._onBlur }>
+            <aside className={classes}
+                style={{
+                    opacity: this.props.opacity,
+                    pointerEvents: this.props.opacity < 1.0 ? 'none' : undefined,
+                }}
+                onKeyDown={ this._onKeyDown }
+                onFocus={ this._onFocus }
+                onBlur={ this._onBlur }
+            >
                 { topBox }
                 <CallPreview ConferenceHandler={VectorConferenceHandler} />
                 <RoomList
diff --git a/src/components/structures/RightPanel.js b/src/components/structures/RightPanel.js
index 0225f7655d..c32c064641 100644
--- a/src/components/structures/RightPanel.js
+++ b/src/components/structures/RightPanel.js
@@ -351,7 +351,12 @@ module.exports = React.createClass({
         }
 
         return (
-            <aside className={classes} style={{ opacity: this.props.opacity }}>
+            <aside className={classes}
+                style={{
+                    opacity: this.props.opacity,
+                    pointerEvents: this.props.opacity < 1.0 ? 'none' : undefined,
+                }}
+            >
                 <div className="mx_RightPanel_header">
                     <div className="mx_RightPanel_headerButtonGroup">
                         {headerButtons}