From 1125644eb3dbb4193c3fa471a2f8c6ccb24cebad Mon Sep 17 00:00:00 2001
From: Kevin Meilander <kevinrm@emergentsoftware.net>
Date: Sun, 31 Oct 2021 10:40:06 -0500
Subject: [PATCH] in media selection, made folder name clickable to select into
 a folder.  Added not allowed cursor on not allowed items.

---
 .../src/less/components/umb-media-grid.less   | 11 +++++++++++
 .../src/views/components/umb-media-grid.html  | 19 +++++++++++--------
 2 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-media-grid.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-media-grid.less
index 71be01e6ff..d25fe62c08 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-media-grid.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-media-grid.less
@@ -225,6 +225,17 @@
 .umb-media-grid__list-item.selected, .umb-media-grid__list-item.selected:hover, .umb-media-grid__list-item.selected:focus {
     border: 2px solid #f5c1bc !important;
 }
+.umb-media-grid__list-item-name:hover {
+    text-decoration:underline;
+} 
+.umb-media-grid__list-item.-filtered:not(.-folder) {
+  cursor: not-allowed;
+
+  * {
+    pointer-events: none;
+  }
+}
+
 
 .umb-media-grid__list-view .umb-table-cell.umb-table__name {
     flex: 1 1 25%;
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-media-grid.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-media-grid.html
index 77ace4af70..3b486e4d11 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/umb-media-grid.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-media-grid.html
@@ -79,19 +79,22 @@
 
                     </div>
                 </div>
-                <div class="umb-table-body">
-                    <div class="umb-table-row umb-media-grid__list-item -selectable" ng-click="clickItem(item, $event, $index)" ng-repeat="item in items | filter:filterBy | orderBy:sortBy:sortReverse" ng-class="{'-selected': item.selected}">
+                <div class="umb-table-body"> 
+                    <div class="umb-table-row umb-media-grid__list-item -selectable"
+                         ng-click="clickItem(item, $event, $index)"
+                         ng-repeat="item in items | filter:filterBy | orderBy:sortBy:sortReverse"
+                         ng-class="{'-selected': item.selected, '-folder': item.isFolder, '-filtered': item.filtered}">
                         <div class="umb-table-cell">
                             <umb-icon icon="icon-check" class="umb-table-body__icon umb-table-body__checkicon" ng-if="item.selected"></umb-icon>
                             <umb-icon icon="{{item.thumbnail ? 'icon-picture' : item.icon}}" class="umb-table-body__icon" ng-if="!item.selected"></umb-icon>
                         </div>
                         <div class="umb-table-cell umb-table__name">
-                            <umb-icon icon="icon-navigation-right"
-                                      ng-show="item.isFolder"
-                                      ng-class="{'-locked': item.selected || !item.file || !item.thumbnail}"
-                                      ng-click="clickItemName(item, $event, $index)">
-                            </umb-icon>
-                            <span data-src="{{item.value.src}}" class="item-name">{{item.name}}</span>
+                            <div class="umb-media-grid__list-item-name"
+                                 ng-class="{'-locked': item.selected || !item.file || !item.thumbnail}"
+                                 ng-click="clickItemName(item, $event, $index)">
+                                <umb-icon icon="icon-navigation-right" ng-show="item.isFolder"></umb-icon>
+                                <span data-src="{{item.value.src}}" class="item-name">{{item.name}}</span>
+                            </div>
                         </div>
                         <div class="umb-table-cell">
                             <span class="muted small" style="font-size:0.8em">{{item.updateDate | date:'medium'}}</span>