Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(ui5-form): add new emptySpan property #10194

Merged
merged 6 commits into from
Nov 23, 2024
Merged

feat(ui5-form): add new emptySpan property #10194

merged 6 commits into from
Nov 23, 2024

Conversation

ilhan007
Copy link
Member

@ilhan007 ilhan007 commented Nov 15, 2024

Background

Adds new emptySpan property that provides additional layout flexibility by defining empty space at the form item’s end.

Example: Setting "S0 M0 L3 XL3" (or just "L3 XL3") adjusts the layout as follows:

  • Label: remains 4 cells.
  • Field: is reduced to 5 cells.
  • Empty space: 3 cells are added at the end.
    Greater values increase the empty space at the end of the form item, reducing the space available for the label and its field.

Recommended value:
Setting emptySpan to 1 cell is typically sufficient to achieve a balanced layout.

Note:

  • The maximum allowable empty space is 10 cells. At least 1 cell each must remain for the label and the field.
  • When emptySpan is specified (greater than 0), ensure that the combined value of emptySpan and labelSpan does not exceed 11. This guarantees a minimum of 1 cell for the field.

Usage

<ui5-form empty-span="L1 XL1"></ui5-form>

Without empty span

Screenshot 2024-11-15 at 15 31 37

With empty span

Screenshot 2024-11-15 at 15 29 41 8923d65c7">

Fixes: #9963

@ilhan007 ilhan007 marked this pull request as ready for review November 15, 2024 14:20
@ilhan007 ilhan007 changed the title wip(ui5-form): add new emptySpan property feat(ui5-form): add new emptySpan property Nov 15, 2024
@ilhan007 ilhan007 requested a review from nnaydenow November 17, 2024 14:39
@ilhan007 ilhan007 merged commit 48b0cc8 into main Nov 23, 2024
10 checks passed
@ilhan007 ilhan007 deleted the form-empty-space branch November 23, 2024 12:24
@ui5-webcomponents-bot
Copy link
Collaborator

🎉 This PR is included in version v2.5.0-rc.2 🎉

The release is available on v2.5.0-rc.2

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Form]: update to latest UX specs
3 participants