search

lmg-anon / mikupad

LLM Frontend in a single html file
https://lmg-anon.github.io/mikupad/mikupad.html
Creative Commons Zero v1.0 Universal
175 stars 24 forks source link

Highlight misalignment #78

Open cloak1505 opened 1 month ago

cloak1505 commented 1 month ago

Edit: Sorry, I didn't realize this is Issue #12. Close?

Often we have to adjust the display width to realign the token highlights.

As a non-coder at first I imagined it has something to do with the highlight hitting the margin before the text does. When you shrink the display, you can see the highlight get pushed to the next line before the text. But it's not as simple as extending the highlighting's margin by 1 pixel. I remember that most tokens start with a space, and I notice a space at the end of a line may or may not be "rendered" depending on whether it fits.

No clue how to solve this without adding bloat. SillyTavern does Token Probabilities in a separate panel with uneditable words and only for the newest message. Mikupad has highlighting over editable text because it's cool like that.

mikupad highlight glitch

Cyantime commented 1 month ago

This is from the text extending into where a scroll bar would be but the highlight doesn't, if you reduce the window height to force it to overflow and show the scroll bar the highlight syncs up properly.

I slapped overflow-y: scroll into the prompt-container textarea and it worked, someone with actual webdev whatever could do a better job.

cloak1505 commented 1 month ago

This is from the text extending into where a scroll bar would be but the highlight doesn't, if you reduce the window height to force it to overflow and show the scroll bar the highlight syncs up properly.

Oh you're right.

Meanwhile I'm gonna slip in a tiny nitpick: the wrench icon position looks a bit ugly when the scrollbar appears.

image

lmg-anon commented 2 weeks ago

Edit: Sorry, I didn't realize this is Issue https://github.com/lmg-anon/mikupad/issues/12. Close?

Yes, this is likely a duplicate of #12, but it's hard to say if it's really the same issue because I remember it was happening even when the scroll bar was visible.

This is from the text extending into where a scroll bar would be but the highlight doesn't, if you reduce the window height to force it to overflow and show the scroll bar the highlight syncs up properly.

I'm really confused about why this would happen... However, if it's as you say, this is likely an easy fix.

Meanwhile I'm gonna slip in a tiny nitpick: the wrench icon position looks a bit ugly when the scrollbar appears.

I agree. However, it's not something that bothered me enough for me to fix it myself lol