Uploaded image for project: 'Magnolia UI'
  1. Magnolia UI
  2. MGNLUI-6399

Multifield control buttons cover the fields with horizontal layout

    XMLWordPrintable

Details

    • Bug
    • Resolution: Obsolete
    • Neutral
    • None
    • 6.2.3
    • None

    Description

      When we add too many fields in a multifield and the layout is set to horizontal, the control buttons (up, down, remove) are over the fields. It looks like the width of these buttons does not adapt to the Multifield width.

      Steps to reproduce

      • Create the multifield as in the example below with the layout set to horizontal, when using the vertical layout we do not see this problem.
        !content-type:content-type-programs
        name: programs
        label: programs.app.name
        enabled: true
        icon: icon-content-app
        subApps:
          detail:
            form:
              properties:
                fechasSalidasRango:
                  $type: jcrMultiField
                  itemProvider:
                    $type: jcrChildNodeProvider
                  field:
                    $type: compositeField
                    itemProvider:
                      $type: jcrChildNodeProvider
                    layout:
                      $type: horizontal
                    properties:
                      desde:
                        $type: dateField
                        type: java.util.Date
                        dateFormat: dd-MM-yyyy
                      hasta:
                        $type: dateField
                        type: java.util.Date
                        dateFormat: dd-MM-yyyy
                      lunes:
                        $type: checkBoxField
                        buttonLabel: ""
                      martes:
                        $type: checkBoxField
                        buttonLabel: ""
                      miercoles:
                        $type: checkBoxField
                        buttonLabel: ""
                      jueves:
                        $type: checkBoxField                
                        buttonLabel: ""
                      viernes:
                        $type: checkBoxField
                        buttonLabel: ""
                      sabado:
                        $type: checkBoxField
                        buttonLabel: ""
                      domingo:
                        $type: checkBoxField
                        buttonLabel: ""
        
      • Render it, and note that the control fields are over the fields we set:
         

      Expected results

      The control buttons should be on the right of the fields

      Actual results

      The control buttons are over the fields

      Workaround

      Use vertical layout instead.

      Development notes

      https://git.magnolia-cms.com/projects/PLATFORM/repos/ui.pub/browse/ui-test-webapp/src/main/java/info/magnolia/ui/incub/MultiField.java
      Check what happens in 5.7 with Horizontal Layouts overflowing

      Checklists

        Acceptance criteria

        Attachments

          Issue Links

            Activity

              People

                avongunten Anja von Gunten
                mdamborenea Monica Damborenea
                Votes:
                0 Vote for this issue
                Watchers:
                3 Start watching this issue

                Dates

                  Created:
                  Updated:
                  Resolved:

                  Checklists

                    Bug DoR
                    Task DoD