
Baptiste DevessierandGitHub
183cf6c803
Shrink table rows (#17360)
We often use the `fr` unit in a CSS grid thinking that it will force the
max-width of the grid's items. However, [`1fr` is always equal to
`minmax(auto, 1fr)`](https://stackoverflow.com/a/52861514). The
consequences are:
- By default, the width of the element will be `1fr`.
- However, if the size of the element becomes wider than the resolved
dimension of `1fr`, the item will expand to match its `auto` width. This
can be easily encountered when an item has a really long text. The
`auto` size will be the dimension of the long text displayed on a single
line.
If you want your element not to overflow, you can use `minmax(0, 1fr)`
instead of `1fr`.
This is a known behavior in the community. CSS frameworks like Tailwind
CSS even made their utility classes setting grid columns use `minmax(0,
xfr)` by default.
<img width="1380" height="84" alt="CleanShot 2026-01-22 at 16 11 00@2x"
src="https://github.com/user-attachments/assets/ace3c862-90ef-4a47-9ad5-9ae8b6e0fe40"
/>
See:
https://www.bigbinary.com/blog/understanding-the-automatic-minimum-size-of-flex-items.
Another fix is to use `min-width: 0;` on items themselves, instead of
using `minmax(0, 1fr)` at the grid level. This would make it possible to
create a reusable `Td` component.
## Data model - fields
### Before
<img width="1120" height="1808" alt="CleanShot 2026-01-22 at 15 46
48@2x"
src="https://github.com/user-attachments/assets/893115f4-219d-4a75-b628-56315298d791"
/>
### After
<img width="1120" height="1808" alt="CleanShot 2026-01-22 at 15 47
00@2x"
src="https://github.com/user-attachments/assets/093ae231-ccae-4df5-8227-a662a3fae97e"
/>
## Data model - relations
### Before
<img width="1172" height="754" alt="CleanShot 2026-01-22 at 16 00 33@2x"
src="https://github.com/user-attachments/assets/3367b849-a4f4-471b-b73a-a80a95368640"
/>
### After
<img width="1146" height="770" alt="CleanShot 2026-01-22 at 16 00 44@2x"
src="https://github.com/user-attachments/assets/ff08556e-fc16-4984-bd4b-bb15f4dabf36"
/>
## Object level object field permission
### Before
<img width="1150" height="1902" alt="CleanShot 2026-01-22 at 15 50
16@2x"
src="https://github.com/user-attachments/assets/adce1ba1-042b-4892-9a0e-af254109d03c"
/>
### After
<img width="1150" height="1902" alt="CleanShot 2026-01-22 at 15 50
01@2x"
src="https://github.com/user-attachments/assets/55476711-2573-43ae-b1d6-b8695f4305ab"
/>
2026-01-22 19:42:09 +00:00
..
2026-01-22 18:19:06 +01:00
2026-01-22 13:39:07 +01:00
2025-12-22 15:19:11 +01:00
2026-01-17 07:37:17 +01:00
2026-01-22 10:51:43 +01:00
2026-01-19 12:39:14 +00:00
2026-01-19 12:46:34 +01:00
2026-01-17 07:37:17 +01:00
2026-01-22 19:42:09 +00:00
2026-01-22 18:19:06 +01:00
2026-01-22 18:30:19 +00:00
2026-01-22 18:16:55 +01:00
2026-01-22 13:21:49 +00:00
2025-12-23 14:26:11 +01:00
2026-01-22 12:27:11 +01:00
2025-12-17 14:39:51 +01:00