Adapt to latest md changes

See https://github.com/angular/material/commit/17797f0

UI/Templates/ContactsUI/UIxContactEditorTemplate.wox

@@ -8,18 +8,18 @@
   <div layout="column" class="layout-fill sg-reversible">
     <md-card style="overflow: hidden">
       <md-card-actions layout="row" layout-align="end center">
-        <md-button class="sg-icon-button"
+        <md-button class="md-icon-button"
                    label:aria-label="Cancel"
                    ng-click="editor.cancel()">
           <md-icon>close</md-icon>
         </md-button>
         <div class="md-flex"><!-- spacer --></div>
-        <md-button class="sg-icon-button"
+        <md-button class="md-icon-button"
                    label:aria-label="Reset"
                    ng-click="editor.reset()">
           <md-icon>undo</md-icon>
         </md-button>
-        <md-button class="sg-icon-button"
+        <md-button class="md-icon-button"
                    label:aria-label="Save"
                    ng-click="editor.save(editor.card.$isCard()?cardForm:listForm)">
           <md-icon>save</md-icon>
@@ -33,7 +33,7 @@
         
         <!-- contact editor -->
         <form name="cardForm" ng-show="editor.card.$isCard()" ng-submit="editor.save(cardForm)">
-          <md-input-container>
+          <md-input-container class="md-block md-flex">
             <var:entity const:name="nbsp"/>
             <label>
               <var:string label:value="Display"/>
@@ -85,20 +85,20 @@
           <!-- org units -->
           <div class="attr" ng-repeat="unit in editor.card.orgUnits">
             <div layout="row" layout-align="center end">
-              <md-input-container>
+              <md-input-container class="md-flex">
                 <label>
                   <var:string label:value="Organization Unit"/>
                 </label>
                 <input type="text" ng-model="unit.value"
                        sg-focus-on="orgUnit_{{$index}}"/>
               </md-input-container>
-              <md-button class="sg-icon-button" type="button" ng-click="editor.card.$delete('orgUnits', $index)">
+              <md-button class="md-icon-button" type="button" ng-click="editor.card.$delete('orgUnits', $index)">
                 <md-icon>remove_circle</md-icon>
               </md-button>
             </div>
           </div>
           <div class="md-layout-margin" layout="row" layout-align="start center">
-            <md-button class="sg-icon-button" type="button" ng-click="editor.addOrgUnit($event)">
+            <md-button class="md-icon-button" type="button" ng-click="editor.addOrgUnit($event)">
               <md-icon>add_circle</md-icon>
             </md-button>
             <label class="button-label">
@@ -108,14 +108,13 @@
 
           <!-- categories -->
           <md-chips ng-model="editor.card.categories">
-            <md-chip-template>
-              {{$chip.value}}
-            </md-chip-template>
+            <md-chip-template>{{$chip.value}}</md-chip-template>
             <md-autocomplete
                 md-selected-item="editor.categories.selected"
                 md-selected-item-change="editor.card.$addCategory(category)"
                 md-search-text="editor.categories.searchText"
                 md-items="category in editor.card.constructor.filterCategories(editor.categories.searchText)"
+                md-min-length="0"
                 label:placeholder="Add a category">
               <span md-highlight-text="editor.categories.searchText">{{category}}</span>
             </md-autocomplete>
@@ -124,26 +123,26 @@
           <!-- emails -->
           <div class="section">
             <div class="attr" ng-repeat="email in editor.card.emails">
-              <div class="md-layout-margin" layout="row" layout-align="space-between end">
+              <div layout="row">
                 <md-input-container flex="20">
                   <md-select ng-model="email.type" label:placeholder="Type">
                     <md-option ng-repeat="type in ::editor.allEmailTypes" ng-value="type">{{ type }}</md-option>
                   </md-select>
                 </md-input-container>
-                <md-input-container>
+                <md-input-container class="md-flex">
                   <label>
                     <var:string label:value="Email Address"/>
                   </label>
                   <input type="email" ng-model="email.value"
                          sg-focus-on="email_{{$index}}"/>
                 </md-input-container>
