primefaces / primereact

The Most Complete React UI Component Library
https://primereact.org
MIT License
6.94k stars 1.05k forks source link

Dialog: Ugly vertical scrollbar #7289

Open Spencer857 opened 1 month ago

Spencer857 commented 1 month ago

Describe the bug

In general, PrimeReact components are outstanding. Sadly, Dialog is an exception. Its vertical scrollbar looks like a bug, especially on smaller screens. Look at the Bootstrap equivalent called modal. Their dialog doesn't have a dedicated scrollbar. To scroll, you use the window scrollbar.

Reproducer

No response

System Information

primereact: 10.8.3

Steps to reproduce the behavior

No response

Expected behavior

No response

melloware commented 1 month ago

Can you post a screenshot of what you mean?

melloware commented 1 month ago

Oh I see you don't want an inner scrollbar on the Dialog itself. I am pretty sure all 4 PrimeTek libs do this so I am not sure they will make any changes

sja-cslab commented 1 month ago

For me its perfect the way it is. The way bootstrap handles that look weird to me. The content of the Dialog is long so scroll the dialog. not the page. The difference here is, that the bootstrap modal/dialog goes outside of main page.

However if you look onto the second long content example - you'll notice that they've the .modal-dialog-scrollable class which causes the inner scrollbar like PrimeReact does.

Spencer857 commented 1 month ago

Depending on the use case, one behaves better than the other. I think PrimeReact should provide an additional boolean property to allow a choice.

sja-cslab commented 1 month ago

I get your point however - dialogs larger than screen feels like anti-pattern

melloware commented 1 month ago

Yeah I personally think PrimeReact handles it correctly and the Bootstrap using the browser scrollbar is wrong but that is just my vote and my two cents.