From 1432efefbe68d8c82a9c20b29e01d707270084b4 Mon Sep 17 00:00:00 2001
From: Ronan Burke <burkuscat@gmail.com>
Date: Wed, 7 Aug 2024 16:34:19 +0100
Subject: [PATCH] Fix loading progress svg CSS positioning

This updated CSS style stops a Cumulative Layout Shift from happening during the render of the default Blazor templates.
---
 .../content/ComponentsWebAssembly-CSharp/wwwroot/css/app.css | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/ProjectTemplates/Web.ProjectTemplates/content/ComponentsWebAssembly-CSharp/wwwroot/css/app.css b/src/ProjectTemplates/Web.ProjectTemplates/content/ComponentsWebAssembly-CSharp/wwwroot/css/app.css
index 44ccc7755ac7..efef290c1836 100644
--- a/src/ProjectTemplates/Web.ProjectTemplates/content/ComponentsWebAssembly-CSharp/wwwroot/css/app.css
+++ b/src/ProjectTemplates/Web.ProjectTemplates/content/ComponentsWebAssembly-CSharp/wwwroot/css/app.css
@@ -70,11 +70,12 @@ a, .btn-link {
     }
 
 .loading-progress {
-    position: relative;
+    position: absolute;
     display: block;
     width: 8rem;
     height: 8rem;
-    margin: 20vh auto 1rem auto;
+    inset: 20vh 0 auto 0;
+    margin: 0 auto 0 auto;
 }
 
     .loading-progress circle {