From 33eee176f1b5d78f2107b57161d85422f6c96470 Mon Sep 17 00:00:00 2001
From: Michael Bromley <michael@michaelbromley.co.uk>
Date: Mon, 12 Jun 2023 14:01:29 +0200
Subject: [PATCH] fix(admin-ui): Small style fixes

---
 .../add-manual-payment-dialog.component.html  |  1 +
 .../draft-order-detail.component.html         |  2 +-
 .../select-customer-dialog.component.html     | 81 ++++++++++---------
 3 files changed, 43 insertions(+), 41 deletions(-)

diff --git a/packages/admin-ui/src/lib/order/src/components/add-manual-payment-dialog/add-manual-payment-dialog.component.html b/packages/admin-ui/src/lib/order/src/components/add-manual-payment-dialog/add-manual-payment-dialog.component.html
index 3748fbb3e5..b9cc2b0027 100644
--- a/packages/admin-ui/src/lib/order/src/components/add-manual-payment-dialog/add-manual-payment-dialog.component.html
+++ b/packages/admin-ui/src/lib/order/src/components/add-manual-payment-dialog/add-manual-payment-dialog.component.html
@@ -4,6 +4,7 @@
         <ng-select
             [items]="paymentMethods$ | async"
             bindLabel="code"
+            appendTo="body"
             autofocus
             bindValue="code"
             [addTag]="true"
diff --git a/packages/admin-ui/src/lib/order/src/components/draft-order-detail/draft-order-detail.component.html b/packages/admin-ui/src/lib/order/src/components/draft-order-detail/draft-order-detail.component.html
index 8c70777f1f..165e4f626a 100644
--- a/packages/admin-ui/src/lib/order/src/components/draft-order-detail/draft-order-detail.component.html
+++ b/packages/admin-ui/src/lib/order/src/components/draft-order-detail/draft-order-detail.component.html
@@ -86,7 +86,7 @@
                 *ngIf="order.shippingAddress"
                 [address]="order.shippingAddress"
             ></vdr-formatted-address>
-            <button class="button-small" (click)="setShippingAddress()">
+            <button class="button-small mr-2" (click)="setShippingAddress()">
                 {{ 'order.set-shipping-address' | translate }}
             </button>
 
diff --git a/packages/admin-ui/src/lib/order/src/components/select-customer-dialog/select-customer-dialog.component.html b/packages/admin-ui/src/lib/order/src/components/select-customer-dialog/select-customer-dialog.component.html
index c32b0b4991..7e26415234 100644
--- a/packages/admin-ui/src/lib/order/src/components/select-customer-dialog/select-customer-dialog.component.html
+++ b/packages/admin-ui/src/lib/order/src/components/select-customer-dialog/select-customer-dialog.component.html
@@ -6,31 +6,32 @@
 
         <ng-template [(clrIfActive)]="useExisting">
             <clr-tab-content>
-                <ng-select
-                    [items]="customers$ | async"
-                    appendTo="body"
-                    bindLabel="name"
-                    [addTag]="false"
-                    [multiple]="true"
-                    [hideSelected]="true"
-                    [trackByFn]="trackByFn"
-                    [minTermLength]="2"
-                    [loading]="isLoading"
-                    [typeahead]="input$"
-                    [(ngModel)]="selectedCustomer"
-                    class="mt-4"
-                >
-                    <ng-template ng-label-tmp let-item="item" let-clear="clear">
-                        <clr-icon shape="user" class="is-solid"></clr-icon
-                        ><span class="ml2 mr2">{{ item.firstName }} {{ item.lastName }}</span>
-                        <vdr-chip>{{ item.emailAddress }}</vdr-chip>
-                    </ng-template>
-                    <ng-template ng-option-tmp let-item="item">
-                        <clr-icon shape="user" class="is-solid"></clr-icon
-                        ><span class="ml2 mr2">{{ item.firstName }} {{ item.lastName }}</span>
-                        <vdr-chip>{{ item.emailAddress }}</vdr-chip>
-                    </ng-template>
-                </ng-select>
+                <div class="mt-4">
+                    <ng-select
+                        [items]="customers$ | async"
+                        appendTo="body"
+                        bindLabel="name"
+                        [addTag]="false"
+                        [multiple]="true"
+                        [hideSelected]="true"
+                        [trackByFn]="trackByFn"
+                        [minTermLength]="2"
+                        [loading]="isLoading"
+                        [typeahead]="input$"
+                        [(ngModel)]="selectedCustomer"
+                    >
+                        <ng-template ng-label-tmp let-item="item" let-clear="clear">
+                            <clr-icon shape="user" class="is-solid"></clr-icon
+                            ><span class="ml2 mr2">{{ item.firstName }} {{ item.lastName }}</span>
+                            <vdr-chip>{{ item.emailAddress }}</vdr-chip>
+                        </ng-template>
+                        <ng-template ng-option-tmp let-item="item">
+                            <clr-icon shape="user" class="is-solid"></clr-icon
+                            ><span class="ml2 mr2">{{ item.firstName }} {{ item.lastName }}</span>
+                            <vdr-chip>{{ item.emailAddress }}</vdr-chip>
+                        </ng-template>
+                    </ng-select>
+                </div>
             </clr-tab-content>
         </ng-template>
     </clr-tab>
@@ -40,21 +41,21 @@
         <ng-template [(clrIfActive)]="createNew">
             <clr-tab-content>
                 <form [formGroup]="customerForm">
-                <vdr-form-field [label]="'customer.title' | translate" for="title">
-                    <input id="title" type="text" formControlName="title" />
-                </vdr-form-field>
-                <vdr-form-field [label]="'customer.first-name' | translate" for="firstName">
-                    <input id="firstName" type="text" formControlName="firstName" />
-                </vdr-form-field>
-                <vdr-form-field [label]="'customer.last-name' | translate" for="lastName">
-                    <input id="lastName" type="text" formControlName="lastName" />
-                </vdr-form-field>
-                <vdr-form-field [label]="'customer.email-address' | translate" for="emailAddress">
-                    <input id="emailAddress" type="text" formControlName="emailAddress" />
-                </vdr-form-field>
-                <vdr-form-field [label]="'customer.phone-number' | translate" for="phoneNumber">
-                    <input id="phoneNumber" type="text" formControlName="phoneNumber" />
-                </vdr-form-field>
+                    <vdr-form-field [label]="'customer.title' | translate" for="title">
+                        <input id="title" type="text" formControlName="title" />
+                    </vdr-form-field>
+                    <vdr-form-field [label]="'customer.first-name' | translate" for="firstName">
+                        <input id="firstName" type="text" formControlName="firstName" />
+                    </vdr-form-field>
+                    <vdr-form-field [label]="'customer.last-name' | translate" for="lastName">
+                        <input id="lastName" type="text" formControlName="lastName" />
+                    </vdr-form-field>
+                    <vdr-form-field [label]="'customer.email-address' | translate" for="emailAddress">
+                        <input id="emailAddress" type="text" formControlName="emailAddress" />
+                    </vdr-form-field>
+                    <vdr-form-field [label]="'customer.phone-number' | translate" for="phoneNumber">
+                        <input id="phoneNumber" type="text" formControlName="phoneNumber" />
+                    </vdr-form-field>
                 </form>
             </clr-tab-content>
         </ng-template>