File manager responsivity issue

[WISPdotGG]

Describe the bug

When you make the window a certain size, the file manager becomes unusable because the top row misbehaves

Expected Behavior

table to remain legible

Actual Behavior

table malforms

Steps to Reproduce

Open file manager Resize window

Browser Details

Chrome 102.0.5005.22

Operating System

Chrome 102.0.5005.22

Optional additional information

https://cdn.discordapp.com/attachments/449546780691136534/972586270280794132/Screen_recording_2022-05-07_8.50.08_PM.webm

[WISPdotGG]

I think this is related on the database page: https://cdn.discordapp.com/attachments/449546780691136534/972594454944956497/Screen_recording_2022-05-07_9.22.47_PM.webm

[mason-rogers]

What makes the tables un-usable in this view? It's displayed like this when on mobile so mobile users dont have a horizontal scrollbar in the list pages - all of the buttons should work & data is displayed

[WISPdotGG]

The top row should stay at the top, like it does on wider windows. On the file manager the "..." button and checkbox next to the icon should also be inline. It looks confusing right now. This looks confusing: https://cdn.discordapp.com/attachments/449546780691136534/972597523250294814/unknown.png

[mason-rogers]

As I mentioned to you privately earlier, I plan on fixing a lot of things in the frontend refactor on the roadmap and this is one of them.

I'm personally not a fan of using tables for lists in general and think we could improve UI greatly if we started using eg. row containers for list items (similar to ptero ig?). Tables dont look nice on mobile and there's not a trivial usage agnostic way to make them mobile friendly, hence the pretty poor mobile support for tables atm.

Would like your thoughts on phasing out tables in general.