From 633d6189fbbd2a470a74f8bfd352e8b3e7af684c Mon Sep 17 00:00:00 2001
From: Aman Harwara <amanharwara@protonmail.com>
Date: Fri, 4 Nov 2022 01:34:47 +0530
Subject: [PATCH] fix: padding on files view on mobile (#1934)

---
 .../Components/ResponsivePane/ResponsivePaneProvider.tsx      | 4 ++--
 packages/web/src/stylesheets/_columns.scss                    | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/web/src/javascripts/Components/ResponsivePane/ResponsivePaneProvider.tsx b/packages/web/src/javascripts/Components/ResponsivePane/ResponsivePaneProvider.tsx
index 943e881e6..3ac84b957 100644
--- a/packages/web/src/javascripts/Components/ResponsivePane/ResponsivePaneProvider.tsx
+++ b/packages/web/src/javascripts/Components/ResponsivePane/ResponsivePaneProvider.tsx
@@ -72,11 +72,11 @@ const ResponsivePaneProvider = ({ paneController, children }: ProviderProps) =>
   useEffect(() => {
     if (previousSelectedPane) {
       const previousPaneElement = document.getElementById(ElementIds[previousSelectedPane])
-      previousPaneElement?.classList.remove('selected')
+      previousPaneElement?.removeAttribute('data-selected-pane')
     }
 
     const currentPaneElement = document.getElementById(ElementIds[currentSelectedPane])
-    currentPaneElement?.classList.add('selected')
+    currentPaneElement?.setAttribute('data-selected-pane', '')
   }, [currentSelectedPane, previousSelectedPane])
 
   const addAndroidBackHandler = useAndroidBackHandler()
diff --git a/packages/web/src/stylesheets/_columns.scss b/packages/web/src/stylesheets/_columns.scss
index 704cd0102..83c460c7c 100644
--- a/packages/web/src/stylesheets/_columns.scss
+++ b/packages/web/src/stylesheets/_columns.scss
@@ -17,7 +17,7 @@
   }
 
   @media screen and (max-width: 768px) {
-    &.selected {
+    &[data-selected-pane] {
       flex-grow: 1;
 
       .content {
@@ -30,7 +30,7 @@
       left: 0 !important;
     }
 
-    &:not(.selected) {
+    &:not([data-selected-pane]) {
       min-height: 0;
       height: auto;
       padding: 0;