From cbc5aca26a8740b850e54d5d8aa6a97ce9454c09 Mon Sep 17 00:00:00 2001
From: Christopher Joe <cjoe@silverstripe.com>
Date: Mon, 27 Feb 2017 16:57:52 +1300
Subject: [PATCH] Fix add fieldgroup specific flexbox styles to the inner
 fields

---
 admin/client/dist/styles/bundle.css           | 31 +++++++++++++++++++
 .../src/components/FieldGroup/FieldGroup.scss | 21 +++++++++++++
 2 files changed, 52 insertions(+)

diff --git a/admin/client/dist/styles/bundle.css b/admin/client/dist/styles/bundle.css
index 3ed0c2817..466ffe0e3 100644
--- a/admin/client/dist/styles/bundle.css
+++ b/admin/client/dist/styles/bundle.css
@@ -14943,6 +14943,37 @@ div.TreeDropdownField a.jstree-loading .jstree-pageicon{
   color:#66727d;
 }
 
+.fieldgroup--fill-width>.form__field-holder>.fieldgroup{
+  display:-webkit-box;
+  display:-ms-flexbox;
+  display:flex;
+  width:100%;
+  -webkit-box-orient:horizontal;
+  -webkit-box-direction:normal;
+      -ms-flex-direction:row;
+          flex-direction:row;
+}
+
+.fieldgroup--fill-width>.form__field-holder>.fieldgroup>.field:last-child{
+  margin-right:0;
+}
+
+.fieldgroup--fill-height>.form__field-holder>.fieldgroup{
+  display:-webkit-box;
+  display:-ms-flexbox;
+  display:flex;
+  height:100%;
+  min-height:0;
+  -webkit-box-orient:vertical;
+  -webkit-box-direction:normal;
+      -ms-flex-direction:column;
+          flex-direction:column;
+}
+
+.fieldgroup--fill-height>.form__field-holder>.fieldgroup>.field:last-child{
+  margin-bottom:0;
+}
+
 .list-group{
   margin-left:-1.5385rem;
   margin-right:-1.5385rem;
diff --git a/admin/client/src/components/FieldGroup/FieldGroup.scss b/admin/client/src/components/FieldGroup/FieldGroup.scss
index 10ede43af..aff059dd9 100644
--- a/admin/client/src/components/FieldGroup/FieldGroup.scss
+++ b/admin/client/src/components/FieldGroup/FieldGroup.scss
@@ -13,3 +13,24 @@
     }
   }
 }
+
+.fieldgroup--fill-width > .form__field-holder > .fieldgroup {
+  display: flex;
+  width: 100%;
+  flex-direction: row;
+
+  > .field:last-child {
+    margin-right: 0;
+  }
+}
+
+.fieldgroup--fill-height > .form__field-holder > .fieldgroup {
+  display: flex;
+  height: 100%;
+  min-height: 0; // See https://www.fxsitecompat.com/en-GB/docs/2014/initial-value-of-min-width-height-on-flex-items-has-been-reverted-to-auto/
+  flex-direction: column;
+
+  > .field:last-child {
+    margin-bottom: 0;
+  }
+}