Cursor in Style Source isn't visible with certain amount of characters/width

webstudio-is / webstudio

Open source website builder and Webflow alternative. Webstudio is an advanced visual builder that connects to any headless CMS, supports all CSS properties, and can be hosted anywhere, including with us.

https://webstudio.is

GNU Affero General Public License v3.0

5.19k stars 614 forks source link

Cursor in Style Source isn't visible with certain amount of characters/width #3944

Open johnsicili opened 2 months ago

johnsicili commented 2 months ago

When adding 1 or more Tokens that take up a specific width, the cursor is invisible.

It's easily reproduced by creating one Token with the following characters mmmmmmmmmmmmm1. This was a real use case I ran into but using actual Token names.

https://github.com/user-attachments/assets/adb83a46-7b47-4b71-885f-087f070286f5

johnsicili commented 2 months ago

This is also a problem when its not exact but with a little bit of room, you can't see what you're typing

johnsicili commented 2 weeks ago

Local is moved to the left. In this screenshot, the input is focused yet no cursor and local on the left