-                <md-button class="sg-icon-button" type="button" ng-click="editor.card.$delete('emails', $index)">
+                <md-button class="md-icon-button" type="button" ng-click="editor.card.$delete('emails', $index)">
                   <md-icon>remove_circle</md-icon>
                 </md-button>
               </div>
             </div>
             <div class="md-layout-margin" layout="row" layout-align="start center">
-              <md-button class="sg-icon-button" type="button" ng-click="editor.addEmail()">
+              <md-button class="md-icon-button" type="button" ng-click="editor.addEmail()">
                 <md-icon>add_circle</md-icon>
               </md-button>
               <label class="button-label">
@@ -152,20 +151,21 @@
             </div>
           </div>
 
+          <!-- screenname -->
           <div class="section">
-            <div layout="row" layout-align="space-between end" ng-show="editor.card.c_screenname != null">
-              <md-input-container>
+            <div layout="row" ng-show="editor.card.c_screenname != null">
+              <md-input-container class="md-flex">
                 <label class="pseudo-input-label">
                   <var:string label:value="Screen Name"/>
                 </label>
                 <input type="text" ng-model="editor.card.c_screenname"/>
               </md-input-container>
-              <md-button class="sg-icon-button" type="button" ng-click="editor.card.$delete('c_screenname', -1)">
+              <md-button class="md-icon-button" type="button" ng-click="editor.card.$delete('c_screenname', -1)">
                 <md-icon>remove_circle</md-icon>
               </md-button>
             </div>
             <div class="md-layout-margin" layout="row" layout-align="start center" ng-show="editor.card.c_screenname == null">
-              <md-button class="sg-icon-button" type="button" ng-click="editor.addScreenName($event)">
+              <md-button class="md-icon-button" type="button" ng-click="editor.addScreenName($event)">
                 <md-icon>add_circle</md-icon>
               </md-button>
               <label class="button-label">
@@ -184,12 +184,12 @@
                 <md-datepicker class="pseudo-input-field"
                                ng-model="editor.card.birthday"><!-- birthday --></md-datepicker>
               </div>
-              <md-button class="sg-icon-button" type="button" ng-click="editor.card.$delete('birthday', -1)">
+              <md-button class="md-icon-button" type="button" ng-click="editor.card.$delete('birthday', -1)">
                 <md-icon>remove_circle</md-icon>
               </md-button>
             </div>
             <div class="md-layout-margin" layout="row" layout-align="start center" ng-hide="editor.card.birthday">
-              <md-button class="sg-icon-button" type="button" ng-click="editor.addBirthday()">
+              <md-button class="md-icon-button" type="button" ng-click="editor.addBirthday()">
                 <md-icon>add_circle</md-icon>
               </md-button>
               <label class="button-label">
@@ -201,27 +201,26 @@
           <!-- phones -->
           <div class="section">
             <div class="attr" ng-repeat="phone in editor.card.phones">
-              <div class="md-layout-margin" layout="row" layout-align="space-between end">
+              <div layout="row">
                 <md-input-container flex="20">
                   <md-select ng-model="phone.type" label:placeholder="Type">
                     <md-option ng-repeat="type in ::editor.allTelTypes" ng-value="type">{{ type }}</md-option>
                   </md-select>
                 </md-input-container>
-                <md-input-container>
+                <md-input-container class="md-flex">
                   <label>
                     <var:string label:value="Phone Number"/>
                   </label>
                   <input type="text" ng-model="phone.value"
                          sg-focus-on="phone_{{$index}}"/>
                 </md-input-container>
-                <md-button class="sg-icon-button" type="button" ng-click="editor.card.$delete('phones', $index)">
+                <md-button class="md-icon-button" type="button" ng-click="editor.card.$delete('phones', $index)">
                   <md-icon>remove_circle</md-icon>
                 </md-button>
               </div>
             </div>
