fix: padding on files view on mobile (#1934)

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()

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;