diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowconfig.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowconfig.controller.js
index 7f7b817b8a..09fa263354 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowconfig.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowconfig.controller.js
@@ -1,8 +1,8 @@
 function RowConfigController($scope) {
-    
-    $scope.currentRow = angular.copy($scope.dialogOptions.currentRow);
-    $scope.editors = $scope.dialogOptions.editors;
-    $scope.columns = $scope.dialogOptions.columns;
+
+    $scope.currentRow = $scope.model.currentRow;
+    $scope.editors = $scope.model.editors;
+    $scope.columns = $scope.model.columns;
 
     $scope.scaleUp = function(section, max, overflow) {
         var add = 1;
@@ -88,10 +88,6 @@ function RowConfigController($scope) {
         }
     }, true);
 
-    $scope.complete = function () {
-        angular.extend($scope.dialogOptions.currentRow, $scope.currentRow);
-        $scope.close();
-    }
 }
 
-angular.module("umbraco").controller("Umbraco.PropertyEditors.GridPrevalueEditor.RowConfigController", RowConfigController);
\ No newline at end of file
+angular.module("umbraco").controller("Umbraco.PropertyEditors.GridPrevalueEditor.RowConfigController", RowConfigController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowconfig.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowconfig.html
index 63e250645f..b1343a960b 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowconfig.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowconfig.html
@@ -1,102 +1,87 @@
-<div class="umb-panel usky-grid usky-grid-configuration" 
-ng-controller="Umbraco.PropertyEditors.GridPrevalueEditor.RowConfigController">
-    <div class="umb-panel-body no-header with-footer">
-        
-        <div class="umb-forms-settings">
+<div class="usky-grid usky-grid-configuration" ng-controller="Umbraco.PropertyEditors.GridPrevalueEditor.RowConfigController">
 
-            <h5><localize key="grid_addRowConfiguration" /></h5>
-            <p><localize key="grid_addRowConfigurationDetail" /></p>
-            
-            <div class="alert alert-warn ng-scope" ng-show="nameChanged">
-                Modifying a row configuration name will result in loss of
-                data for any existing content that is based on this configuration.
-            </div>
+   <div class="umb-form-settings">
 
-            <umb-control-group label="@general_name">
-                <input type="text" ng-model="currentRow.name" />
-            </umb-control-group>
+      <h5><localize key="grid_addRowConfiguration" /></h5>
+      <p><localize key="grid_addRowConfigurationDetail" /></p>
 
-            <div class="uSky-templates-template"
-                 style="margin: 0; width: 350px; position: relative;">
+      <div class="alert alert-warn ng-scope" ng-show="nameChanged">
+          Modifying a row configuration name will result in loss of
+          data for any existing content that is based on this configuration.
+      </div>
 
-                 <div class="tb" style="height: auto; border: none !important; background: none">
-                     <div class="tr">
+      <umb-control-group label="@general_name">
+          <input type="text" ng-model="currentRow.name" />
+      </umb-control-group>
 
-                         <a class="td uSky-templates-column"
-                             ng-class="{last:$last, selected:cell==currentCell}"
-                             ng-repeat="cell in currentRow.areas"
-                             ng-click="configureCell(cell, currentRow)"
-                             ng-style="{width: percentage(cell.grid) + '%'}">
-                         </a>
+      <div class="uSky-templates-template"
+           style="margin: 0; width: 350px; position: relative;">
 
-                         <a class="td uSky-templates-column add" 
-                             ng-click="configureCell(undefined, currentRow)"
-                             ng-style="{width: percentage(availableRowSpace) + '%'}">
-                             <i class="icon icon-add"></i>
-                         </a>
-                     </div>
-                 </div>
-            </div>
+           <div class="tb" style="height: auto; border: none !important; background: none">
+               <div class="tr">
 
-            <div ng-if="currentCell" style="padding-bottom: 50px;">
+                   <a class="td uSky-templates-column"
+                       ng-class="{last:$last, selected:cell==currentCell}"
+                       ng-repeat="cell in currentRow.areas"
+                       ng-click="configureCell(cell, currentRow)"
+                       ng-style="{width: percentage(cell.grid) + '%'}">
+                   </a>
 
-                <umb-control-group label="@general_width">
-                    <div class="grid-size-scaler" >
-                        <div class="grid-size-scaler">
-                            <a href ng-click="scaleDown(currentCell)">
-                                <i class="icon icon-remove"></i>
-                            </a>
-                            {{currentCell.grid}}
-                            <a href ng-click="scaleUp(currentCell, availableRowSpace, true)">
-                                <i class="icon icon-add"></i>
-                            </a>
-                        </div>
-                    </div>
-                </umb-control-group>
+                   <a class="td uSky-templates-column add"
+                       ng-click="configureCell(undefined, currentRow)"
+                       ng-style="{width: percentage(availableRowSpace) + '%'}">
+                       <i class="icon icon-add"></i>
+                   </a>
+               </div>
+           </div>
+      </div>
+
+      <div ng-if="currentCell" style="padding-bottom: 50px;">
+
+          <umb-control-group label="@general_width">
+             <div class="grid-size-scaler" >
+                  <div class="grid-size-scaler">
+                      <a href ng-click="scaleDown(currentCell)">
+                          <i class="icon icon-remove"></i>
+                      </a>
+                      {{currentCell.grid}}
+                      <a href ng-click="scaleUp(currentCell, availableRowSpace, true)">
+                          <i class="icon icon-add"></i>
+                      </a>
+                  </div>
+             </div>
+          </umb-control-group>
 
 
-                <umb-control-group hide-label="true">
-                    <ul class="unstyled">
-                        <li>
-                            <label>
-                                <input type="checkbox"
-                                    ng-model="currentCell.allowAll"
-                                    ng-checked="currentCell.allowed === undefined"
-                                    ng-change="toggleCollection(currentCell.allowed, currentCell.allowAll)" />
-                                    <localize key="grid_allowAllEditors"/>
-                            </label>
-                        </li>
-                    </ul>
+          <umb-control-group hide-label="true">
+             <ul class="unstyled">
+                  <li>
+                      <label>
+                          <input type="checkbox"
+                              ng-model="currentCell.allowAll"
+                              ng-checked="currentCell.allowed === undefined"
+                              ng-change="toggleCollection(currentCell.allowed, currentCell.allowAll)" />
+                              <localize key="grid_allowAllEditors"/>
+                      </label>
+                  </li>
+             </ul>
 
-                    <div ng-if="currentCell.allowAll === false">
-                        <hr />
-                        <ul class="unstyled">
-                            <li ng-repeat="editor in editors">
-                                <label>
-                                    <input type="checkbox"
-                                        checklist-model="currentCell.allowed"
-                                        checklist-value="editor.alias">
-                                         <i class="icon {{editor.icon}}"></i> {{editor.name}}
-                                </label>
-                            </li>
-                        </ul>
-                    </div>
-                </umb-control-group>
-            </div>            
-        </div>
-    </div>
+             <div ng-if="currentCell.allowAll === false">
+                  <hr />
+                  <ul class="unstyled">
+                      <li ng-repeat="editor in editors">
+                          <label>
+                              <input type="checkbox"
+                                  checklist-model="currentCell.allowed"
+                                  checklist-value="editor.alias">
+                                   <i class="icon {{editor.icon}}"></i> {{editor.name}}
+                          </label>
+                      </li>
+                  </ul>
+             </div>
+          </umb-control-group>
+      </div>
 
-    <div class="umb-panel-footer">
-        <div class="umb-el-wrap umb-panel-buttons">
-            <div class="btn-toolbar umb-btn-toolbar pull-right">
-                <a href ng-click="close()" class="btn btn-link">
-                    <localize key="general_cancel">Cancel</localize>
-                </a>
-                
-                <a href ng-click="complete()" class="btn btn-primary">
-                    <localize key="general_ok" class="ng-isolate-scope ng-scope">Done</localize>
-                </a>
-            </div>
-        </div>
-    </div>
-</div>
\ No newline at end of file
+   </div>
+
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.prevalues.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.prevalues.controller.js
index a09fd9f6e7..7fb4dad218 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.prevalues.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.prevalues.controller.js
@@ -120,26 +120,38 @@ angular.module("umbraco")
             Row
         *****************/
 
-        $scope.configureLayout = function(layout){
+        $scope.configureLayout = function(layout) {
 
-            if(layout === undefined){
-                 layout = {
-                     name: "",
-                     areas:[
+           var layoutsCopy = angular.copy($scope.model.value.layouts);
 
-                     ]
-                 };
-                 $scope.model.value.layouts.push(layout);
-            }
+           if(layout === undefined){
+                layout = {
+                    name: "",
+                    areas:[
+
+                    ]
+                };
+                $scope.model.value.layouts.push(layout);
+           }
+
+           $scope.rowConfigOverlay = {};
+           $scope.rowConfigOverlay.view = "views/propertyEditors/grid/dialogs/rowconfig.html";
+           $scope.rowConfigOverlay.currentRow = layout;
+           $scope.rowConfigOverlay.editors = $scope.editors;
+           $scope.rowConfigOverlay.columns = $scope.model.value.columns;
+           $scope.rowConfigOverlay.show = true;
+
+           $scope.rowConfigOverlay.submit = function(model) {
+             $scope.rowConfigOverlay.show = false;
+             $scope.rowConfigOverlay = null;
+           };
+
+           $scope.rowConfigOverlay.close = function(oldModel) {
+             $scope.model.value.layouts = layoutsCopy;
+             $scope.rowConfigOverlay.show = false;
+             $scope.rowConfigOverlay = null;
+           };
 
-            dialogService.open(
-                {
-                    template: "views/propertyEditors/grid/dialogs/rowconfig.html",
-                    currentRow: layout,
-                    editors: $scope.editors,
-                    columns: $scope.model.value.columns
-                }
-            );
         };
 
         //var rowDeletesPending = false;
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.prevalues.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.prevalues.html
index d09d170fa1..92e9b17096 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.prevalues.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.prevalues.html
@@ -168,4 +168,11 @@
       position="right">
     </umb-overlay>
 
+    <umb-overlay
+      ng-if="rowConfigOverlay.show"
+      model="rowConfigOverlay"
+      view="rowConfigOverlay.view"
+      position="right">
+    </umb-overlay>
+
 </div>