From 495f44f555a724072f80594eb53c92d188af88c0 Mon Sep 17 00:00:00 2001
From: Eric <eashaw@sailsjs.com>
Date: Wed, 30 Mar 2022 12:37:02 -0500
Subject: [PATCH] Update Twitter cards on Fleetdm.com homepage (#4877)

* update card layout

* Update homepage.ejs
---
 website/assets/styles/pages/homepage.less | 15 ++++--------
 website/views/pages/homepage.ejs          | 30 +++++++----------------
 2 files changed, 14 insertions(+), 31 deletions(-)

diff --git a/website/assets/styles/pages/homepage.less b/website/assets/styles/pages/homepage.less
index 86021eee21..0748194c57 100644
--- a/website/assets/styles/pages/homepage.less
+++ b/website/assets/styles/pages/homepage.less
@@ -73,7 +73,7 @@
     max-width: 1200px;
     padding-bottom: 50px;
     box-sizing: content-box;
-    [purpose='tweet-card'], [purpose='tweet-card-bottom-row'] {
+    [purpose='tweet-card'] {
       text-align: left;
       background: #FFFFFF;
       padding: 40px;
@@ -240,11 +240,6 @@
         margin-right: 15px;
         flex: 0 1 326px;
       }
-      [purpose='tweet-card-bottom-row'] {
-        margin-left: 15px;
-        margin-right: 15px;
-        flex: 0 1 380px;
-      }
     }
     [purpose='demo-cta'] {
       max-width: 960px;
@@ -255,7 +250,7 @@
     [purpose='tweets'] {
       padding-left: 72px;
       padding-right: 72px;
-      [purpose='tweet-card'], [purpose='tweet-card-bottom-row'] {
+      [purpose='tweet-card'] {
         flex: 1 1 360px;
         margin-bottom: 15px;
         margin-left: 8px;
@@ -278,7 +273,7 @@
   }
   @media (max-width: 990px) {
     [purpose='tweets'] {
-      [purpose='tweet-card'], [purpose='tweet-card-bottom-row'] {
+      [purpose='tweet-card'] {
         flex: 1 1 295px;
       }
     }
@@ -311,7 +306,7 @@
     [purpose='tweets'] {
       padding-left: 52px;
       padding-right: 52px;
-      [purpose='tweet-card'], [purpose='tweet-card-bottom-row'] {
+      [purpose='tweet-card'] {
         flex: 1 1 316px;
       }
     }
@@ -354,7 +349,7 @@
     [purpose='tweets'] {
       padding-left: 16px;
       padding-right: 16px;
-      [purpose='tweet-card'], [purpose='tweet-card-bottom-row'] {
+      [purpose='tweet-card'] {
         margin-bottom: 30px;
       }
     }
diff --git a/website/views/pages/homepage.ejs b/website/views/pages/homepage.ejs
index ac7bd33ea1..efbc4294f1 100644
--- a/website/views/pages/homepage.ejs
+++ b/website/views/pages/homepage.ejs
@@ -174,7 +174,7 @@
         That’s good news, since it means there are lots of other developers and security practitioners talking about Fleet, dreaming up features, and contributing patches.
       </p>
       <div purpose="tweets" class="d-flex card-deck justify-content-center pt-5 mx-auto">
-        <div purpose="tweet-card" class="card ">
+        <div purpose="tweet-card" class="card">
           <div class="mb-4">
             <a href="https://twitter.com/osquery"><img width="140" height="36" alt="osquery logo" src="/images/social-proof-logo-osquery-140x36@2x.png"/></a>
           </div>
@@ -199,19 +199,19 @@
               </div>
           </div>
         </div>
-        <div purpose="tweet-card" class="card ">
+        <div purpose="tweet-card" class="card">
           <div class="mb-4">
-            <a href="https://twitter.com/SnowflakeDB"><img width="153" height="38" alt="Snowflake logo" src="/images/social-proof-logo-snowflake-153x38@2x.png"/></a>
+            <a href="https://twitter.com/comcast"><img width="107" height="38" alt="Comcast logo" src="/images/social-proof-logo-comcast-107x38.png"/></a>
           </div>
-          <p class="pb-2 mb-1">My DevOps team members got Fleet set up this week, w/ data streaming via firehose to S3 buckets. This is pretty dang amazing being able to stream real data this fast. I’m very excited to see what we can build out with this. Enrolled a few boxes & streaming that sweet data.</p>
+          <p class="pb-2 mb-1">With the power of osquery, you need a scalable & resilient platform to manage your workloads. Fleet is the "just right" open-source, enterprise grade solution.</p>
           <div class="row px-3 pt-2">
             <div>
-              <p class="font-weight-bold m-0">Tom Larkin</p>
-              <p class="m-0">IT Engineering <a href="https://twitter.com/SnowflakeDB">@Snowflake</a></p>
+              <p class="font-weight-bold m-0">Abubakar Yousafzai</p>
+              <p class="m-0">Security Software Development & Engineering <a href="https://twitter.com/comcast">@Comcast</a></p>
             </div>
           </div>
         </div>
-        <div purpose="tweet-card" class="card ">
+        <div purpose="tweet-card" class="card">
           <div class="mb-4">
             <a href="https://twitter.com/Uber"><img width="87" height="38" alt="Uber logo" src="/images/social-proof-logo-uber-87x38@2x.png"/></a>
           </div>
@@ -235,7 +235,7 @@
             </div>
           </div>
         </div>
-        <div purpose="tweet-card" class="card ">
+        <div purpose="tweet-card" class="card">
           <div class="mb-4">
             <a href="https://twitter.com/atlassian"><img width="162" height="20" alt="Atlassian logo" src="/images/social-proof-logo-atlassian-162x20@2x.png"/></a>
           </div>
@@ -247,19 +247,7 @@
             </div>
           </div>
         </div>
-        <div purpose="tweet-card-bottom-row" class="card ">
-          <div class="mb-4">
-            <a href="https://twitter.com/comcast"><img width="107" height="38" alt="Comcast logo" src="/images/social-proof-logo-comcast-107x38.png"/></a>
-          </div>
-          <p class="pb-2 mb-1">With the power of osquery, you need a scalable & resilient platform to manage your workloads. Fleet is the "just right" open-source, enterprise grade solution.</p>
-          <div class="row px-3 pt-2">
-            <div>
-              <p class="font-weight-bold m-0">Abubakar Yousafzai</p>
-              <p class="m-0">Security Software Development & Engineering <a href="https://twitter.com/comcast">@Comcast</a></p>
-            </div>
-          </div>
-        </div>
-        <div purpose="tweet-card-bottom-row" class="card ">
+        <div purpose="tweet-card" class="card">
           <div class="mb-4">
             <a href="https://twitter.com/grupoversia"><img width="90" height="38" alt="Versia logo" src="/images/social-proof-logo-versia-90x38@2x.png"/></a>
           </div>