From cef2375396b494fa0c28af73b087085d1387a6b9 Mon Sep 17 00:00:00 2001
From: Eric <eashaw@sailsjs.com>
Date: Wed, 21 Feb 2024 19:26:51 -0600
Subject: [PATCH] Website: Update product categories section on homepage
 (#17072)

Changes:
- Removed the product category switch on the homepage.
---
 website/assets/js/pages/homepage.page.js  |  1 -
 website/assets/styles/pages/homepage.less |  1 -
 website/views/pages/homepage.ejs          | 19 ++++++-------------
 3 files changed, 6 insertions(+), 15 deletions(-)

diff --git a/website/assets/js/pages/homepage.page.js b/website/assets/js/pages/homepage.page.js
index b7a612731d..1f92d07a38 100644
--- a/website/assets/js/pages/homepage.page.js
+++ b/website/assets/js/pages/homepage.page.js
@@ -4,7 +4,6 @@ parasails.registerPage('homepage', {
   //  ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝  ╚═╝ ╩ ╩ ╩ ╩ ╚═╝
   data: {
     modal: undefined,
-    selectedCategory: 'device-management'
   },
 
   //  ╦  ╦╔═╗╔═╗╔═╗╦ ╦╔═╗╦  ╔═╗
diff --git a/website/assets/styles/pages/homepage.less b/website/assets/styles/pages/homepage.less
index c0bbb27964..3735660cb3 100644
--- a/website/assets/styles/pages/homepage.less
+++ b/website/assets/styles/pages/homepage.less
@@ -1016,7 +1016,6 @@
       max-width: 480px;
       [purpose='category-button'] {
         width: 100%;
-        margin-bottom: 60px;
       }
     }
     [purpose='endpoint-ops-image'] {
diff --git a/website/views/pages/homepage.ejs b/website/views/pages/homepage.ejs
index 45debef0d2..b37392b364 100644
--- a/website/views/pages/homepage.ejs
+++ b/website/views/pages/homepage.ejs
@@ -86,15 +86,8 @@
         </div>
       </div>
 
-      <div purpose="category-switch" class="d-flex flex-md-row flex-column justify-content-center mx-auto">
-        <div purpose="category-switch-option" class="security" :class="[selectedCategory === 'device-management' ? 'selected' : '']" @click="selectedCategory = 'device-management'">Device management</div>
-        <div purpose="category-switch-option" class="all" :class="[selectedCategory === 'endpoint-ops' ? 'selected' : '']" @click="selectedCategory = 'endpoint-ops'">Endpoint ops</div>
-        <div purpose="category-switch-option" class="it" :class="[selectedCategory === 'vulnerability-management' ? 'selected' : '']" @click="selectedCategory = 'vulnerability-management'">Vuln<span class="d-inline d-md-none d-lg-inline">erability</span> management</div>
-        <div purpose="category-tier-switch" :class="selectedCategory+'-selected'"></div>
-      </div>
-
       <%/* Device management block */%>
-      <div purpose="platform-block" :class="[selectedCategory === 'device-management' ? 'visible' : '']"  class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center" v-if="selectedCategory === 'device-management'">
+      <div purpose="platform-block" class="d-flex flex-md-row flex-column-reverse justify-content-md-between mx-auto align-items-center">
         <div purpose="category-text-block" class="d-flex flex-column">
           <h4>Device management</h4>
           <h3>Manage everything in one place</h3>
@@ -109,7 +102,10 @@
       </div>
 
       <%/* Endpoint ops block */%>
-      <div purpose="platform-block" :class="[selectedCategory === 'endpoint-ops' ? 'visible' : '']" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center" v-if="selectedCategory === 'endpoint-ops'">
+      <div purpose="platform-block" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center">
+        <div purpose="endpoint-ops-image">
+          <img alt="Endpoint ops" src="images/endpoint-operations-hero-image-380x383@2x.png">
+        </div>
         <div purpose="category-text-block" class="d-flex flex-column">
           <h4>Endpoint ops</h4>
           <h3>Focus on data, not vendors</h3>
@@ -118,13 +114,10 @@
             <a purpose="category-button" class="text-nowrap btn btn-primary" href="/endpoint-ops">Start with endpoint ops</a>
           </div>
         </div>
-        <div purpose="endpoint-ops-image">
-          <img alt="Endpoint ops" src="images/endpoint-operations-hero-image-380x383@2x.png">
-        </div>
       </div>
 
       <%/* Vulnerability management block */%>
-      <div purpose="platform-block" :class="[selectedCategory === 'vulnerability-management' ? 'visible' : '']" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center" v-if="selectedCategory === 'vulnerability-management'">
+      <div purpose="platform-block" class="d-flex flex-md-row flex-column-reverse justify-content-md-between mx-auto align-items-center">
         <div purpose="category-text-block" class="d-flex flex-column">
           <h4>Vulnerability management</h4>
           <h3>Build the vulnerability program you actually want</h3>