-
-            <div class="md-layout-margin" layout="row" layout-align="start center">
-              <md-button class="sg-icon-button" type="button" ng-click="editor.addPhone()">
+            <div layout="row" layout-align="start center">
+              <md-button class="md-icon-button" type="button" ng-click="editor.addPhone()">
                 <md-icon>add_circle</md-icon>
               </md-button>
               <label class="button-label">
@@ -233,25 +232,25 @@
           <!-- urls -->
           <div class="section">
             <div class="attr" ng-repeat="url in editor.card.urls">
-              <div class="md-layout-margin" layout="row" layout-align="space-between end">
+              <div layout="row">
                 <md-input-container flex="20">
                   <md-select ng-model="url.type" label:placeholder="Type">
                     <md-option ng-repeat="type in ::editor.allUrlTypes" ng-value="type">{{ type }}</md-option>
                   </md-select>
                 </md-input-container>
-                <md-input-container>
+                <md-input-container class="md-flex">
                   <label>
                     <var:string label:value="URL"/>
                   </label>
                   <input type="url" ng-model="url.value" sg-focus-on="url_{{$index}}"/>
                 </md-input-container>
-                <md-button class="sg-icon-button" type="button" ng-click="editor.card.$delete('urls', $index)">
+                <md-button class="md-icon-button" type="button" ng-click="editor.card.$delete('urls', $index)">
                   <md-icon>remove_circle</md-icon>
                 </md-button>
               </div>
             </div>
             <div class="md-layout-margin" layout="row" layout-align="start center">
-              <md-button class="sg-icon-button" type="button" ng-click="editor.addUrl()">
+              <md-button class="md-icon-button" type="button" ng-click="editor.addUrl()">
                 <md-icon>add_circle</md-icon>
               </md-button>
               <label class="button-label">
@@ -263,72 +262,68 @@
           <!-- addresses -->
           <div class="section">
             <div class="attr" ng-repeat="address in editor.card.addresses">
-              <div layout="row" layout-align="center end">
+              <div layout="row">
                 <md-input-container flex="20">
                   <md-select ng-model="address.type" label:placeholder="Type">
                     <md-option ng-repeat="type in ::editor.allAddressTypes" ng-value="type">{{ type }}</md-option>
                   </md-select>
                 </md-input-container>
-                <md-input-container>
+                <md-input-container class="md-flex">
                   <label>
                     <var:string label:value="street"/>
                   </label>
                   <input type="text" ng-model="address.street"
                          sg-focus-on="address_{{$index}}"/>
                 </md-input-container>
-                <md-input-container>
-                  <label>
-                    <var:string label:value=""/>
-                  </label>
-                  <input type="text" ng-model="address.street2"/>
-                </md-input-container>
               </div>
-              <div layout="row" layout-align="center end">
-                <md-input-container>
+              <div layout="row">
+                <md-input-container flex="20">
                   <label>
                     <var:string label:value="Postoffice"/>
                   </label>
                   <input type="text" ng-model="address.postoffice"/>
                 </md-input-container>
+                <md-input-container class="md-flex">
+                  <label>
+                    <var:string label:value="street (continued)"/>
+                  </label>
+                  <input type="text" ng-model="address.street2"/>
+                </md-input-container>
               </div>
-              <div layout="row" layout-align="center end">
-                <md-input-container>
+              <div layout="row">
+                <md-input-container flex="50" flex-xs="100">
                   <label>
                     <var:string label:value="City"/>
                   </label>
                   <input type="text" ng-model="address.locality"/>
                 </md-input-container>
-              </div>
-              <div layout="row" layout-align="center end">
-                <md-input-container>
+                <md-input-container flex="50" flex-xs="100">
                   <label>
                     <var:string label:value="Region"/>
                   </label>
                   <input type="text" ng-model="address.region"/>
                 </md-input-container>
               </div>
-              <div layout="row" layout-align="center end">
-                <md-input-container>
+              <div layout="row">
+                <md-input-container flex="50" flex-xs="100">
                   <label>
                     <var:string label:value="Country"/>
                   </label>
                   <input type="text" ng-model="address.country"/>
                 </md-input-container>
