Closed joserodolfofreitas closed 6 days ago
The proposed design makes sense to me 👍.
In this example, I feel like I would be able to resize each column but I'm not. It feels like the proposed design of Gerda would solve the problem:
https://mui.com/x/react-data-grid/#mit-version
Minor. I think that it could be interesting to see what's the UI for when the mouse down is pressed. I wonder if it's not a bit off today: 1. is the resize handle tall enough, it can be hidden behind the cursor. 2. is the color contrasting enough. This a quick benchmark, not sure. None feels like they make a major difference.
MUI X
Notion
Airtable
Google Sheet
I tried to validate the idea, here's a codesandbox with comparisons between different features: https://codesandbox.io/s/purple-shadow-c8l2xk?file=/demo.tsx
is the resize handle tall enough
I've made it a bit taller to test if it resolves the concerns. What do you think? (Notion variant is nice too, not sure if it fits well in our layout)
I really liked the new implementation, especially the variant with header filters and how it defines the boundaries of each cell.
Regarding column groups, I think this one combined with the idea shown in https://github.com/mui/mui-x/issues/9162 could be a great improvement.
CC @gerdadesign
here's a codesandbox with comparisons between different features […] CC @gerdadesign
@MBilalShafi Great, thanks for looking into it! A few design execution feedback:
https://github.com/mui/mui-x/assets/3165635/0dae23f5-b053-435d-b92b-e7a05253e605
But I don't see how we can pull it off without forcing a background color on the whole data grid. I'm not sure this potential UX win is worth the DX customization pain.
:warning: This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue. Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.
@joserodolfofreitas: How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.
Summary 💡
The column headers separators present no distinguishable difference between columns that can be resized and columns that don't. This is a follow-up on #1623.
On https://github.com/mui/mui-x/pull/7067, we started exploring ways to make this difference clear, but there're also some challenges to validate and other solutions to explore.
Examples 🌈
Motivation 🔦
Design