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

Adjust column widths in the "move" dialog

XMLWordPrintable

      In the Tree view of the "Move" chooser dialog, the most important bit of information shown is the hierarchy of nodes in the first column (named "Page", "Asset name", "Node name" or the like). Often however, this column is too narrow to allow for easy browsing of hierarchies. We should thus adjust its width the maximize the amount of space available to navigate hierarchies.

      To maximize the width of the first column:

      1. Remove the empty column or space to the left of the first column.
      2. Ensure that the second column occupies at most 30% of the width available to the Tree view ("Title" in Pages and Assets, "Tour operator" in Tours) .
        Note that this will have to be adjusted in several apps and on a as-needed basis. In some cases (e.g. Assets or Tours), the column width is already fine and needs no adjustment.
        If there's more than two columns, (e.g. "Value" and "Type" in Configuration), we leave column widths how they currently are.

      For an examples how this will then look in the Pages app, see 5 Adjusted columns.png.

      More than two columns

      If a "move" dialog has more than three columns, we leave things as they are. Here, we can only optimize column widths if we also truncate or shorten values shown. The ideal way to truncate the value depends on the value, and should thus be customizable. E.g.

      • For Java class names, we would truncate in-line (show three, four characters of the package name, then an ellipsis, then the class name): "ch.livelife...AbstractStorageSpace"
      • For people's names, the abbreviation could be "A. Weder" instead of "Andreas Weder".

      However, this should be the topic of a separate issue.

        Acceptance criteria

          1. 1 Pages app.png
            1 Pages app.png
            59 kB
          2. 2 Assets app.png
            2 Assets app.png
            42 kB
          3. 3 Tours app.png
            3 Tours app.png
            61 kB
          4. 4 Config app.png
            4 Config app.png
            49 kB
          5. 5 Adjusted columns.png
            5 Adjusted columns.png
            56 kB
          6. move-dialog-title-alignment.png
            move-dialog-title-alignment.png
            32 kB
          7. page-chooser-edited.png
            page-chooser-edited.png
            54 kB

              ngoc.nguyenthanh Ngoc Nguyenthanh
              weder Andreas Weder
              Votes:
              0 Vote for this issue
              Watchers:
              4 Start watching this issue

                Created:
                Updated:
                Resolved:

                  Task DoD

                    Estimated:
                    Original Estimate - 3d
                    3d
                    Remaining:
                    Time Spent - 2d 5h Remaining Estimate - 3h
                    3h
                    Logged:
                    Time Spent - 2d 5h Remaining Estimate - 3h
                    2d 5h