From eab6ca3baf808a03552b7cca600228ef838766e9 Mon Sep 17 00:00:00 2001
From: RMidhunSuresh <rmidhunsuresh@gmail.com>
Date: Wed, 26 May 2021 22:23:09 +0530
Subject: [PATCH] Make side-bar responsive

Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
---
 src/platform/web/ui/css/layout.css | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/platform/web/ui/css/layout.css b/src/platform/web/ui/css/layout.css
index 1eba5270..71274a31 100644
--- a/src/platform/web/ui/css/layout.css
+++ b/src/platform/web/ui/css/layout.css
@@ -72,7 +72,7 @@ the layout viewport up without resizing it when the keyboard shows */
 .middle .close-middle { display: none; }
 /* mobile layout */
 @media screen and (max-width: 800px) {
-    .SessionView:not(.middle-shown) {
+    .SessionView:not(.middle-shown, .SideBarActive) {
         grid-template:
             "status" auto
             "left" 1fr /
@@ -86,8 +86,17 @@ the layout viewport up without resizing it when the keyboard shows */
             1fr;
     }
 
+    .SessionView.SideBarActive{
+        grid-template:
+            "status" auto
+            "right" 1fr /
+            1fr;
+        
+    }
+
     .SessionView:not(.middle-shown) .room-placeholder { display: none; }
     .SessionView.middle-shown .LeftPanel { display: none; }
+    .SessionView.SideBarActive .middle { display: none; }
 
     /* show back button */
     .middle .close-middle { display: block !important; }