From 349c5ac3ab56fe0cc6c0bb3abd0d6ad314fd2bf6 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Sun, 21 Mar 2021 15:14:01 +0100
Subject: [PATCH] Fix issue with active style affected nested block list
 elements

---
 .../inlineblock/inlineblock.editor.less       | 28 +++++++++++--------
 .../umb-block-list-property-editor.html       |  1 -
 .../blocklist/umbblocklistblock.component.js  |  4 +--
 3 files changed, 18 insertions(+), 15 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/blocklistentryeditors/inlineblock/inlineblock.editor.less b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/blocklistentryeditors/inlineblock/inlineblock.editor.less
index 45a4c08598..12862d8f41 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/blocklistentryeditors/inlineblock/inlineblock.editor.less
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/blocklistentryeditors/inlineblock/inlineblock.editor.less
@@ -45,18 +45,6 @@
         }
     }
 
-    .umb-block-list__block.--active & {
-        border-color: @gray-8;
-        box-shadow: 0 0 2px 0px rgba(0, 0, 0, 0.05);
-
-        > button {
-            > .caret {
-                transform: rotate(0deg);
-            }
-        }
-    }
-
-    
     ng-form.ng-invalid-val-server-match-content > .umb-block-list__block > .umb-block-list__block--content > div > & {
         > button {
             color: @formErrorText;
@@ -104,6 +92,22 @@
     }
 }
 
+.umb-block-list__block.--active {
+    border-color: @gray-8;
+    box-shadow: 0 0 2px 0px rgba(0, 0, 0, 0.05);
+
+    > .umb-block-list__block--content {
+        > .umb-block-list__block--view  {
+            > .blockelement-inlineblock-editor {
+                > button {
+                    > .caret {
+                        transform: rotate(0deg);
+                    }
+                }
+            }
+        }
+    }
+}
 
 .blockelement-inlineblock-editor__inner {
     border-top: 1px solid @gray-8;
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umb-block-list-property-editor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umb-block-list-property-editor.html
index 9726daf5e6..38959da6ba 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umb-block-list-property-editor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umb-block-list-property-editor.html
@@ -61,5 +61,4 @@
         model="vm.blockTypePicker">
     </umb-overlay>
 
-
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umbblocklistblock.component.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umbblocklistblock.component.js
index 285437b011..1027b82e51 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umbblocklistblock.component.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umbblocklistblock.component.js
@@ -59,12 +59,12 @@
                     <style>
                     @import "${model.stylesheet}"
                     </style>
-                    <div ng-include="'${model.view}'"></div>
+                    <div class="umb-block-list__block--view" ng-include="'${model.view}'"></div>
                 `;
                 $compile(shadowRoot)($scope);
             }
             else {
-                $element.append($compile('<div ng-include="model.view"></div>')($scope));
+                $element.append($compile('<div class="umb-block-list__block--view" ng-include="model.view"></div>')($scope));
             }
         };