feat(admin-ui): Improve styling & layout of CustomerDetail component

Relates to #52

admin-ui/src/app/customer/components/address-card/address-card.component.html

@@ -1,8 +1,8 @@
 <div class="card" *ngIf="addressForm.value as address">
     <div class="card-header">
-        <div class="address-title">
+        <div class="address-title ">
             <span class="street-line" *ngIf="address.streetLine1">{{ address.streetLine1 }},</span>
-            {{ getCountryName(address.countryCode) }}
+            {{ address.countryCode }}
         </div>
         <div class="default-controls">
             <vdr-chip class="is-default p8" *ngIf="isDefaultShipping">
@@ -24,8 +24,14 @@
                 <li *ngIf="address.city">{{ address.city }}</li>
                 <li *ngIf="address.province">{{ address.province }}</li>
                 <li *ngIf="address.postalCode">{{ address.postalCode }}</li>
-                <li *ngIf="address.countryCode">{{ getCountryName(address.countryCode) }}</li>
-                <li *ngIf="address.phoneNumber">{{ address.phoneNumber }}</li>
+                <li *ngIf="address.countryCode">
+                    <clr-icon shape="world" size="12"></clr-icon>
+                    {{ getCountryName(address.countryCode) }}
+                </li>
+                <li *ngIf="address.phoneNumber">
+                    <clr-icon shape="phone-handset" size="12"></clr-icon>
+                    {{ address.phoneNumber }}
+                </li>
             </ul>
             <form [formGroup]="addressForm" *ngIf="editing">
                 <clr-input-container>

admin-ui/src/app/customer/components/address-card/address-card.component.scss

@@ -1,7 +1,13 @@
 @import "variables";
 
+:host {
+    display: block;
+    max-width: 360px;
+}
+
 .address-lines {
     list-style-type: none;
+    line-height: 1.2em;
 }
 
 clr-input-container {

admin-ui/src/app/customer/components/customer-detail/customer-detail.component.html

@@ -71,7 +71,7 @@
     </section>
 </form>
 
-<div class="clr-row">
+<div class="clr-row" *ngIf="!(isNew$ | async)">
     <div class="clr-col-md-4">
         <h3>{{ 'customer.addresses' | translate }}</h3>
         <vdr-address-card

admin-ui/src/app/customer/components/customer-detail/customer-detail.component.ts

@@ -36,7 +36,7 @@ export class CustomerDetailComponent extends BaseDetailComponent<GetCustomer.Cus
     defaultShippingAddressId: string;
     defaultBillingAddressId: string;
     addressDefaultsUpdated = false;
-    ordersPerPage = 1;
+    ordersPerPage = 10;
     currentOrdersPage = 1;
     private orderListUpdates$ = new Subject<GetCustomer.Customer>();
 

admin-ui/src/i18n-messages/en.json

@@ -130,8 +130,8 @@
     "create-new-address": "Create new address",
     "create-new-customer": "Create new customer",
     "customer-type": "Customer type",
-    "default-billing-address": "Default billing address",
-    "default-shipping-address": "Default shipping address",
+    "default-billing-address": "Default billing",
+    "default-shipping-address": "Default shipping",
     "email-address": "Email address",
     "first-name": "First name",
     "full-name": "Full name",