From 63af822bad54ab6258768dfec79393153c3b72f0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Asbj=C3=B8rn=20Riis-Knudsen?= <asbjoern@stentebjerg.net>
Date: Thu, 29 Oct 2015 14:52:18 +0100
Subject: [PATCH 1/2] U4-6657: Use flexbox for mediapicker search field and
 upload button to allow button to scale for different translations

---
 src/Umbraco.Web.UI.Client/src/less/panel.less  | 17 +++++++++++++++++
 .../src/views/common/dialogs/mediapicker.html  | 18 ++++++++----------
 2 files changed, 25 insertions(+), 10 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/panel.less b/src/Umbraco.Web.UI.Client/src/less/panel.less
index f86ba46f59..82c272564a 100644
--- a/src/Umbraco.Web.UI.Client/src/less/panel.less
+++ b/src/Umbraco.Web.UI.Client/src/less/panel.less
@@ -42,6 +42,23 @@
     bottom: 90px;
 }
 
+.umb-mediapicker-upload {
+    display: -ms-flexbox;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: flex;
+
+    .form-search {
+        -ms-flex: 1;
+        -webkit-flex: 1;
+        flex: 1;
+    }
+
+    .upload-button {
+        margin-left: 16px;
+    }
+}
+
 .umb-panel.editor-breadcrumb .umb-panel-body, .umb-panel.editor-breadcrumb .umb-bottom-bar {
     bottom: 31px !important;
 }
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html
index 597dcdaa4b..1594de0e12 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html
@@ -62,18 +62,16 @@
     <div class="umb-panel umb-dialogs-mediapicker browser" ng-hide="target" ng-style="{opacity: dropping == true ? '0.25' : '1.0'}">
         <div class="umb-panel-header">
 
-            <div class="umb-el-wrap umb-panel-buttons">
-                <div class="span5">
-                    <div class="form-search">
-                        <i class="icon-search"></i>
-                        <input type="text"
-                               ng-model="searchTerm"
-                               class="umb-search-field search-query"
-                               placeholder="Filter...">
-                    </div>
+            <div class="umb-el-wrap umb-panel-buttons umb-mediapicker-upload">
+                <div class="form-search">
+                    <i class="icon-search"></i>
+                    <input type="text"
+                            ng-model="searchTerm"
+                            class="umb-search-field search-query"
+                            placeholder="Filter...">
                 </div>
 
-                <div class="pull-right">
+                <div class="upload-button">
                     <span class="btn fileinput-button" ng-class="{disabled: disabled}">
                         <i class="icon-page-up"></i>
                         <input type="file" name="files[]" multiple ng-disabled="disabled" class="uploader">

From 1353b0a5922e89a9c3dca35e05e4c6c7038aed79 Mon Sep 17 00:00:00 2001
From: Claus <claus@claus.nu>
Date: Tue, 24 Nov 2015 10:35:54 +0100
Subject: [PATCH 2/2] Reordering flex properties - recess module crashes with
 out of memory exception if they are in the other order.

---
 src/Umbraco.Web.UI.Client/src/less/panel.less | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/panel.less b/src/Umbraco.Web.UI.Client/src/less/panel.less
index d02b0d0bce..9fedbfc9eb 100644
--- a/src/Umbraco.Web.UI.Client/src/less/panel.less
+++ b/src/Umbraco.Web.UI.Client/src/less/panel.less
@@ -49,8 +49,8 @@
     display: flex;
 
     .form-search {
-        -ms-flex: 1;
         -webkit-flex: 1;
+        -ms-flex: 1;
         flex: 1;
     }