add bg boxes to content type editors

src/Umbraco.Web.UI.Client/src/views/documenttypes/views/listview/listview.html

@@ -1,19 +1,18 @@
-<div class="sub-view-columns">
-
-    <div class="sub-view-column-left">
-        <h5><localize key="contentTypeEditor_enableListViewHeading" /></h5>
-        <small><localize key="contentTypeEditor_enableListViewDescription" /></small>
-    </div>
-
-    <div class="sub-view-column-right">
-
-      <umb-list-view-settings
-        enable-list-view="model.isContainer"
-        model-alias="model.alias"
-        list-view-name="model.listViewEditorName"
-        content-type="documentType">
-      </umb-list-view-settings>
-
-    </div>
-
-</div>
+<umb-box>
+    <umb-box-content>
+        <div class="sub-view-columns">
+            <div class="sub-view-column-left">
+                <h5><localize key="contentTypeEditor_enableListViewHeading" /></h5>
+                <small><localize key="contentTypeEditor_enableListViewDescription" /></small>
+            </div>
+            <div class="sub-view-column-right">
+                <umb-list-view-settings 
+                    enable-list-view="model.isContainer" 
+                    model-alias="model.alias" 
+                    list-view-name="model.listViewEditorName"
+                    content-type="documentType">
+                </umb-list-view-settings>
+            </div>
+        </div>
+    </umb-box-content>
+</umb-box>

src/Umbraco.Web.UI.Client/src/views/documenttypes/views/permissions/permissions.html

@@ -1,60 +1,65 @@
 <div ng-controller="Umbraco.Editors.DocumentType.PermissionsController as vm">
 
-    <div class="sub-view-columns">
+    <umb-box>
+        <umb-box-content>
 
-        <div class="sub-view-column-left">
-            <h5><localize key="contentTypeEditor_allowAsRootHeading" /></h5>
-            <small><localize key="contentTypeEditor_allowAsRootDescription" /></small>
-        </div>
-        <div class="sub-view-column-right">
-            <label class="checkbox no-indent">
-                <input type="checkbox" ng-model="model.allowAsRoot" hotkey="alt+shift+r" />
-                <localize key="contentTypeEditor_allowAsRootCheckbox" />
-            </label>
-        </div>
+            <div class="sub-view-columns">
 
-    </div>
+                <div class="sub-view-column-left">
+                    <h5><localize key="contentTypeEditor_allowAsRootHeading" /></h5>
+                    <small><localize key="contentTypeEditor_allowAsRootDescription" /></small>
+                </div>
+                <div class="sub-view-column-right">
+                    <label class="checkbox no-indent">
+                        <input type="checkbox" ng-model="model.allowAsRoot" hotkey="alt+shift+r" />
+                        <localize key="contentTypeEditor_allowAsRootCheckbox" />
+                    </label>
+                </div>
 
-    <div class="sub-view-columns">
+            </div>
 
-        <div class="sub-view-column-left">
-            <h5><localize key="contentTypeEditor_childNodesHeading" /></h5>
-            <small><localize key="contentTypeEditor_childNodesDescription" /></small>
-        </div>
+            <div class="sub-view-columns">
 
-        <div class="sub-view-column-right">
-            <umb-child-selector selected-children="vm.selectedChildren"
-                                available-children="vm.contentTypes"
-                                parent-name="model.name"
-                                parent-icon="model.icon"
-                                parent-id="model.id"
-                                on-add="vm.addChild"
-                                on-remove="vm.removeChild">
-            </umb-child-selector>
+                <div class="sub-view-column-left">
+                    <h5><localize key="contentTypeEditor_childNodesHeading" /></h5>
+                    <small><localize key="contentTypeEditor_childNodesDescription" /></small>
+                </div>
 
-            <umb-overlay ng-if="vm.childNodeSelectorOverlay.show"
-                         model="vm.childNodeSelectorOverlay"
-                         position="target"
-                         view="vm.childNodeSelectorOverlay.view">
-            </umb-overlay>
+                <div class="sub-view-column-right">
+                    <umb-child-selector selected-children="vm.selectedChildren"
+                                        available-children="vm.contentTypes"
+                                        parent-name="model.name"
+                                        parent-icon="model.icon"
+                                        parent-id="model.id"
+                                        on-add="vm.addChild"
+                                        on-remove="vm.removeChild">
+                    </umb-child-selector>
 
