From 743fb8598ea3c9c87b3b7b1315e16d8fcedf9aec Mon Sep 17 00:00:00 2001
From: Eric <eashaw@sailsjs.com>
Date: Fri, 11 Jul 2025 01:57:26 -0500
Subject: [PATCH] Website: IT comparison table follow-up changes (#30776)

Related to https://github.com/fleetdm/confidential/issues/11346

Changes:
- Changed the default IT comparison mode on the homepage and the
/device-management page
- Updated the max width of the comparison dropdown on feature comparison
- Reordered the comparison dropdown options on the /device-management
page to match the homepage
---
 website/assets/js/pages/device-management.page.js  | 2 +-
 website/assets/js/pages/homepage.page.js           | 2 +-
 website/assets/styles/pages/device-management.less | 8 ++++----
 website/assets/styles/pages/homepage.less          | 8 ++++----
 website/views/pages/device-management.ejs          | 2 +-
 5 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/website/assets/js/pages/device-management.page.js b/website/assets/js/pages/device-management.page.js
index 76f0b98169..01d66399d1 100644
--- a/website/assets/js/pages/device-management.page.js
+++ b/website/assets/js/pages/device-management.page.js
@@ -4,7 +4,7 @@ parasails.registerPage('device-management-page', {
   //  ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝  ╚═╝ ╩ ╩ ╩ ╩ ╚═╝
   data: {
     modal: '',
-    comparisonMode: 'sccm',
+    comparisonMode: 'omnissa',
     comparisonModeFriendlyNames: {
       jamf: 'Jamf Pro',
       sccm: 'SCCM',
diff --git a/website/assets/js/pages/homepage.page.js b/website/assets/js/pages/homepage.page.js
index 13ef7cc68f..ae38e7c842 100644
--- a/website/assets/js/pages/homepage.page.js
+++ b/website/assets/js/pages/homepage.page.js
@@ -21,7 +21,7 @@ parasails.registerPage('homepage', {
 
     comparisonTableMode: 'it',
     // For MDM comparison table
-    comparisonModeForIt: 'sccm',
+    comparisonModeForIt: 'omnissa',
     comparisonModeForSecurity: 'rapid',
     comparisonModeFriendlyNames: {
       jamf: 'Jamf Pro',
diff --git a/website/assets/styles/pages/device-management.less b/website/assets/styles/pages/device-management.less
index 518760ecc2..53f24caef9 100644
--- a/website/assets/styles/pages/device-management.less
+++ b/website/assets/styles/pages/device-management.less
@@ -171,11 +171,11 @@
   [purpose='comparison-table-header'] {
     font-size: 16px;
     color: @core-fleet-black;
-    div {
-      padding: 12px 24px;
+    [purpose='comparison-column'] {
+      padding: 12px 16px;
     }
     [purpose='comparison-selector'] {
-      width: 152px;
+      width: 168px;
       height: 48px;
       border-radius: 8px;
       padding: 0px 12px;
@@ -187,7 +187,7 @@
       white-space: nowrap;
     }
     [purpose='comparison-selector-dropwdown'] {
-      width: 152px;
+      width: 168px;
       cursor: pointer;
       font-size: 14px;
       padding: 0px;
diff --git a/website/assets/styles/pages/homepage.less b/website/assets/styles/pages/homepage.less
index eeab32148e..2a6b85443e 100644
--- a/website/assets/styles/pages/homepage.less
+++ b/website/assets/styles/pages/homepage.less
@@ -503,11 +503,11 @@
   [purpose='comparison-table-header'] {
     font-size: 16px;
     color: @core-fleet-black;
-    div {
-      padding: 12px 24px;
+    [purpose='comparison-column'] {
+      padding: 12px 16px;
     }
     [purpose='comparison-selector'] {
-      width: 152px;
+      width: 168px;
       height: 48px;
       border-radius: 8px;
       padding: 0px 12px;
@@ -519,7 +519,7 @@
       white-space: nowrap;
     }
     [purpose='comparison-selector-dropwdown'] {
-      width: 152px;
+      width: 168px;
       cursor: pointer;
       font-size: 14px;
       padding: 0px;
diff --git a/website/views/pages/device-management.ejs b/website/views/pages/device-management.ejs
index 4e6be5257f..f1c4734cb7 100644
--- a/website/views/pages/device-management.ejs
+++ b/website/views/pages/device-management.ejs
@@ -122,8 +122,8 @@
                 {{comparisonModeFriendlyNames[comparisonMode]}}<img class="d-flex" style="width: 16px; height: 16px;" src="/images/chevron-down-16x16@2x.png" alt="a small shevron pointing downwards">
               </div>
               <div purpose="comparison-selector-dropwdown" class="dropdown-menu" aria-labelledby="dropdownMenuSelectPurpose">
-                <div class="dropdown-item" data-compare-with="sccm" @click="clickSwitchComparisonTableColumn('sccm')">SCCM</div>
                 <div class="dropdown-item" data-compare-with="omnissa" @click="clickSwitchComparisonTableColumn('omnissa')">Workspace ONE</div>
+                <div class="dropdown-item" data-compare-with="sccm" @click="clickSwitchComparisonTableColumn('sccm')">SCCM</div>
                 <div class="dropdown-item" data-compare-with="jamf" @click="clickSwitchComparisonTableColumn('jamf')">Jamf Pro</div>
                 <div class="dropdown-item" data-compare-with="intune" @click="clickSwitchComparisonTableColumn('intune')">Intune</div>
                 <div class="dropdown-item" data-compare-with="ansible" @click="clickSwitchComparisonTableColumn('ansible')">Ansible</div>