From e221b8f54f80fe0f254fa982b361ae6bb8974896 Mon Sep 17 00:00:00 2001
From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com>
Date: Wed, 10 Jul 2024 11:33:07 +0200
Subject: [PATCH] feat: center all items inside whether they be the figure,
 icon, or loader

---
 .../components/imaging-thumbnail.element.ts       | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/imaging/components/imaging-thumbnail.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/imaging/components/imaging-thumbnail.element.ts
index cdcb474deb..81ae2ff903 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/media/imaging/components/imaging-thumbnail.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/imaging/components/imaging-thumbnail.element.ts
@@ -93,7 +93,7 @@ export class UmbImagingThumbnailElement extends UmbLitElement {
 	}
 
 	#renderLoading() {
-		return html`<div class="container"><uui-loader></uui-loader></div>`;
+		return html`<div id="loader"><uui-loader></uui-loader></div>`;
 	}
 
 	#renderThumbnail() {
@@ -131,12 +131,19 @@ export class UmbImagingThumbnailElement extends UmbLitElement {
 				display: block;
 				position: relative;
 				overflow: hidden;
-			}
-
-			.container {
 				display: flex;
 				justify-content: center;
 				align-items: center;
+				width: 100%;
+				height: 100%;
+			}
+
+			#loader {
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				height: 100%;
+				width: 100%;
 			}
 
 			#figure {