enclosed all controls for project velocity in a single responsive row solves #1006 #1059
Conversation
…sed screen estate management
|
All the fixes: Consolidated everything into one dbc.row by moving all 7 control groups, such as Weights and Y-axis and Date Picker, inside a single dbc.Row container so that control groups can be next, to each other. Grouped each label and input together inside individual dbc.Col's . I also added a class to it that says "d-flex align-items-center". This makes the label sit next to the input instead of being on the top on it for lesser width screens. Set the width to "auto" on every column so that the browser will use complete space needed for the content for Responsive Sizing. Spacing: Added className="g-3" to the main row and className="me-2" to the labels to ensure consistent spacing between the elements. AI review: checked python syntax and ensured latest bootstrap styling syntax is used, also checked for any obsolete code additions |
cdolfi
left a comment
cdolfi
left a comment
There was a problem hiding this comment.
Everything is on the right row but the alignment class for the labels and their controls need to be added back. See https://eightknot.osci.io/chaoss if youd like to see how the are aligned in its current state
Because of flexbox, the same code for alignment of controls were not effective. So I tried replicating the same appearance using different approach. let me know if this works! |
There was a problem hiding this comment.
Pull request overview
This PR consolidates the project velocity visualization controls into a single responsive row layout to improve the UI organization and responsiveness, addressing issue #1006.
Key Changes:
- Restructured layout from multiple separate
dbc.Rowelements into a single responsive row containing all controls - Wrapped each control group (label + input) in individual
dbc.Colelements with flexbox utilities for proper alignment - Applied consistent spacing and responsive behavior using Bootstrap utility classes (
d-flex,align-items-baseline,me-5,g-3)
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
|
@aniketchawardol did you add copilot as a reviewer? If so please resolve all comments, thanks! |
| dbc.Row( | ||
| [ | ||
|
|
||
| dbc.Col( |
There was a problem hiding this comment.
why is this wrapped in a col? I dont believe its necessary (comment applies to following additions of col wrapping)
There was a problem hiding this comment.
I have initially tested the same, but then values of some labels were falling back to next line. So to force the pair of label & value of a control to stay on a single line, I wrapped all the pairs into seperate cols.
2 participants
Closing #1006
I have tried to fit as many controls as possible by making a single responsive row containing all controls. I have taken care that label and their values must be in the same row.
Generative AI disclosure