From 42210d0a96fea808c84db8307dd2a63aece7650e Mon Sep 17 00:00:00 2001
From: Magnus Jensen <magnus@fleetdm.com>
Date: Mon, 11 May 2026 19:22:53 +0200
Subject: [PATCH] inconsistent alignment fleet premium (#45125)

<!-- Add the related story/sub-task/bug number, like Resolves #123, or
remove if NA -->
**Related issue:** Resolves #43646

<img width="809" height="149" alt="image"
src="https://github.com/user-attachments/assets/cf7b55ae-4d79-4686-a9e5-e9e68e4b2e65"
/>

<img width="851" height="190" alt="image"
src="https://github.com/user-attachments/assets/0c70a2b6-091c-4222-b9a9-c4d46f9b0f5b"
/>


# Checklist for submitter

If some of the following don't apply, delete the relevant line.

- [x] Changes file added for user-visible changes in `changes/`,
`orbit/changes/` or `ee/fleetd-chrome/changes`.
See [Changes
files](https://github.com/fleetdm/fleet/blob/main/docs/Contributing/guides/committing-changes.md#changes-files)
for more information.

- [x] Input data is properly validated, `SELECT *` is avoided, SQL
injection is prevented (using placeholders for values in statements), JS
inline code is prevented especially for url redirects, and untrusted
data interpolated into shell scripts/commands is validated against shell
metacharacters.
- [x] Timeouts are implemented and retries are limited to avoid infinite
loops
- [x] If paths of existing endpoints are modified without backwards
compatibility, checked the frontend/CLI for any necessary changes

## Testing
- [x] QA'd all new/changed functionality manually

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Bug Fixes**
* Fixed alignment inconsistency for premium feature messages in Fleet
settings. Premium notifications across Disk Encryption and Passwords
controls now display with proper alignment on Fleet Free tier.

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/fleetdm/fleet/pull/45125)

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 changes/43646-inconsistent-alignment-fleet-premium          | 1 +
 .../OSSettings/cards/DiskEncryption/DiskEncryption.tsx      | 6 +-----
 .../OSSettings/cards/DiskEncryption/_styles.scss            | 5 -----
 .../OSSettings/cards/Passwords/_styles.scss                 | 5 -----
 4 files changed, 2 insertions(+), 15 deletions(-)
 create mode 100644 changes/43646-inconsistent-alignment-fleet-premium

diff --git a/changes/43646-inconsistent-alignment-fleet-premium b/changes/43646-inconsistent-alignment-fleet-premium
new file mode 100644
index 0000000000..2afbd2610e
--- /dev/null
+++ b/changes/43646-inconsistent-alignment-fleet-premium
@@ -0,0 +1 @@
+- Fixed a UI inconsistency with non-center aligned Fleet premium messages on Fleet free.
\ No newline at end of file
diff --git a/frontend/pages/ManageControlsPage/OSSettings/cards/DiskEncryption/DiskEncryption.tsx b/frontend/pages/ManageControlsPage/OSSettings/cards/DiskEncryption/DiskEncryption.tsx
index a60e572f6a..e1d688a9a9 100644
--- a/frontend/pages/ManageControlsPage/OSSettings/cards/DiskEncryption/DiskEncryption.tsx
+++ b/frontend/pages/ManageControlsPage/OSSettings/cards/DiskEncryption/DiskEncryption.tsx
@@ -206,11 +206,7 @@ const DiskEncryption = ({
           </>
         }
       />
-      {!isPremiumTier && (
-        <PremiumFeatureMessage
-          className={`${baseClass}__premium-feature-message`}
-        />
-      )}
+      {!isPremiumTier && <PremiumFeatureMessage />}
       {isPremiumTier && isLoadingTeam && <Spinner />}
       {isPremiumTier && !isLoadingTeam && !showAggregate && isTechnician && (
         <p>Disk encryption is disabled.</p>
diff --git a/frontend/pages/ManageControlsPage/OSSettings/cards/DiskEncryption/_styles.scss b/frontend/pages/ManageControlsPage/OSSettings/cards/DiskEncryption/_styles.scss
index e5586c7fe8..f5f24dc618 100644
--- a/frontend/pages/ManageControlsPage/OSSettings/cards/DiskEncryption/_styles.scss
+++ b/frontend/pages/ManageControlsPage/OSSettings/cards/DiskEncryption/_styles.scss
@@ -1,11 +1,6 @@
 .disk-encryption {
   @include vertical-card-layout;
 
-  .premium-feature-message-container {
-    justify-content: initial;
-    align-items: initial;
-  }
-
   > p {
     margin: 0;
   }
diff --git a/frontend/pages/ManageControlsPage/OSSettings/cards/Passwords/_styles.scss b/frontend/pages/ManageControlsPage/OSSettings/cards/Passwords/_styles.scss
index 6611688ab0..84349f4fa5 100644
--- a/frontend/pages/ManageControlsPage/OSSettings/cards/Passwords/_styles.scss
+++ b/frontend/pages/ManageControlsPage/OSSettings/cards/Passwords/_styles.scss
@@ -5,11 +5,6 @@
     color: inherit;
   }
 
-  .premium-feature-message-container {
-    justify-content: initial;
-    align-items: initial;
-  }
-
   .passwords-content {
     gap: px-to-rem(18);
     animation: fade-in 250ms ease-out;