From c8d837bb978999aa28e2be3d8efe0d33de1efb4a Mon Sep 17 00:00:00 2001
From: BatJan <1932158+BatJan@users.noreply.github.com>
Date: Sat, 3 Oct 2020 00:40:05 +0200
Subject: [PATCH] Change div with ng-click to button and add fallback for
 dictionary item

---
 .../grid/dialogs/layoutconfig.html            | 26 +++++++++----------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/layoutconfig.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/layoutconfig.html
index 7eb1fe1913..6ff18e83ad 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/layoutconfig.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/layoutconfig.html
@@ -20,7 +20,7 @@
                         <div class="umb-forms-settings form-horizontal">
 
                             <p>
-                                <localize key="grid_addGridLayoutDetail"/>
+                                <localize key="grid_addGridLayoutDetail">Adjust the layout by setting column widths and adding additional sections</localize>
                             </p>
 
                             <umb-control-group label="@general_name">
@@ -108,27 +108,27 @@
                                                                       on-change="selectRow(currentSection, row)">
                                                         </umb-checkbox>
 
-                                                        <div
+                                                        <button
                                                             ng-click="row.allowed = !row.allowed; selectRow(currentSection, row)"
-                                                            class="flex flex-auto cursor-pointer">
+                                                            class="btn-reset flex flex-auto">
 
-                                                            <div class="preview-rows columns" style="margin-top: auto;">
-                                                                <div class="preview-row">
-                                                                    <div class="preview-col"
+                                                            <span class="preview-rows columns" style="margin-top: auto;">
+                                                                <span class="preview-row">
+                                                                    <span class="preview-col"
                                                                          ng-class="{last:$last}"
                                                                          ng-repeat="area in row.areas"
                                                                          ng-style="{width: percentage(area.grid) + '%'}">
 
-                                                                        <div class="preview-cell"></div>
-                                                                    </div>
-                                                                </div>
-                                                            </div>
+                                                                        <span class="preview-cell"></span>
+                                                                    </span>
+                                                                </span>
+                                                            </span>
 
-                                                            <div>
+                                                            <span>
                                                                 {{row.name}}<br/>
                                                                 <small>{{row.areas.length}} cells</small>
-                                                            </div>
-                                                        </div>
+                                                            </span>
+                                                        </button>
 
                                                     </div>