-              </div>
-              <div layout="row" layout-align="center end">
-                <md-input-container>
+                <md-input-container class="md-flex">
                   <label>
                     <var:string label:value="Postal Code"/>
                   </label>
                   <input type="text" ng-model="address.postalcode"/>
                 </md-input-container>
-                <md-button class="sg-icon-button" type="button" ng-click="editor.card.$delete('addresses', $index)">
+                <md-button class="md-icon-button" type="button" ng-click="editor.card.$delete('addresses', $index)">
                   <md-icon>remove_circle</md-icon>
                 </md-button>
               </div>
             </div>
             <div class="md-layout-margin" layout="row" layout-align="start center">
-              <md-button class="sg-icon-button" type="button" ng-click="editor.addAddress()">
+              <md-button class="md-icon-button" type="button" ng-click="editor.addAddress()">
                 <md-icon>add_circle</md-icon>
               </md-button>
               <label class="button-label">
@@ -338,7 +333,7 @@
           </div>
 
           <!-- note -->
-          <md-input-container>
+          <md-input-container class="md-block md-flex">
             <label class="right inline">
               <var:string label:value="Note"/>
             </label>

UI/Templates/ContactsUI/UIxContactFolderLinksTemplate.wox

@@ -23,15 +23,15 @@
     <md-dialog-content class="md-padding">
       <div layout="column">
         <div class="sg-md-title"><var:string label:value="Authenticated User Access"/></div>
-        <md-input-container>
+        <md-input-container class="md-block">
           <label><var:string label:value="CardDAV URL"/></label>
           <input type="text" ng-model="links.addressbook.urls.cardDavURL" ng-readonly="true"/>
         </md-input-container>
       </div>
       <var:if condition="isPublicAccessEnabled">
-        <div layout="column" layout-padding="layout-padding">
+        <div layout="column">
           <div class="sg-md-title"><var:string label:value="Public Access"/></div>
-          <md-input-container>
+          <md-input-container class="md-block">
             <label><var:string label:value="CardDAV URL"/></label>
             <input type="text" ng-model="links.addressbook.urls.publicCardDavURL" ng-readonly="true"/>
           </md-input-container>

UI/Templates/ContactsUI/UIxContactFolderProperties.wox

@@ -11,7 +11,7 @@
     <md-toolbar>
       <div class="md-toolbar-tools">
         <!-- name -->
-        <md-input-container>
+        <md-input-container class="md-block md-flex">
           <label><var:string label:value="Name"/></label>
           <input type="text"
                  class="md-title"

UI/Templates/ContactsUI/UIxContactFoldersView.wox

@@ -275,14 +275,15 @@
           </div>
           <!-- search mode -->
           <div class="md-toolbar-tools sg-toolbar-secondary"
+               layout="row"
                ng-show="addressbook.mode.search"
                sg-search="addressbook.selectedFolder.$filter(searchText, { search: searchField })">
-            <md-button class="sg-icon-button"
+            <md-button class="md-icon-button"
                        sg-search-cancel="addressbook.cancelSearch()"
                        label:aria-label="Back">
               <md-icon>arrow_back</md-icon>
             </md-button>
-            <md-input-container md-no-float="md-no-float">
+            <md-input-container class="md-flex" md-no-float="md-no-float">
               <input name="folderSearch" type="search" label:placeholder="Search"/>
             </md-input-container>
             <md-input-container flex="25">

UI/Templates/ContactsUI/UIxContactsUserFolders.wox

@@ -16,8 +16,9 @@
       </div>
     </md-toolbar>
     <md-dialog-content class="md-dialog-content">
-      <md-input-container>
-        <label><md-icon>search</md-icon><var:string label:value="Search User"/></label>
+      <md-input-container class="md-block md-flex">
+        <md-icon>search</md-icon>
+        <label><var:string label:value="Search User"/></label>
         <input type="input"
                autocomplete="off"
                ng-model="subscribe.searchText"