[MGNLUI-6997] Fields in form layout is in full size Created: 28/Dec/21  Updated: 28/Dec/21

Status: Open
Project: Magnolia UI
Component/s: None
Affects Version/s: 6.2.15
Fix Version/s: None

Type: Bug Priority: Neutral
Reporter: Sang Ngo Huu Assignee: Unassigned
Resolution: Unresolved Votes: 0
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Attachments: PNG File form-not-render-nicely.png    
Issue Links:
relation
is related to MGNLUI-6014 DeclarativeLayout fallback to SingleT... Closed
Template:
Acceptance criteria:
Empty
Task DoD:
[ ]* Doc/release notes changes? Comment present?
[ ]* Downstream builds green?
[ ]* Solution information and context easily available?
[ ]* Tests
[ ]* FixVersion filled and not yet released
[ ]  Architecture Decision Record (ADR)
Bug DoR:
[ ]* Steps to reproduce, expected, and actual results filled
[ ]* Affected version filled

 Description   

Steps to reproduce

  1.  Create form with form or declarative layout
    form:
      properties:
        salutation:
          label: Salutation
          $type: textField
        firstName:
          label: First Name
          $type: textField
        lastName:
          label: Last Name
          $type: textField
      layout:
        $type: form
        #$type: declarativeLayout
        #template: /hello-magnolia/dialogs/declarative-dialogs/test.html
    
  1.  If use declarative, use tag <vaadin-form-layout> as document mentions:

    It is recommended that Magnolia properties be nested inside a <vaadin-form-layout> tag. If you insert a Magnolia property inside a <vaadin-vertical-layout> tag, the component will not be rendered as nicely.

  1. Check the field's width

Expected results

Fields should be rendered nicely

Actual results

Fields are full width and not look nice

Workaround

Development notes


Generated at Mon Feb 12 09:42:06 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.