Skip to content

fix: tup-659 all form fields too short#267

Merged
wesleyboar merged 3 commits intomainfrom
fix/tup-659-all-form-fields-too-short
Nov 21, 2023
Merged

fix: tup-659 all form fields too short#267
wesleyboar merged 3 commits intomainfrom
fix/tup-659-all-form-fields-too-short

Conversation

@wesleyboar
Copy link
Copy Markdown
Member

@wesleyboar wesleyboar commented Nov 21, 2023

Overview

Stretch most input fields* of all form types to same width.

* Not checkboxes nor time nor date nor radio boxes.

Related

Changes

  1. Remove field width stretch from CMS and Login.
  2. Add field width stretch to all forms.
  3. Support form width stretch only if NOT a checkbox (nor date nor radio or time)*.

* The radio and time and date fields are unaffected for different reason.

Testing

  1. Open all forms:
  2. Verify widths of fields (except checkboxes, radios, date, time) are the same.

UI

Skipped.

Notes

We should not need :--form__field--not-checkbox (05f6f32) ever. I had added that, but then removed it in 70d3f28. All form fields, Portal or CMS, checkbox or not, should be stretched. Whether the <input> itself is stretched, is managed by styles specific to certain <input> fields.

1. Remove field width stretch from CMS and Login.
2. Add field width stretch to all forms.
3. Support form width stretch only if NOT a checkbox.
@github-actions github-actions bot added the fix Fixes user-facing behavior or feature label Nov 21, 2023
@wesleyboar wesleyboar added the patch A backward-compatible fix label Nov 21, 2023
No need to avoid stretching fieldw rapper that has a checkbox.

A checkbox (and others) are already explicitely told not to stretch.
Comment on lines -68 to -73
/* To make elements bigger */
& :--form__field:not(:--form__field--has-checkbox) {
/* To stretch input field width */
display: flex;
flex-direction: column;
}
Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This was added in #225, but as the wrong solution to a specificity problem.

Comment on lines +42 to +43
display: flex;
flex-direction: column;
Copy link
Copy Markdown
Member Author

@wesleyboar wesleyboar Nov 21, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All form fields, Portal or CMS, checkbox or not, should be stretched. Whether the <input> itslef is stretched, is managed by styles specific to certain <input> fields.

@wesleyboar wesleyboar merged commit 793c441 into main Nov 21, 2023
@wesleyboar wesleyboar deleted the fix/tup-659-all-form-fields-too-short branch November 21, 2023 21:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

fix Fixes user-facing behavior or feature patch A backward-compatible fix

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant