From 321bb6e868ad546bedcebbb39d4dce134404b44b Mon Sep 17 00:00:00 2001
From: Manuel Francisco Naranjo <naranjo.manuel@gmail.com>
Date: Thu, 20 Aug 2015 02:03:41 -0300
Subject: [PATCH 1/4] Honor label css class

Now that admin-config allows settings css class for the label, let's
honor it.
---
 src/javascripts/ng-admin/Crud/field/maField.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/javascripts/ng-admin/Crud/field/maField.js b/src/javascripts/ng-admin/Crud/field/maField.js
index c2d4bea02..cf76ac900 100644
--- a/src/javascripts/ng-admin/Crud/field/maField.js
+++ b/src/javascripts/ng-admin/Crud/field/maField.js
@@ -12,7 +12,7 @@ define(function (require) {
             }).join('');
         var template =
 '<div id="row-{{ field.name() }}" class="has-feedback" ng-class="getFieldValidationClass(field)">' +
-    '<label for="{{ field.name() }}" class="col-sm-2 control-label">' +
+    '<label for="{{ field.name() }}" ng-class="field.labelCssClasses()">' +
         '{{ field.label() }}<span ng-if="field.validation().required">&nbsp;*</span>&nbsp;' +
     '</label>' +
     '<div ng-if="field.editable()" ng-class="getClassesForField(field, entry)" ng-switch="field.type()">' +

From 98c18798951963adaa9e97c6619a982a8f7119d2 Mon Sep 17 00:00:00 2001
From: Manuel Francisco Naranjo <naranjo.manuel@gmail.com>
Date: Thu, 20 Aug 2015 02:04:14 -0300
Subject: [PATCH 2/4] Adding support for fieldsets and rows in create, edit and
 show

Adding basic support for fieldsets and rows in the create, edit and show
views.
---
 .../ng-admin/Crud/form/create.html            | 17 ++++++++++++--
 src/javascripts/ng-admin/Crud/form/edit.html  | 18 ++++++++++++---
 src/javascripts/ng-admin/Crud/show/show.html  | 23 +++++++++++++++----
 3 files changed, 49 insertions(+), 9 deletions(-)

diff --git a/src/javascripts/ng-admin/Crud/form/create.html b/src/javascripts/ng-admin/Crud/form/create.html
index 248a56428..86b6cd59e 100644
--- a/src/javascripts/ng-admin/Crud/form/create.html
+++ b/src/javascripts/ng-admin/Crud/form/create.html
@@ -15,8 +15,21 @@ <h1 compile="::formController.title">
 
 <div class="row" id="create-view" ng-class="::'ng-admin-entity-' + formController.entity.name()">
     <form class="col-lg-12 form-horizontal" name="formController.form" ng-submit="formController.submitCreation($event)">
-        <div class="form-field form-group" ng-repeat="field in ::formController.fields track by $index">
-            <ma-field field="::field" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>
+        <div ng-repeat="field in ::formController.fields track by $index"
+             ng-class="(field.type()==='fieldset')?'grid-form':''">
+            <div class="form-field form-group" ng-if="field.type()!=='fieldset' && field.type()!=='row'">
+                <ma-field field="::field" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>
+            </div>
+            <fieldset ng-if="field.type()==='fieldset'">
+                <legend>{{::field.label()}}</legend>
+                <div ng-repeat="row in ::field.rows()"
+                     ng-attr-data-row-span="{{::row.span()}}">
+                    <div ng-repeat="rowField in ::row.fields()"
+                         ng-attr-data-field-span="{{::rowField.attributes().fieldSpan || 1}}">
+                        <ma-field field="::rowField" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>
+                    </div>
+                </div>
+            </fieldset>
         </div>
 
         <div class="form-group">
diff --git a/src/javascripts/ng-admin/Crud/form/edit.html b/src/javascripts/ng-admin/Crud/form/edit.html
index daf6f46b9..05bc4f340 100644
--- a/src/javascripts/ng-admin/Crud/form/edit.html
+++ b/src/javascripts/ng-admin/Crud/form/edit.html
@@ -16,10 +16,22 @@ <h1 compile="::formController.title">
 
 <div class="row" id="edit-view" ng-class="::'ng-admin-entity-' + formController.entity.name()">
     <form class="col-lg-12 form-horizontal" name="formController.form" ng-submit="formController.submitEdition($event)">
-        <div class="form-field form-group" ng-repeat="field in ::formController.fields track by $index">
-            <ma-field field="::field" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>
+        <div ng-repeat="field in ::formController.fields track by $index"
+             ng-class="(field.type()==='fieldset')?'grid-form':''">
+            <div class="form-field form-group" ng-if="field.type()!=='fieldset' && field.type()!=='row'">
+                <ma-field field="::field" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>
+            </div>
+            <fieldset ng-if="field.type()==='fieldset'">
+                <legend>{{::field.label()}}</legend>
+                <div ng-repeat="row in ::field.rows()"
+                     ng-attr-data-row-span="{{::row.span()}}">
+                    <div ng-repeat="rowField in ::row.fields()"
+                         ng-attr-data-field-span="{{::rowField.attributes().fieldSpan || 1}}">
+                        <ma-field field="::rowField" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>
+                    </div>
+                </div>
+            </fieldset>
         </div>
-
         <div class="form-group">
             <div class="col-sm-offset-2 col-sm-10">
                 <button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-ok"></span> Save Changes</button>
diff --git a/src/javascripts/ng-admin/Crud/show/show.html b/src/javascripts/ng-admin/Crud/show/show.html
index 0d0309457..efad37aee 100644
--- a/src/javascripts/ng-admin/Crud/show/show.html
+++ b/src/javascripts/ng-admin/Crud/show/show.html
@@ -17,16 +17,31 @@ <h1 compile="::showController.title">
 
 
 <div class="row form-horizontal" id="show-view">
+    <div ng-repeat="field in ::showController.fields track by $index"
+         class="col-lg-12"
+         ng-class="(field.type()==='fieldset')?'grid-form':'form-group'">
 
-    <div class="col-lg-12 form-group" ng-repeat="field in ::showController.fields track by $index">
+        <!-- non fieldset -->
+        <label class="col-sm-2 control-label" ng-if="field.type()!=='fieldset'">{{ field.label() }}</label>
 
-        <label class="col-sm-2 control-label">{{ field.label() }}</label>
-
-        <div class="show-value" ng-class="::'ng-admin-field-' + field.name() + ' ' + (field.getCssClasses(entry) || 'col-sm-10 col-md-8 col-lg-7')">
+        <div ng-if="field.type()!=='fieldset'" class="show-value" ng-class="::'ng-admin-field-' + field.name() + ' ' + (field.getCssClasses(entry) || 'col-sm-10 col-md-8 col-lg-7')">
 
             <ma-column field="::field" entry="::entry" entity="::entity" datastore="::showController.dataStore"></ma-column>
 
         </div>
+
+        <fieldset ng-if="field.type()==='fieldset'">
+            <legend>{{::field.label()}}</legend>
+            <div ng-repeat="row in ::field.rows()"
+                 ng-attr-data-row-span="{{::row.span()}}">
+                <div ng-repeat="rowField in ::row.fields()"
+                     ng-attr-data-field-span="{{::rowField.attributes().fieldSpan || 1}}">
+                    <label>{{ rowField.label() }}</label>
+                    <ma-column field="::rowField" entry="::entry" entity="::entity" datastore="::showController.dataStore"></ma-column>
+                </div>
+            </div>
+
+        </fieldset>
     </div>
 
 </div>

From 77a1cb578ec5f626a231ba516ae8e356c7814771 Mon Sep 17 00:00:00 2001
From: Manuel Francisco Naranjo <naranjo.manuel@gmail.com>
Date: Tue, 25 Aug 2015 19:27:00 -0300
Subject: [PATCH 3/4] [sass] Adding necessary css classes for grid layout

Adding necessary css classes modifiers for a grid layout, special care
needs to be taken with date inputs, as those are using col-sm-4 by
default which doesn't work nice inside a grid form.

More fields may need to be fixed, by now I'm only fixing those
---
 src/sass/ng-admin.scss | 77 ++++++++++++++++++++++++++++++++++++++----
 1 file changed, 70 insertions(+), 7 deletions(-)

diff --git a/src/sass/ng-admin.scss b/src/sass/ng-admin.scss
index 33a0621dc..6beef7e55 100644
--- a/src/sass/ng-admin.scss
+++ b/src/sass/ng-admin.scss
@@ -41,8 +41,8 @@ ul.collapsible {
 }
 
 /**
-* Dashboard
-*/
+ * Dashboard
+ */
 .dashboard-starter {
     margin-bottom: 30px;
 }
@@ -93,8 +93,8 @@ ul.collapsible {
 }
 
 /**
-* Grid
-*/
+ * Grid
+ */
 
 #page-wrapper .page-header {
     margin: 10px 0 15px;
@@ -125,7 +125,7 @@ ma-view-actions {
             }
 
             .btn-default {
-              height: 34px;
+                height: 34px;
             }
         }
 
@@ -198,8 +198,8 @@ div.bottom-loader {
 }
 
 /**
-* Edition form
-*/
+ * Edition form
+ */
 .form-horizontal {
 
     .has-feedback .form-control.ui-select-toggle {
@@ -268,3 +268,66 @@ div.bottom-loader {
         border-radius: 4px;
     }
 }
+
+&#show-view, {
+    fieldset {
+        .row-fluid {
+            .form-group {
+                .form-control {
+                    border: initial;
+                    border-radius: initial;
+                    box-shadow: initial;
+                    padding: initial;
+                }
+            }
+        }
+    }
+}
+&#show-view, &#create-view, &#edit-view {
+    fieldset {
+        padding-bottom: 5px;
+
+        legend {
+            border: none;
+            border-bottom: 4px solid #404040;
+            color: #404040;
+            font-size: 18px;
+            font-weight: bold;
+            padding-bottom: 5px;
+            position: static;
+            width: 100%;
+            margin-bottom: 0px;
+        }
+
+        .row-fluid {
+            .form-group {
+                margin-left: initial;
+                margin-right: initial;
+                margin-bottom: initial;
+
+                padding: 8px;
+            }
+
+            ma-date-field.col-sm-4 {
+                width: 100%; // force width;
+                button {
+                    padding-bottom: 7px; // fix alignment
+                }
+            }
+        }
+
+        @media only screen and (min-width: 700px) {
+            .row-fluid {
+                .form-group {
+                    border: initial;
+                    border-right: 1px solid #333333;
+                    border-bottom: 1px solid #333333;
+                }
+
+                .form-group:last-child {
+                    border-right: initial;
+                }
+            }
+        }
+    }
+}

From c3ce08dd3dbabb18985c3a5f3a5fedd73d67a36e Mon Sep 17 00:00:00 2001
From: Manuel Francisco Naranjo <naranjo.manuel@gmail.com>
Date: Tue, 25 Aug 2015 19:28:01 -0300
Subject: [PATCH 4/4] [grid] Adding necessary stuff for grid forms

Adding necessary changes to views so grid-forms can be used.
---
 .../ng-admin/Crud/form/create.html            | 14 ++++++-----
 src/javascripts/ng-admin/Crud/form/edit.html  | 14 ++++++-----
 src/javascripts/ng-admin/Crud/show/show.html  | 24 ++++++++++++-------
 3 files changed, 31 insertions(+), 21 deletions(-)

diff --git a/src/javascripts/ng-admin/Crud/form/create.html b/src/javascripts/ng-admin/Crud/form/create.html
index 86b6cd59e..33329e735 100644
--- a/src/javascripts/ng-admin/Crud/form/create.html
+++ b/src/javascripts/ng-admin/Crud/form/create.html
@@ -15,17 +15,19 @@ <h1 compile="::formController.title">
 
 <div class="row" id="create-view" ng-class="::'ng-admin-entity-' + formController.entity.name()">
     <form class="col-lg-12 form-horizontal" name="formController.form" ng-submit="formController.submitCreation($event)">
-        <div ng-repeat="field in ::formController.fields track by $index"
-             ng-class="(field.type()==='fieldset')?'grid-form':''">
-            <div class="form-field form-group" ng-if="field.type()!=='fieldset' && field.type()!=='row'">
+        <div ng-repeat="field in ::formController.fields track by $index">
+
+            <div class="form-field form-group" ng-if="!field.isFieldset()">
                 <ma-field field="::field" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>
             </div>
-            <fieldset ng-if="field.type()==='fieldset'">
+
+            <fieldset ng-if="field.isFieldset()">
                 <legend>{{::field.label()}}</legend>
                 <div ng-repeat="row in ::field.rows()"
-                     ng-attr-data-row-span="{{::row.span()}}">
+                     class="row-fluid" ng-class="::row.getClasses()">
                     <div ng-repeat="rowField in ::row.fields()"
-                         ng-attr-data-field-span="{{::rowField.attributes().fieldSpan || 1}}">
+                         class="form-group"
+                         ng-class="::row.editCssSpanClass(rowField)">
                         <ma-field field="::rowField" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>
                     </div>
                 </div>
