Dashboard: Improve UI for Inputs #855
Conversation
This is part of the goal of having the Inputs take up 50% of the page only, leaving the right 50% for future visualization additions.
It does not look like it is needed
So that the line of code is not hidden deeply and can easily read from the 'outside'
Need to assign 'auto' instead as we want checkboxes to be next to each other.. this is primarily making space for future PR to allow space for 'select mode' select field
This is to ensure that the input section can function on a smaller screen
Does not require to 'show_details' as there it is not expected for a dropdown to have validation
Making it not expand past the toolbar
To improve responsiveness and user expectations
Alter input_header function to allow more flexibility on button placement, update space_charge header because of this. Additionally, the lattice config is inside one vcard rather than two separate, and the icons are treated as actual buttons with an icon.
for more information, see https://pre-commit.ci
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
|
The input section prior to PR (on a laptop-sized screen): The input section after the PR (on a laptop-sized screen): |
|
The bolded headings in the before are not consistent with other UI input labels. |
proy30
changed the title
|
The scrolling that is now default for most screen sizes inside boxes is a bit cumbersome in terms of UI/UX, I think. What about this: adding the option to collapse a box by clicking on its title to save space? That would be more natural, because some boxes one sets once while one works with other boxes repeatedly. |
proy30
changed the title
|
Demo with no scroll bars, expandable and collapsible sections. chrome_9XngD2zFsE.mp4 |
|
And add "collapse all" in toolbar chrome_dwLXHBxk8f.mp4 |
proy30
changed the title
This PR improves the existing dashboard Inputs UI by: