MAGETWO-32302: Create New Order

- CR and QA updates

Author: Oleg Zinoviev

app/code/Magento/Backend/Block/Widget/Grid/Column/Renderer/Checkbox.php

@@ -116,7 +116,8 @@ protected function _getCheckboxHtml($value, $checked)
             ' admin__control-checkbox' .
             '"';
         $html .= $checked . $this->getDisabled() . '/>';
-        $html .= '<label class="admin__field-label"></label>';
+        $html .= '<label></label>';
+        /* ToDo UI: add class="admin__field-label" after some refactoring _fields.less */
         return $html;
     }
 

app/code/Magento/Sales/Block/Adminhtml/Order/Create/Search.php

@@ -30,7 +30,7 @@ protected function _construct()
      */
     public function getHeaderText()
     {
-        return __('Please select products.');
+        return __('Please select products');
     }
 
     /**

app/code/Magento/Ui/view/base/web/templates/pagination.html

@@ -24,7 +24,7 @@
     <input data-bind="value: current, event: {change: onPageChange}" type="text" class="input-text page" />
     <span class="pages-total">
         of
-        <span data-bind="text: pages" style="vertical-align: top;"></span>
+        <span data-bind="text: pages"></span>
     </span>
     <span data-bind="css: { disabled: isLast() }, click: next" class="action-next">
         <span>Next page</span>

app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/_page-nav.less

@@ -23,7 +23,7 @@
 @admin__page-nav-item__hover__background-color: darken(@admin__page-nav__background-color, 5%);
 
 @admin__page-nav-link__color: @color-very-dark-gray-black;
-@admin__page-nav-link__padding: 2rem 4rem 2rem 1rem;
+@admin__page-nav-link__padding: @indent__base 4rem @indent__base 1rem;
 @admin__page-nav-link__hover__color: @color-very-dark-gray-black;
 @admin__page-nav-link__changed__color: @color-very-dark-gray;
 

app/design/adminhtml/Magento/backend/Magento_Sales/web/css/source/module/_order-create.less

@@ -16,8 +16,9 @@
 @page-order-sidebar__color: @color-very-dark-gray;
 @page-order-sidebar__margin: 2.4rem;
 @page-order-sidebar__padding: @indent__base;
-@page-order-sidebar__margin-reqular: 1.7rem;
 @page-order-sidebar__margin-small: .5rem;
+@page-order-sidebar__margin-m: 1rem;
+@page-order-sidebar__margin-reqular: 1.7rem;
 @page-order-sidebar__border-color: @border__color;
 
 @page-order-icon-refresh__font-size: 2rem;
@@ -31,6 +32,7 @@
 @page-order-icon-plus__hover__color: @color-very-dark-gray-black2;
 
 @page-order-table__border-color: @table-td__border-color;
+@page-order-sidebar-scroll__height: 24rem;
 
 //
 
@@ -459,7 +461,7 @@
         th,
         td {
             &:first-child {
-                padding-left: 0;
+                padding-left: @page-order-sidebar__padding;
             }
         }
         .icon {
@@ -471,6 +473,7 @@
                 color: @page-order-sidebar__color;
             }
             &.icon-remove {
+                margin-left: -3px;
                 &:after {
                     content: @page-order-icon-remove__content;
                 }
@@ -484,12 +487,18 @@
                 .extend__visually-hidden();
             }
         }
+        .col-add {
+            text-align: right;
+            .icon-add {
+                margin-right: @page-order-sidebar__margin-m;
+            }
+        }
     }
     .action-refresh {
         &:extend(.abs-icon all);
-        display: inline-block;
+        display: table-cell;
         font-size: @page-order-icon-refresh__font-size;
-        padding-right: @page-order-sidebar__margin-small;
+        padding-right: @page-order-sidebar__margin-m;
         vertical-align: middle;
         &:after {
             color: @page-order-icon-refresh__color;
@@ -510,20 +519,27 @@
             margin: 0 0 @page-order-sidebar__margin;
         }
         .auto-scroll {
-            margin: 0 0 @page-order-sidebar__margin-small;
-            max-height: 17rem;
+            margin: 0 -@page-order-sidebar__padding @page-order-sidebar__margin-small;
+            max-height: @page-order-sidebar-scroll__height;
             overflow: auto;
             position: relative;
+            + .action-default {
+                margin-top: @page-order-sidebar__margin-reqular;
+            }
+            .no-items {
+                padding-left: @page-order-sidebar__padding;
+            }
         }
         .admin__field-option {
             padding-top: 0;
         }
     }
     .create-order-sidebar-label {
-        display: inline-block;
+        display: table-cell;
         font-size: @page-order-sidebar__font-size;
         font-weight: @font-weight__regular;
         margin: 0;
+        vertical-align: middle;
         + .admin__control-select {
             margin-top: @page-order-sidebar__margin-reqular;
         }

app/design/adminhtml/Magento/backend/web/css/source/components/_data-grid-temp.less

@@ -277,6 +277,7 @@
         }
     }
 
+    .input-text,
     .admin__control-text {
         margin: 0 1rem;
         min-width: 0;