diff --git a/src/javascripts/ng-admin/Crud/form/edit.html b/src/javascripts/ng-admin/Crud/form/edit.html
index 05bc4f340..7e6426bca 100644
--- a/src/javascripts/ng-admin/Crud/form/edit.html
+++ b/src/javascripts/ng-admin/Crud/form/edit.html
@@ -16,17 +16,19 @@ <h1 compile="::formController.title">
 
 <div class="row" id="edit-view" ng-class="::'ng-admin-entity-' + formController.entity.name()">
     <form class="col-lg-12 form-horizontal" name="formController.form" ng-submit="formController.submitEdition($event)">
-        <div ng-repeat="field in ::formController.fields track by $index"
-             ng-class="(field.type()==='fieldset')?'grid-form':''">
-            <div class="form-field form-group" ng-if="field.type()!=='fieldset' && field.type()!=='row'">
+        <div ng-repeat="field in ::formController.fields track by $index">
+
+            <div class="form-field form-group" ng-if="!field.isFieldset()">
                 <ma-field field="::field" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>
             </div>
-            <fieldset ng-if="field.type()==='fieldset'">
+
+            <fieldset ng-if="field.isFieldset()">
                 <legend>{{::field.label()}}</legend>
                 <div ng-repeat="row in ::field.rows()"
-                     ng-attr-data-row-span="{{::row.span()}}">
+                     class="row-fluid" ng-class="::row.getClasses()">
                     <div ng-repeat="rowField in ::row.fields()"
-                         ng-attr-data-field-span="{{::rowField.attributes().fieldSpan || 1}}">
+                         class="form-group"
+                         ng-class="::row.editCssSpanClass(rowField)">
                         <ma-field field="::rowField" entry="entry" entity="::entity" form="formController.form" datastore="::formController.dataStore"></ma-field>
                     </div>
                 </div>
diff --git a/src/javascripts/ng-admin/Crud/show/show.html b/src/javascripts/ng-admin/Crud/show/show.html
index efad37aee..e17e0c3a2 100644
--- a/src/javascripts/ng-admin/Crud/show/show.html
+++ b/src/javascripts/ng-admin/Crud/show/show.html
@@ -18,26 +18,32 @@ <h1 compile="::showController.title">
 
 <div class="row form-horizontal" id="show-view">
     <div ng-repeat="field in ::showController.fields track by $index"
-         class="col-lg-12"
-         ng-class="(field.type()==='fieldset')?'grid-form':'form-group'">
+         class="col-lg-12 form-group">
 
         <!-- non fieldset -->
-        <label class="col-sm-2 control-label" ng-if="field.type()!=='fieldset'">{{ field.label() }}</label>
+        <label class="col-sm-2 control-label" ng-if="!field.isFieldset()">{{ field.label() }}</label>
 
-        <div ng-if="field.type()!=='fieldset'" class="show-value" ng-class="::'ng-admin-field-' + field.name() + ' ' + (field.getCssClasses(entry) || 'col-sm-10 col-md-8 col-lg-7')">
+        <div ng-if="!field.isFieldset()" class="show-value" ng-class="::'ng-admin-field-' + field.name() + ' ' + (field.getCssClasses(entry) || 'col-sm-10 col-md-8 col-lg-7')">
 
             <ma-column field="::field" entry="::entry" entity="::entity" datastore="::showController.dataStore"></ma-column>
 
         </div>
 
-        <fieldset ng-if="field.type()==='fieldset'">
+        <fieldset ng-if="field.isFieldset()">
             <legend>{{::field.label()}}</legend>
             <div ng-repeat="row in ::field.rows()"
-                 ng-attr-data-row-span="{{::row.span()}}">
+                 class="row-fluid"
+                 ng-class="row.getClasses()">
                 <div ng-repeat="rowField in ::row.fields()"
-                     ng-attr-data-field-span="{{::rowField.attributes().fieldSpan || 1}}">
-                    <label>{{ rowField.label() }}</label>
-                    <ma-column field="::rowField" entry="::entry" entity="::entity" datastore="::showController.dataStore"></ma-column>
+                     class="form-group"
+                     ng-class="::row.cssSpanClass(rowField)">
+                    <label for="::{{ rowField.name() }}">{{ rowField.label() }}</label>
+                    <div class="form-control">
+                        <ma-column field="::rowField" entry="::entry"
+                                   entity="::entity"
+                                   datastore="::showController.dataStore">
+                        </ma-column>
+                    </div>
                 </div>
             </div>