From dfa8695dd5106bd78389691a7dfe67e13ca264bb Mon Sep 17 00:00:00 2001
From: Sarah Gillespie <73313222+gillespi314@users.noreply.github.com>
Date: Thu, 22 Feb 2024 10:01:04 -0600
Subject: [PATCH] Fix UI styling of loading state for automatic enrollment
 settings page (#16959)

---
 changes/16820-loading-state-auto-enroll-ui                  | 1 +
 .../cards/AutomaticEnrollment/AutomaticEnrollment.tsx       | 6 +++++-
 2 files changed, 6 insertions(+), 1 deletion(-)
 create mode 100644 changes/16820-loading-state-auto-enroll-ui

diff --git a/changes/16820-loading-state-auto-enroll-ui b/changes/16820-loading-state-auto-enroll-ui
new file mode 100644
index 0000000000..4eee73b5f6
--- /dev/null
+++ b/changes/16820-loading-state-auto-enroll-ui
@@ -0,0 +1 @@
+- Fixed UI styling of loading state for automatic enrollment settings page.
diff --git a/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/AutomaticEnrollment.tsx b/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/AutomaticEnrollment.tsx
index cf61518814..3a6bc79db8 100644
--- a/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/AutomaticEnrollment.tsx
+++ b/frontend/pages/admin/IntegrationsPage/cards/AutomaticEnrollment/AutomaticEnrollment.tsx
@@ -43,7 +43,11 @@ const AutomaticEnrollment = ({ router }: IAutomaticEnrollment) => {
   if (!isPremiumTier) return <PremiumFeatureMessage />;
 
   if (isLoadingMdmApple) {
-    return <Spinner />;
+    return (
+      <div className={baseClass}>
+        <Spinner />
+      </div>
+    );
   }
 
   if (errorMdmApple?.status === 404) {