Fix: wrap selected display fields (#9139)

diff --git a/src-ui/src/app/components/common/input/drag-drop-select/drag-drop-select.component.html b/src-ui/src/app/components/common/input/drag-drop-select/drag-drop-select.component.html
index 2a2c0a780050a5f385dbfd739286f72ee7adf279..19dca0cffb290c104bfe2c3475c37c37fa334893 100644 (file)
--- a/src-ui/src/app/components/common/input/drag-drop-select/drag-drop-select.component.html
+++ b/src-ui/src/app/components/common/input/drag-drop-select/drag-drop-select.component.html
@@ -1,8 +1,8 @@
 <div class="d-flex flex-row mt-2 align-items-center">
     <span class="me-2">{{title}}:</span>
-    <div class="d-flex flex-row gap-2 w-100 mh-1" style="min-height: 1em;"
+    <div class="d-flex flex-wrap flex-row gap-2 w-100 mh-1" style="min-height: 1em;"
         cdkDropList #selectedList="cdkDropList"
-        cdkDropListOrientation="horizontal"
+        cdkDropListOrientation="mixed"
         (cdkDropListDropped)="drop($event)"
         [cdkDropListConnectedTo]="[unselectedList]">
         @for (item of selectedItems; track item.id) {