-        </div>
+                    <umb-overlay ng-if="vm.childNodeSelectorOverlay.show"
+                                model="vm.childNodeSelectorOverlay"
+                                position="target"
+                                view="vm.childNodeSelectorOverlay.view">
+                    </umb-overlay>
 
-    </div>
+                </div>
 
-    <div class="sub-view-columns">
+            </div>
 
-        <div class="sub-view-column-left">
-            <h5>Content Type Variation</h5>
-            <small>Define the rules for how this content type's properties can be varied</small>
-        </div>
-        <div class="sub-view-column-right">
-            <label class="checkbox no-indent">
-                <input type="checkbox" ng-model="model.allowCultureVariant" />
-                Allow varying by Culture
-            </label>
-        </div>
+            <div class="sub-view-columns">
 
-    </div>
+                <div class="sub-view-column-left">
+                    <h5>Content Type Variation</h5>
+                    <small>Define the rules for how this content type's properties can be varied</small>
+                </div>
+                <div class="sub-view-column-right">
+                    <label class="checkbox no-indent">
+                        <input type="checkbox" ng-model="model.allowCultureVariant" />
+                        Allow varying by Culture
+                    </label>
+                </div>
 
+            </div>
+            
+        </umb-box-content>
+    </umb-box>
 </div>

src/Umbraco.Web.UI.Client/src/views/documenttypes/views/templates/templates.html

@@ -1,23 +1,27 @@
-<div class="sub-view-columns" ng-controller="Umbraco.Editors.DocumentType.TemplatesController as vm">
+<div ng-controller="Umbraco.Editors.DocumentType.TemplatesController as vm">
+    <umb-box>
+        <umb-box-content>
+            <div class="sub-view-columns">
 
-    <div class="sub-view-column-left">
-        <h5><localize key="contentTypeEditor_allowedTemplatesHeading" /></h5>
-        <small><localize key="contentTypeEditor_allowedTemplatesDescription" /></small>
-    </div>
-
-    <div class="sub-view-column-right">
-
-        <umb-grid-selector
-                ng-if="vm.availableTemplates"
-                selected-items="model.allowedTemplates"
-                available-items="vm.availableTemplates"
-                default-item="model.defaultTemplate"
-                item-name="template"
-                name="model.name"
-                alias="model.alias"
-                update-placeholder="vm.updateTemplatePlaceholder">
-        </umb-grid-selector>
-
-    </div>
+                <div class="sub-view-column-left">
+                    <h5><localize key="contentTypeEditor_allowedTemplatesHeading" /></h5>
+                    <small><localize key="contentTypeEditor_allowedTemplatesDescription" /></small>
+                </div>
+                
+                <div class="sub-view-column-right">
+                    <umb-grid-selector
+                        ng-if="vm.availableTemplates"
+                        selected-items="model.allowedTemplates"
+                        available-items="vm.availableTemplates"
+                        default-item="model.defaultTemplate"
+                        item-name="template"
+                        name="model.name"
+                        alias="model.alias"
+                        update-placeholder="vm.updateTemplatePlaceholder">
+                    </umb-grid-selector>
+                </div>
 
+            </div>
+        </umb-box-content>
+    </umb-box>
 </div>

src/Umbraco.Web.UI.Client/src/views/mediatypes/views/listview/listview.html

