Fix vertical alignment inconsistencies for unlabeled widgets #3176
Conversation
Remove renderLabel method and update selectbox label stucture to use that of similarly sized widgets like text_input
Update StyledWidgetLabel's CSS properties to ensure that a widget's vertical position remains the same with or without a label
|
This pull request has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. |
|
Sorry for the delay. I am on vacation but will review it when I get back this week. |
|
Hey @hyerrakalva Thanks for implementing this and sorry for the delay (I was on vacation)! Looks like the tests are failing. I believe the latest from As for the cypress tests. Looks like they are snapshot issues, and it looks like these are related to just small margin adjustments. I'd say take a look and see if you https://github.com/streamlit/streamlit/wiki/Running-e2e-tests-and-updating-snapshots#the-diffmazing-cropper This will work for multiselect and radio. The color picker needs and adjustment due to a different image size. I think this is a good starting point, and I can get the updated image in. |
|
@kmcgrady Alright, I'll take a look into that this week! |
|
Hey @hyerrakalva - I've pulled your changes into another branch (#3317) to help get it over the finish line. Design is taking a look at the CSS changes now, and hopefully we'll merge to develop soon. Thanks for getting the ball rolling, and your work on this! |
|
For sure, glad I could help! |
3 participants
Issue: #3071
Description: This PR fixes visual inconsistencies that may occur when creating widgets in a
beta_columnscontainer without specifying a label.Selectboxcomponent's label+help element structure to make it vertically align properly with other widget types when all widgets in abeta_columnscontainer are unlabeledSelectbox.test.tsxto ensure that a label element always exists within aSelectboxcomponent, even if a label is not specified, for accessibility purposesStyledWidgetLabelcomponent to ensure that widgets inbeta_columnscontainer are vertically aligned when there is a combination of labeled & unlabeled widgetsContribution License Agreement
By submitting this pull request you agree that all contributions to this project are made under the Apache 2.0 license.