Website: Update quotes on platform pages, add quote to open position pages.

website/assets/js/components/scrollable-tweets.component.js

@@ -20,7 +20,7 @@ parasails.registerComponent('scrollableTweets', {
   data: function () {
     return {
       currentTweetPage: 0,
-      numberOfTweetCards: 6,
+      numberOfTweetCards: 7,
       numberOfTweetPages: 0,
       numberOfTweetsPerPage: 0,
       tweetCardWidth: 0,
@@ -110,6 +110,19 @@ parasails.registerComponent('scrollableTweets', {
           </div>
         </div>
       </div>
+
+      <div purpose="tweet-card" class="card">
+        <div class="mb-4">
+          <a href="https://www.linkedin.com/company/deloitte/"><img width="166" height="36" alt="Deloitte logo" src="/images/logo-deloitte-166x36@2x.png"/></a>
+        </div>
+        <p class="pb-2 mb-1">One of the best teams out there to go work for and help shape security platforms.</p>
+        <div class="row px-3 pt-2">
+          <div>
+            <p class="font-weight-bold m-0">Dhruv Majumdar</p>
+            <p class="m-0">Director Of Cyber Risk & Advisory <a href="https://www.linkedin.com/company/deloitte/">@Deloitte</a></p>
+          </div>
+        </div>
+      </div>
     </div>
     <div purpose="" class="mx-auto d-flex flex-row justify-content-center">
       <nav aria-label="..." >
@@ -160,9 +173,9 @@ parasails.registerComponent('scrollableTweets', {
       // Find out the width of a page of tweet cards
       let tweetPageWidth;
       if(this.numberOfTweetPages === 2 && this.numberOfTweetsPerPage > 3){
-        tweetPageWidth = this.tweetCardWidth;
+        tweetPageWidth = (this.tweetCardWidth - 32);
       } else {
-        tweetPageWidth = this.tweetCardWidth * this.numberOfTweetsPerPage;
+        tweetPageWidth = (this.tweetCardWidth - 32) * this.numberOfTweetsPerPage;
       }
       // Set the maximum number of pages as the maximum value
       let currentPage = Math.min(Math.round(tweetsDiv.scrollLeft / tweetPageWidth), (this.numberOfTweetPages - 1));
@@ -182,7 +195,11 @@ parasails.registerComponent('scrollableTweets', {
       // subtract the amount the current page has been scrolled from the baseAmountToScroll
       let amountToScroll = baseAmountToScroll - amountCurrentPageHasBeenScrolled;
       // Scroll the div to the specified 'page'
-      tweetsDiv.scrollBy(amountToScroll, 0);
+      if(page !== this.numberOfTweetPages - 1){
+        tweetsDiv.scrollBy(amountToScroll, 0);
+      } else {
+        tweetsDiv.scrollBy(tweetsDiv.scrollWidth, 0);
+      }
     },
 
 

website/assets/styles/pages/handbook/basic-handbook.less

@@ -433,6 +433,40 @@
     }
   }
 
+  // For deloitte quote on open poisiton pages.
+
+  [purpose='open-position-quote-card'] {
+    margin-top: 36px;
+    padding: 40px 60px;
+    border-radius: 16px;
+    background-color: #FFF;
+    border: 1px solid @core-vibrant-blue-15;
+    box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.10);
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+    img {
+      height: 36px;
+      width: auto;
+      padding: 0;
+      margin-right: 40px;
+    }
+    [purpose='quote-text'] {
+      font-size: 18px;
+      line-height: 27px;
+    }
+    [purpose='quote-attribution'] {
+      p {
+        font-size: 14px;
+        line-height: 21px;
+        margin-bottom: 0px;
+      }
+    }
+  }
+
+
+
   @media (min-width: 1199px) {
 
     [purpose='right-sidebar'] {
@@ -531,6 +565,16 @@
 
   // for even smaller screens (>576px)
   @media (max-width: 767px) {
+    [purpose='open-position-quote-card'] {
+      flex-direction: column;
+      justify-content: flex-start;
+      align-items: start;
+      padding: 75px 40px;
+      img {
+        margin-right: 0px;
+        margin-bottom: 40px;
+      }
+    }
     [purpose='search'] {
       padding-bottom: 0px;
     }

website/scripts/build-static-content.js

@@ -586,7 +586,7 @@ module.exports = {
 
           let pageTitle = openPosition.jobTitle;
 
-          let mdStringForThisOpenPosition = `# ${openPosition.jobTitle}\n\n## Let's start with why we exist. 📡\n\nEver wondered if your employer is monitoring your work computer?\n\nOrganizations make huge investments every year to keep their laptops and servers online, secure, compliant, and usable from anywhere. This is called "device management".\n\nAt Fleet, we think it's time device management became [transparent](https://fleetdm.com/transparency) and [open source](https://fleetdm.com/handbook/company#open-source).\n\n\n## About the company 🌈\n\nYou can read more about the company in our [handbook](https://fleetdm.com/handbook/company), which is public and open to the world.\n\ntldr; Fleet Device Management Inc. is a [recently-funded](https://techcrunch.com/2022/04/28/fleet-nabs-20m-to-enable-enterprises-to-manage-their-devices/) Series A startup founded and backed by the same people who created osquery, the leading open source security agent. Today, osquery is installed on millions of laptops and servers, and it is especially popular with [enterprise IT and security teams](https://www.linuxfoundation.org/press/press-release/the-linux-foundation-announces-intent-to-form-new-foundation-to-support-osquery-community).\n\n\n## Your primary responsibilities 🔭\n${openPosition.responsibilities}\n\n## Are you our new team member? 🧑‍🚀\nIf most of these qualities sound like you, we would love to chat and see if we're a good fit.\n\n${openPosition.experience}\n\n## Why should you join us? 🛸\n\nLearn more about the company and [why you should join us here](https://fleetdm.com/handbook/company#is-it-any-good).\n\n\n## Want to join the team?\n\nWant to join the team?\n\nReach out to [${openPosition.hiringManagerName} on Linkedin](${openPosition.hiringManagerLinkedInUrl}).`;
+          let mdStringForThisOpenPosition = `# ${openPosition.jobTitle}\n\n## Let's start with why we exist. 📡\n\nEver wondered if your employer is monitoring your work computer?\n\nOrganizations make huge investments every year to keep their laptops and servers online, secure, compliant, and usable from anywhere. This is called "device management".\n\nAt Fleet, we think it's time device management became [transparent](https://fleetdm.com/transparency) and [open source](https://fleetdm.com/handbook/company#open-source).\n\n\n## About the company 🌈\n\nYou can read more about the company in our [handbook](https://fleetdm.com/handbook/company), which is public and open to the world.\n\ntldr; Fleet Device Management Inc. is a [recently-funded](https://techcrunch.com/2022/04/28/fleet-nabs-20m-to-enable-enterprises-to-manage-their-devices/) Series A startup founded and backed by the same people who created osquery, the leading open source security agent. Today, osquery is installed on millions of laptops and servers, and it is especially popular with [enterprise IT and security teams](https://www.linuxfoundation.org/press/press-release/the-linux-foundation-announces-intent-to-form-new-foundation-to-support-osquery-community).\n\n\n## Your primary responsibilities 🔭\n${openPosition.responsibilities}\n\n## Are you our new team member? 🧑‍🚀\nIf most of these qualities sound like you, we would love to chat and see if we're a good fit.\n\n${openPosition.experience}\n\n## Why should you join us? 🛸\n\nLearn more about the company and [why you should join us here](https://fleetdm.com/handbook/company#is-it-any-good).\n\n<div purpose="open-position-quote-card"><div><img alt="Deloitte logo" src="/images/logo-deloitte-166x36@2x.png"></div><div purpose="open-position-quote"><div purpose="quote-text"><p>“One of the best teams out there to go work for and help shape security platforms.”</p></div><div purpose="quote-attribution"><strong>Dhruv Majumdar</strong><p>Director Of Cyber Risk & Advisory</p></div></div></div>\n\n\n## Want to join the team?\n\nWant to join the team?\n\nReach out to [${openPosition.hiringManagerName} on Linkedin](${openPosition.hiringManagerLinkedInUrl}).`;
 
 
           let htmlStringForThisPosition = await sails.helpers.strings.toHtml.with({mdString: mdStringForThisOpenPosition});