From d2c8ecf9ab452d9fddf55b0e8bb7e731820f1e68 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <nsl@umbraco.dk>
Date: Mon, 21 Nov 2022 20:08:12 +0100
Subject: [PATCH] use custom prop for calculated width (#13451)

---
 .../src/views/propertyeditors/blockgrid/blockgridui.less      | 4 ++--
 .../views/propertyeditors/blockgrid/umb-block-grid-entry.html | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockgrid/blockgridui.less b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockgrid/blockgridui.less
index d66a6bf5c5..ce7dcf3faa 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockgrid/blockgridui.less
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockgrid/blockgridui.less
@@ -423,7 +423,7 @@ ng-form.ng-invalid > .umb-block-grid__block:not(.--active) > .umb-block-grid__bl
 }
 .umb-block-grid__block--inline-create-button.--above {
     left: 0;
-    width: 100%;
+    width: var(--umb-block-grid-editor--inline-create-width, 100%);
 
     top: calc(var(--umb-block-grid--row-gap, 0px) * -0.5);
 }
@@ -435,7 +435,7 @@ ng-form.ng-invalid > .umb-block-grid__block:not(.--active) > .umb-block-grid__bl
     /* If at root, and full-width then become 40px wider: */
     --calc: clamp(0, calc(var(--umb-block-grid--item-column-span) - (var(--umb-block-grid--grid-columns)-1)), 1);
     left: calc(-20px * var(--calc));
-    width: calc(100% + 40px * var(--calc));
+    width: calc(var(--umb-block-grid-editor--inline-create-width, 100%) + 40px * var(--calc));
 }
 
 .umb-block-grid__block--inline-create-button.--after {
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockgrid/umb-block-grid-entry.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockgrid/umb-block-grid-entry.html
index 0caebd35c2..d8621f7a5b 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockgrid/umb-block-grid-entry.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockgrid/umb-block-grid-entry.html
@@ -1,7 +1,7 @@
 <uui-button-inline-create
     ng-if="!vm.blockEditorApi.readonly && !vm.hideInlineCreateAbove"
     class="umb-block-grid__block--inline-create-button --above"
-    style="width: {{vm.inlineCreateAboveWidth}};"
+    style="--umb-block-grid-editor--inline-create-width: {{vm.inlineCreateAboveWidth}};"
     ng-class="{'--at-root': vm.depth === '0'}"
     ng-click="vm.clickInlineCreateAbove()"
     ng-mouseover="vm.mouseOverInlineCreate()"