Update Toolbar margin and remove hide button

[makeavish]

https://github.com/SigNoz/signoz/issues/4771#issuecomment-2038642618

I'd also point out here once that the solution we arrived at now was also due to a slight mischaracterization of the feedback we received from the users. Users wouldn't want to hide/unhide the toolbar often. User would want to see the data unhindered, which was blocked by the lack of bottom spacing 👀 (and the ideal solution was not a hide button, it was more bottom spacing)

[YounixM]

@SagarRajput-7 : Update on this ?

[SagarRajput-7]

Not picked up yet, as no priority is assigned - (backlog)

[YounixM]

Are we clear with the requirement? We can assign it to other team members with complete information.

[makeavish]

To be picked after Logs Design update: https://signoz-team.slack.com/archives/C02TJ466H8U/p1722334816918019?thread_ts=1722332222.531109&cid=C02TJ466H8U

[rahulkeswani101]

@makeavish, I am assigning this to you. Please assign me back once the designs are approved and ready.

[GeekBoySupreme]

The primary reason for this happening is because we haven't added any buffer padding/margin below the content that gets rendered so that it can be scrolled above the toolbar and be seen.

All views containing the toolbar should have a 120px padding/margin at the bottom of the rendered content.

But besides, here are some toolbar refinements, includes some interaction updates and better contrast+visibility. Another reason behind the interaction update is so that the user does not need to go up to another area of the screen to input dashboard name. When you click on Save view we follow the same interaction 👇🏼 and plug in related fields.

https://github.com/user-attachments/assets/d1e628d5-c7ed-4a41-a5cb-c8f2ab42452b

Find the figma and all associated states here

Notes

• We're removing the ability to type inside the toolbar. Searching for a view now happens inside the menu that pops up on clicking select a view (When the pop-up opens, the mouse pointer automatically focuses on the input field so that the user can start searching without having to first click on the searchbox.

• The Save view button is horizontally centered in the toolbar, so please ensure that the spacings mentioned here are followed.