From 2cbf21f7d2cb4c4b1ccf5b54c0b61cf9588bfe36 Mon Sep 17 00:00:00 2001
From: Eric <eashaw@sailsjs.com>
Date: Tue, 16 Jan 2024 15:16:24 -0600
Subject: [PATCH] Website: update homepage headings (#16145)

Closes: #16114
Closes: #16112

Changes:
- Updated the styles for h1 and h4 headings on the homepage.
- Removed a comma to make the "Focus on data not vendors" tagline
consistent across the website.
---
 website/assets/styles/pages/homepage.less | 39 +++++++++++------------
 website/views/pages/homepage.ejs          |  6 ++--
 2 files changed, 22 insertions(+), 23 deletions(-)

diff --git a/website/assets/styles/pages/homepage.less b/website/assets/styles/pages/homepage.less
index 4a730b0c9e..353d9b0386 100644
--- a/website/assets/styles/pages/homepage.less
+++ b/website/assets/styles/pages/homepage.less
@@ -2,7 +2,7 @@
   h1 {
     font-weight: 800;
     font-size: 64px;
-    line-height: 76px;
+    line-height: 1.2;
   }
   h3 {
     font-weight: 800;
@@ -903,6 +903,9 @@
 
   @media (max-width: 767px) {
 
+    h1 {
+      font-size: 54px;
+    }
     [purpose='hero-background-image'] {
       background-size: 2600px auto;
       background-position: center bottom;
@@ -1061,6 +1064,13 @@
 
   @media (max-width: 575px) {
 
+    h1 {
+      font-size: 40px;
+    }
+    h4 {
+      font-size: 14px;
+    }
+
     [purpose='hero-background-image'] {
       background-size: 2000px auto;
       background-position: center bottom;
@@ -1072,20 +1082,9 @@
       padding-left: 24px;
       padding-right: 24px;
     }
-    h1 {
-      font-weight: 800;
-      font-size: 40px;
-      line-height: 48px;
-    }
+
     [purpose='hero-text'] {
       padding-bottom: 260px;
-      h1 {
-        font-size: 40px;
-        line-height: 48px;
-      }
-      h4 {
-        font-size: 14px;
-      }
       p {
         font-size: 16px;
       }
@@ -1203,6 +1202,13 @@
   @media (max-width: 375px) {
 
 
+    h1 {
+      font-size: 35px;
+    }
+    h4 {
+      font-size: 14px;
+    }
+
     [purpose='hero-background-image'] {
       background-size: 1400px auto;
       background-position: center bottom;
@@ -1211,13 +1217,6 @@
 
     [purpose='hero-text'] {
       padding-bottom: 260px;
-      h1 {
-        font-size: 35px;
-        line-height: 60px;
-      }
-      h4 {
-        font-size: 14px;
-      }
       p {
         font-size: 16px;
       }
diff --git a/website/views/pages/homepage.ejs b/website/views/pages/homepage.ejs
index 44b971c17f..b05f8563cf 100644
--- a/website/views/pages/homepage.ejs
+++ b/website/views/pages/homepage.ejs
@@ -7,7 +7,7 @@
           <%/* Hero text */%>
           <div purpose="hero-text"  class="d-flex flex-column justify-content-center">
             <h4>For teams with lots of endpoints</h4>
-            <h1>Focus on data, not vendors</h1>
+            <h1>Focus on data not vendors</h1>
             <p>Replace the sprawl you inherited with open-source code that works the way you want.</p>
             <div purpose="button-row" class="d-flex flex-sm-row flex-column justify-content-center align-items-center">
               <a purpose="cta-button" href="/try-fleet">Try it out</a>
@@ -95,7 +95,7 @@
     <%/* Endpoint ops block */%>
     <div purpose="platform-block" class="d-flex flex-lg-row flex-column justify-content-between mx-auto align-items-lg-center align-items-start" :class="[selectedCategory === 'endpoint-ops' ? ' show' : 'hidden']">
       <div purpose="category-text-block" class="d-flex flex-column">
-        <h3>Focus on data, not vendors</h3>
+        <h3>Focus on data not vendors</h3>
         <p>Use a consistent interface to deploy, update, and manage thousands of workstations and servers with open standards and data.</p>
         <a purpose="animated-arrow-button-red" href="/endpoint-ops">More about endpoint ops</a>
       </div>
@@ -294,7 +294,7 @@
     <div purpose="homepage-content" class="container">
       <div class="text-center">
         <h4>For teams with lots of endpoints</h4>
-        <h1>Focus on data, not vendors</h1>
+        <h1>Focus on data not vendors</h1>
         <div purpose="button-row" style="margin-top: 60px;" class="d-flex flex-sm-row flex-column justify-content-center align-items-center mx-auto">
           <a purpose="cta-button" href="/try-fleet">Try it out</a>
           <a @click="clickOpenChatWidget()" purpose="animated-arrow-button-red">Show me</a>