Open rotemdan opened 2 days ago
Hi, thanks for reporting an issue! Looks like you already have a fix, if you want to open it as a PR i'll happily review it :rocket:
The workaround I gave basically overrides some CSS properties with a browser extension.
In order to fix this properly, it should modify the cause of why the margin is added in the first place.
The particular HTML class that adds the margin seems to be .mr-1
:
It's added to the element:
There are 4 source files that include a div
element with the combination of scrollbar-custom mr-1
:
src/lib/components/chat/ChatWindow.svelte
src/routes/assistants/+page.svelte
src/routes/models/+page.svelte
src/routes/tools/+page.svelte
I could just remove mr-1
from all of them but I'm not really familiar with what each does, and not sure how exactly they would be impacted by this.
I can't really make a pull request without being sure what I'm doing makes sense.
Edit: I did make a pull request with these changes, but didn't test it since I couldn't get chat-ui
to run locally (issues with database, etc.)
Bug description
When the the mouse is located at the right edge of the viewport, the scroll bar is not responsive to clicks (pressing the left mouse button would cause text selection instead, which is not expected behavior).
It requires slight positioning to the left to get it pressed.
This is an issue with many different websites, but I've found a simple way to solve it here.
Steps to reproduce
Screen capture
Specs
v0.9.2
(web)Temporary fix using a custom stylesheet
Install the Stylus extension
Apply this stylesheet to https://huggingface.co/chat/
The stylesheet simply zeros the right margin for the element that includes the scrollbar. The margin is otherwise
4px
, which causes the problem.Screen capture after applying stylesheet
Thanks
I've been frustrated by this issue for a while now. I'm glad I've found a temporary workaround.
I would appreciate the issue being fixed for all users. Sometimes what looks like a minor UI fix can make a surprisingly large improvement in the overall user experience.