Separate remove button and label for settings and styles in Grid Layout

It's inconvenient that the click area for the remove button laps over the label of settings and styles in the Grid Layout property editor. Simply as the editor may remove the style/setting by accident – and especially since there isn't an undo option.

Known issue: Linebreak of long text labels doesn't appear pretty, but this is cosmetic and can be fixed.

src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.prevalues.html

@@ -117,11 +117,10 @@
 
                 <li ng-repeat="configValue in model.value.config">
                     <i class="icon icon-navigation handle" aria-hidden="true"></i>
-
                     <button type="button" class="btn-link" ng-click="vm.removeConfigValue(model.value.config, $index)">
                         <i class="icon icon-delete red" aria-hidden="true"></i>
-                        {{configValue.label}}
                     </button>
+                    <span>{{configValue.label}}</span>
                 </li>
             </ul>
 
@@ -145,12 +144,10 @@
 
                 <li ng-repeat="style in model.value.styles">
                     <i class="icon icon-navigation handle" aria-hidden="true"></i>
-
                     <button type="button" class="btn-link" ng-click="vm.removeConfigValue(model.value.styles, $index)">
                         <i class="icon icon-delete red" aria-hidden="true"></i>
-                        {{style.label}}
                     </button>
-
+                    <span>{{style.label}}</span>
                 </li>
             </ul>