Improve UX on live feature monitoring page

[manjitapandey]

Describe the solution you'd like
We can improve UX by making the live feature monitoring page more similar to the edit screen, where there’s no footer, the map is fixed to the available screen space and the right sidebar is the only space where scroll is enabled.

Additional context
Something similar to id editor page.

• Related to Feature/live monitoring #6151

[emi420]

Hey @royallsilwallz , it's improving! just a couple of fixes:

Tag filter and dropdown for selecting background has to be moved close to the top

It's using an absolute position, maybe something like top: 100px for the .top class will solve the issue. I'm open to other solutions also. Also, as you'll be working with the styling of this form, please check the alignment between the dropdown and the other elements and the value for the rounded corner of the "Search" button (to keep design consistent).

There's a scroll so the user can move the screen

An overflow: hidden could be used for disabling scroll on the container.

Also you have to take into a account the height of of the project's title and then the feature list at the bottom. Currently, the list's seems to be exceeding the available space. This is visible if you add a border: 1px solid red for testing:

[royallsilwallz]

Yeah sure @emi420. I'll be working on these changes.

[royallsilwallz]

Hey @emi420, I've fixed the design changes and pushed the code. Can you review it and let me know ?

[emi420]

Hey @royallsilwallz , everything looks nice!