onlook-dev / onlook

The open source, local-first Webflow alternative. Design directly in your live React site and publish your changes to code.
https://onlook.dev
Apache License 2.0
2.6k stars 124 forks source link

[Bug] Improve alignment of top bar labels and show/hide button #273

Closed drfarrell closed 2 weeks ago

drfarrell commented 2 weeks ago

The labels of the various categories are misaligned – they appear to be too high up (or there's extra margin below them.

Here are my recommended corrections.

image

drfarrell commented 2 weeks ago

Also, the other labels besides the active one (Components, in this example) should have text-hover as a style applied on hover

image
Sai-Manikanta-Andey commented 2 weeks ago

Hey I would like to work on it .Could you assign me if possible !

Kitenite commented 2 weeks ago

You got it @Sai-Manikanta-Andey !

Sai-Manikanta-Andey commented 2 weeks ago

Hi @Kitenite ,

Before creating a pull request, I wanted to check with you if this solution looks good. I've attached a short video that demonstrates the issue and my fix.

https://github.com/user-attachments/assets/b4f00a51-a8cf-44dc-b3e4-1b2c466f2b80

Please let me know if this approach works, or if you have any suggestions before I proceed with the PR.

Thank you!

drfarrell commented 2 weeks ago

@Sai-Manikanta-Andey looks solid - go ahead and make the PR and I can take a look but looks solid 🫡