@@ -1,19 +1,18 @@
-<div class="sub-view-columns">
-
-    <div class="sub-view-column-left">
-        <h5><localize key="contentTypeEditor_enableListViewHeading" /></h5>
-        <small><localize key="contentTypeEditor_enableListViewDescription" /></small>
-    </div>
-
-    <div class="sub-view-column-right">
-
-      <umb-list-view-settings
-        enable-list-view="model.isContainer"
-        model-alias="model.alias"
-        list-view-name="model.listViewEditorName"
-        content-type="mediaType">
-      </umb-list-view-settings>
-
-    </div>
-
-</div>
+<umb-box>
+    <umb-box-content>
+        <div class="sub-view-columns">
+            <div class="sub-view-column-left">
+                <h5><localize key="contentTypeEditor_enableListViewHeading" /></h5>
+                <small><localize key="contentTypeEditor_enableListViewDescription" /></small>
+            </div>
+            <div class="sub-view-column-right">
+                <umb-list-view-settings 
+                    enable-list-view="model.isContainer" 
+                    model-alias="model.alias" 
+                    list-view-name="model.listViewEditorName"
+                    content-type="mediaType">
+                </umb-list-view-settings>
+            </div>
+        </div>
+    </umb-box-content>
+</umb-box>

src/Umbraco.Web.UI.Client/src/views/mediatypes/views/permissions/permissions.html

@@ -1,49 +1,51 @@
 <div ng-controller="Umbraco.Editors.MediaType.PermissionsController as vm">
+    <umb-box>
+        <umb-box-content>
+            <div class="sub-view-columns">
 
-    <div class="sub-view-columns">
-
-        <div class="sub-view-column-left">
-            <h5><localize key="contentTypeEditor_allowAsRootHeading" /></h5>
-            <small><localize key="contentTypeEditor_allowAsRootDescription" /></small>
-        </div>
-        <div class="sub-view-column-right">
-            <label class="checkbox no-indent" >
-                <input type="checkbox" ng-model="model.allowAsRoot" hotkey="alt+shift+r" />
-                <localize key="contentTypeEditor_allowAsRootCheckbox" />
-            </label>
-        </div>
-
-    </div>
-
-    <div class="sub-view-columns">
-
-        <div class="sub-view-column-left">
-            <h5><localize key="contentTypeEditor_childNodesHeading" /></h5>
-            <small><localize key="contentTypeEditor_childNodesDescription" /></small>
-        </div>
-
-        <div class="sub-view-column-right">
-
-            <umb-child-selector
-                    selected-children="vm.selectedChildren"
-                    available-children="vm.mediaTypes"
-                    parent-name="model.name"
-                    parent-icon="model.icon"
-                    parent-id="model.id"
-                    on-add="vm.addChild"
-                    on-remove="vm.removeChild">
-            </umb-child-selector>
-
-            <umb-overlay
-               ng-if="vm.childNodeSelectorOverlay.show"
-               model="vm.childNodeSelectorOverlay"
-               position="target"
-               view="vm.childNodeSelectorOverlay.view">
-            </umb-overlay>
-
-
-        </div>
-
-    </div>
-
+                <div class="sub-view-column-left">
+                    <h5><localize key="contentTypeEditor_allowAsRootHeading" /></h5>
+                    <small><localize key="contentTypeEditor_allowAsRootDescription" /></small>
+                </div>
+                <div class="sub-view-column-right">
+                    <label class="checkbox no-indent" >
+                        <input type="checkbox" ng-model="model.allowAsRoot" hotkey="alt+shift+r" />
+                        <localize key="contentTypeEditor_allowAsRootCheckbox" />
+                    </label>
+                </div>
+        
+            </div>
+        
+            <div class="sub-view-columns">
+        
+                <div class="sub-view-column-left">
+                    <h5><localize key="contentTypeEditor_childNodesHeading" /></h5>
+                    <small><localize key="contentTypeEditor_childNodesDescription" /></small>
+                </div>
+        
+                <div class="sub-view-column-right">
+        
+                    <umb-child-selector
+                            selected-children="vm.selectedChildren"
+                            available-children="vm.mediaTypes"
+                            parent-name="model.name"
+                            parent-icon="model.icon"
+                            parent-id="model.id"
+                            on-add="vm.addChild"
+                            on-remove="vm.removeChild">
+                    </umb-child-selector>
+        
+                    <umb-overlay
+                        ng-if="vm.childNodeSelectorOverlay.show"
+                        model="vm.childNodeSelectorOverlay"
+                        position="target"
+                        view="vm.childNodeSelectorOverlay.view">
+                    </umb-overlay>
+        
+        
+                </div>
+        
+            </div>
+        </umb-box-content>
+    </umb-box>
 </div>