fix(admin-ui): Fix layout of select customer dropdown items

vendure-ecommerce · Jul 12, 2023 · 3f8a1da · 3f8a1da
1 parent c426f8d
commit 3f8a1da
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/...src/lib/order/src/components/select-customer-dialog/select-customer-dialog.component.html b/...src/lib/order/src/components/select-customer-dialog/select-customer-dialog.component.html
@@ -21,14 +21,18 @@
                         [(ngModel)]="selectedCustomer"
                     >
                         <ng-template ng-label-tmp let-item="item" let-clear="clear">
+                            <span class="item-row">
                             <clr-icon shape="user" class="is-solid"></clr-icon
-                            ><span class="ml2 mr2">{{ item.firstName }} {{ item.lastName }}</span>
+                            ><span class="mx-1">{{ item.firstName }} {{ item.lastName }}</span>
                             <vdr-chip>{{ item.emailAddress }}</vdr-chip>
+                            </span>
                         </ng-template>
                         <ng-template ng-option-tmp let-item="item">
+                            <span class="item-row">
                             <clr-icon shape="user" class="is-solid"></clr-icon
-                            ><span class="ml2 mr2">{{ item.firstName }} {{ item.lastName }}</span>
+                            ><span class="mx-1">{{ item.firstName }} {{ item.lastName }}</span>
                             <vdr-chip>{{ item.emailAddress }}</vdr-chip>
+                            </span>
                         </ng-template>
                     </ng-select>
                 </div>

diff --git a/...src/lib/order/src/components/select-customer-dialog/select-customer-dialog.component.scss b/...src/lib/order/src/components/select-customer-dialog/select-customer-dialog.component.scss
@@ -0,0 +1,4 @@
+.item-row {
+    display: flex;
+    align-items: center;
+}