ACP2E-2083: Login as customer from admin in mobile/tablet devices is inaccessible - fix

Author: mirceaRosmeteniuc

app/code/Magento/Theme/view/adminhtml/page_layout/admin-2columns-left.xml

@@ -25,7 +25,7 @@
 
                 <container name="page.content" as="page_content" htmlTag="main" htmlId="anchor-content" htmlClass="page-content">
                     <container name="main.top" as="main-top" label="main-top"/>
-                    <container name="page.main.actions" as="page_main_actions" htmlTag="div" htmlClass="page-main-actions"/>
+                    <container name="page.main.actions" as="page_main_actions" htmlTag="div" htmlClass="page-main-actions actions-scrollable"/>
                     <container name="messages.wrapper" as="messages.wrapper" htmlTag="div" htmlId="messages">
                         <container name="page.messages" as="page.messages"/>
                     </container>

app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/_actions-bar.less

@@ -7,7 +7,7 @@
 //  Main elements -> Actions bar
 //  _____________________________________________
 
-//  ToDo UI: Consist old styles, should be changed with new design
+//  ToDo UI -> Consist old styles, should be changed with new design
 
 //
 //  Components
@@ -24,7 +24,15 @@
     padding: @page-main-actions__padding;
 }
 
+.actions-scrollable {
+    .page-actions {
+        display: flex;
+        overflow-x: auto;
+    }
+}
+
 .page-main-actions {
+    display: flex;
     margin: 0 0 @indent__l;
 
     &._hidden {
@@ -44,6 +52,8 @@
 
 .page-actions {
     @_page-action__indent: 1.3rem;
+    margin-left: auto;
+    order: 2;
 
     &.floating-header {
         &:extend(.page-actions-buttons all);
@@ -86,7 +96,7 @@
 
         &.back,
         &.action-back {
-            //  ToDo UI: Should be changed to ._back
+            //  ToDo UI -> Should be changed to ._back
             float: left;
             .lib-vendor-prefix-order(-1);
 
@@ -101,7 +111,7 @@
 
         &.action-primary,
         &.primary {
-            //  ToDo UI: Should be changed to .action-primary
+            //  ToDo UI -> Should be changed to .action-primary
             &:extend(.abs-action-primary all);
             &:extend(.abs-action-l all);
             .lib-vendor-prefix-order(2);
@@ -113,14 +123,14 @@
         }
 
         &.save {
-            //  ToDo UI: Should be changed to ._save
+            //  ToDo UI -> Should be changed to ._save
             &:not(.primary) {
                 .lib-vendor-prefix-order(1);
             }
         }
 
         &.delete {
-            //  ToDo UI: Should be changed to ._delete
+            //  ToDo UI -> Should be changed to ._delete
             .lib-vendor-prefix-order(-1);
         }
     }