mirror of
https://github.com/fleetdm/fleet
synced 2026-05-21 16:08:47 +00:00
Website: Update homepage hero & content (#32570)
Closes: https://github.com/fleetdm/confidential/issues/12074 Closes: https://github.com/fleetdm/confidential/issues/12018 Changes: - Updated the homepage hero to have a quote from Wes Whetstone - Updated the homepage layout to match the latest wireframes
This commit is contained in:
parent
990eb3041b
commit
2cb83a1cd5
4 changed files with 200 additions and 252 deletions
|
|
@ -20,12 +20,58 @@ module.exports = {
|
|||
description: 'Requesting user is logged in, so redirect to the internal welcome page.'
|
||||
},
|
||||
|
||||
badConfig: {
|
||||
responseType: 'badConfig'
|
||||
},
|
||||
|
||||
},
|
||||
|
||||
|
||||
fn: async function () {
|
||||
|
||||
return {};
|
||||
if (!_.isObject(sails.config.builtStaticContent) || !_.isArray(sails.config.builtStaticContent.testimonials) || !sails.config.builtStaticContent.compiledPagePartialsAppPath) {
|
||||
throw {badConfig: 'builtStaticContent.testimonials'};
|
||||
}
|
||||
// Get testimonials for the <scrolalble-tweets> component.
|
||||
let testimonialsForScrollableTweets = _.clone(sails.config.builtStaticContent.testimonials);
|
||||
|
||||
// Specify an order for the testimonials on this page using the last names of quote authors
|
||||
let testimonialOrderForThisPage = [
|
||||
'Bart Reardon',
|
||||
'Scott MacVicar',
|
||||
'Mike Meyer',
|
||||
'Luis Madrigal',
|
||||
'Tom Larkin',
|
||||
'Kenny Botelho',
|
||||
'Erik Gomez',
|
||||
'Chandra Majumdar',
|
||||
'Eric Tan',
|
||||
'Matt Carr',
|
||||
'Nico Waisman',
|
||||
'Dan Grzelak',
|
||||
'Philip Chotipradit',
|
||||
'Roger Cantrell',
|
||||
'Chayce O\'Neal'
|
||||
];
|
||||
|
||||
// Filter the testimonials by product category
|
||||
testimonialsForScrollableTweets = _.filter(testimonialsForScrollableTweets, (testimonial)=>{
|
||||
return _.contains(testimonial.productCategories, 'Device management') && _.contains(testimonialOrderForThisPage, testimonial.quoteAuthorName);
|
||||
});
|
||||
|
||||
testimonialsForScrollableTweets.sort((a, b)=>{
|
||||
if(testimonialOrderForThisPage.indexOf(a.quoteAuthorName) === -1){
|
||||
return 1;
|
||||
} else if(testimonialOrderForThisPage.indexOf(b.quoteAuthorName) === -1) {
|
||||
return -1;
|
||||
}
|
||||
return testimonialOrderForThisPage.indexOf(a.quoteAuthorName) - testimonialOrderForThisPage.indexOf(b.quoteAuthorName);
|
||||
});
|
||||
|
||||
|
||||
return {
|
||||
testimonialsForScrollableTweets
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
|
|
|
|||
BIN
website/assets/images/homepage-hero-wes-whetstone-86x72@2x.png
vendored
Normal file
BIN
website/assets/images/homepage-hero-wes-whetstone-86x72@2x.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
198
website/assets/styles/pages/homepage.less
vendored
198
website/assets/styles/pages/homepage.less
vendored
|
|
@ -21,7 +21,7 @@
|
|||
text-transform: uppercase;
|
||||
font-family: 'Roboto Mono';
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
font-size: 16px;
|
||||
line-height: 120%;
|
||||
color: @core-fleet-black-75;
|
||||
margin-bottom: 8px;
|
||||
|
|
@ -48,11 +48,11 @@
|
|||
}
|
||||
|
||||
[purpose='homepage-hero'] {
|
||||
padding-top: 120px;
|
||||
padding-top: 64px;
|
||||
padding-left: 64px;
|
||||
padding-bottom: 120px;
|
||||
max-width: 1200px;
|
||||
height: 498px;
|
||||
height: 448px;
|
||||
}
|
||||
[purpose='ticker-container'] {
|
||||
overflow: hidden;
|
||||
|
|
@ -82,12 +82,21 @@
|
|||
}
|
||||
}
|
||||
[purpose='hero-text'] {
|
||||
max-width: 474px;
|
||||
max-width: 500px;
|
||||
text-align: left;
|
||||
h1 {
|
||||
max-width: 640px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
h4 {
|
||||
color: #515774;
|
||||
font-feature-settings: 'salt' on, 'ss01' on, 'ss02' on;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
p {
|
||||
max-width: 412px;
|
||||
margin-bottom: 32px;
|
||||
|
|
@ -99,6 +108,43 @@
|
|||
}
|
||||
}
|
||||
|
||||
[purpose='hero-quote-author'] {
|
||||
margin-top: 24px;
|
||||
margin-bottom: 32px;
|
||||
[purpose='hero-quote-profile-image'] {
|
||||
margin-right: 16px;
|
||||
img {
|
||||
height: 72px;
|
||||
}
|
||||
}
|
||||
[purpose='quote-author-info'] {
|
||||
[purpose='quote-author-name'] {
|
||||
color: var(--text-text-brand, #192147);
|
||||
|
||||
/* Body XS (bold) */
|
||||
font-family: Inter;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: 18px; /* 150% */
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
[purpose='quote-author-title'] {
|
||||
color: var(--text-text-primary, #515774);
|
||||
font-family: Inter;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 18px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
[purpose='button-row'] {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
|
@ -116,7 +162,7 @@
|
|||
border-radius: 8px;
|
||||
padding-left: 32px;
|
||||
padding-right: 32px;
|
||||
height: 40px;
|
||||
height: 44px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
|
@ -147,7 +193,7 @@
|
|||
padding-left: 60px;
|
||||
padding-right: 60px;
|
||||
margin-top: 24px;
|
||||
margin-bottom: 120px;
|
||||
margin-bottom: 64px;
|
||||
[parasails-component='logo-carousel'] {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
|
@ -293,7 +339,7 @@
|
|||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-bottom: 128px;
|
||||
margin-bottom: 160px;
|
||||
[purpose='feature-image'] {
|
||||
img {
|
||||
width: 578px;
|
||||
|
|
@ -337,7 +383,7 @@
|
|||
flex-direction: row;
|
||||
justify-content: center;
|
||||
margin-top: 48px;
|
||||
margin-bottom: 48px;
|
||||
margin-bottom: 120px;
|
||||
text-decoration: none;
|
||||
h4 {
|
||||
color: #192147;
|
||||
|
|
@ -389,65 +435,18 @@
|
|||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='quote'] {
|
||||
max-width: 580px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-bottom: 80px;
|
||||
padding-top: 32px;
|
||||
[purpose='testimonials-header'] {
|
||||
margin-top: 80px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
}
|
||||
[purpose='quote-logo'] {
|
||||
height: 32px;
|
||||
// margin-bottom: 16px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
}
|
||||
[purpose='quote-text'] {
|
||||
color: @core-fleet-black-75;
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
line-height: 150%;
|
||||
margin-bottom: 0px;
|
||||
padding: 24px 0px;
|
||||
}
|
||||
[purpose='quote-attribution'] {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
[purpose='quote-author-image'] {
|
||||
height: 48px;
|
||||
margin-bottom: 16px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
[purpose='name'] {
|
||||
color: @core-fleet-black-75;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
line-height: 150%;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
[purpose='job-title'] {
|
||||
color: @core-fleet-black-75;
|
||||
margin-bottom: 0px;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
line-height: 150%;
|
||||
[parasails-component='scrollable-tweets'] {
|
||||
[purpose='tweets'] {
|
||||
margin-top: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
[purpose='comparison-section'] {
|
||||
|
||||
padding-bottom: 80px;
|
||||
|
|
@ -927,8 +926,8 @@
|
|||
}
|
||||
[purpose='homepage-hero'] {
|
||||
max-width: 100%;
|
||||
padding-top: 80px;
|
||||
padding-bottom: 80px;
|
||||
padding-top: 64px;
|
||||
padding-bottom: 32px;
|
||||
height: 418px;
|
||||
}
|
||||
[purpose='hero-background-image'] {
|
||||
|
|
@ -1114,13 +1113,41 @@
|
|||
|
||||
}
|
||||
[purpose='hero-logos'] {
|
||||
margin-bottom: 64px;
|
||||
}
|
||||
[purpose='statistics'] {
|
||||
margin-bottom: 80px;
|
||||
[purpose='statistics-column'] {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 227px;
|
||||
}
|
||||
[purpose='countries'] {
|
||||
border-right: none;
|
||||
padding: 16px 32px;
|
||||
|
||||
}
|
||||
[purpose='customers'] {
|
||||
padding: 16px 32px;
|
||||
}
|
||||
[purpose='devices'] {
|
||||
padding: 16px 32px;
|
||||
}
|
||||
[purpose='response-time'] {
|
||||
padding: 16px 32px;
|
||||
}
|
||||
|
||||
}
|
||||
[purpose='hero-text'] {
|
||||
min-width: unset;
|
||||
p {
|
||||
max-width: 465px;
|
||||
}
|
||||
[purpose='button-row'] {
|
||||
[purpose='cta-button'] {
|
||||
width: 45%;
|
||||
}
|
||||
}
|
||||
}
|
||||
[purpose='page-section'] {
|
||||
margin-bottom: 80px;
|
||||
|
|
@ -1154,36 +1181,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
[purpose='quote'] {
|
||||
padding-bottom: 32px;
|
||||
}
|
||||
|
||||
|
||||
[purpose='statistics'] {
|
||||
[purpose='statistics-column'] {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 227px;
|
||||
}
|
||||
[purpose='countries'] {
|
||||
border-right: none;
|
||||
padding: 16px 32px;
|
||||
|
||||
}
|
||||
[purpose='customers'] {
|
||||
padding: 16px 32px;
|
||||
}
|
||||
[purpose='devices'] {
|
||||
padding: 16px 32px;
|
||||
}
|
||||
[purpose='response-time'] {
|
||||
padding: 16px 32px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
[purpose='three-column-features'] {
|
||||
margin-bottom: 120px;
|
||||
}
|
||||
|
|
@ -1289,9 +1286,6 @@
|
|||
h1 {
|
||||
font-size: 32px;
|
||||
}
|
||||
h4 {
|
||||
font-size: 14px;
|
||||
}
|
||||
[purpose='option-container'] {
|
||||
height: 38.4px;
|
||||
}
|
||||
|
|
@ -1317,6 +1311,11 @@
|
|||
[purpose='hero-text'] {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
[purpose='button-row'] {
|
||||
[purpose='cta-button'] {
|
||||
width: unset;
|
||||
}
|
||||
}
|
||||
}
|
||||
[purpose='feature-with-image'] {
|
||||
flex-direction: column;
|
||||
|
|
@ -1469,9 +1468,9 @@
|
|||
font-size: 28px;
|
||||
line-height: 120%;
|
||||
}
|
||||
h4 {
|
||||
font-size: 12px;
|
||||
}
|
||||
// h4 {
|
||||
// font-size: 12px;
|
||||
// }
|
||||
[purpose='announcement-banner'] {
|
||||
br {
|
||||
display: block;
|
||||
|
|
@ -1490,8 +1489,7 @@
|
|||
padding-top: 44px;
|
||||
padding-left: 16px;
|
||||
padding-right: 17px;
|
||||
padding-bottom: 187px;
|
||||
height: 520px;
|
||||
padding-bottom: 217px;
|
||||
[purpose='option-container'] {
|
||||
height: 33.6px;
|
||||
}
|
||||
|
|
|
|||
206
website/views/pages/homepage.ejs
vendored
206
website/views/pages/homepage.ejs
vendored
|
|
@ -6,37 +6,19 @@
|
|||
<div class="d-flex flex-row justify-content-start justify-content-sm-center justify-content-md-start align-items-start">
|
||||
<%/* Hero text */%>
|
||||
<div purpose="hero-text" class="d-flex flex-column justify-content-start">
|
||||
<h1>One agent for <br>
|
||||
<div purpose="ticker-container" class="d-flex align-items-center flex-row text-nowrap">
|
||||
every
|
||||
<div purpose="option-container" class="pl-2 d-flex flex-column">
|
||||
<span purpose="hero-ticker-option" class="visible">OS</span>
|
||||
<span purpose="hero-ticker-option">audit</span>
|
||||
<span purpose="hero-ticker-option">script</span>
|
||||
<span purpose="hero-ticker-option">config</span>
|
||||
<span purpose="hero-ticker-option">question</span>
|
||||
<span purpose="hero-ticker-option">laptop</span>
|
||||
<span purpose="hero-ticker-option">desktop</span>
|
||||
<span purpose="hero-ticker-option">phone</span>
|
||||
<span purpose="hero-ticker-option">server</span>
|
||||
<span purpose="hero-ticker-option">cloud instance</span>
|
||||
<span purpose="hero-ticker-option">container</span>
|
||||
<span purpose="hero-ticker-option">tablet</span>
|
||||
<span purpose="hero-ticker-option">hospital</span>
|
||||
<span purpose="hero-ticker-option">factory</span>
|
||||
<span purpose="hero-ticker-option">report</span>
|
||||
<span purpose="hero-ticker-option">new hire</span>
|
||||
<span purpose="hero-ticker-option">offboard</span>
|
||||
<span purpose="hero-ticker-option">employee</span>
|
||||
<span purpose="hero-ticker-option">agent</span>
|
||||
<span purpose="hero-ticker-option">robot</span>
|
||||
<span purpose="hero-ticker-option">satellite</span>
|
||||
<span purpose="hero-ticker-option">telescope</span>
|
||||
<span purpose="hero-ticker-option">computer</span>
|
||||
</div>
|
||||
</div>
|
||||
<h4>Open device management</h4>
|
||||
<h1>“I just moved 13,000<br> Macs to Fleet”
|
||||
|
||||
</h1>
|
||||
<p>Replace the sprawl with lightning fast device management that puts you back in control.</p>
|
||||
<div purpose="hero-quote-author" class="d-flex flex-row align-items-center">
|
||||
<div purpose="hero-quote-profile-image">
|
||||
<img alt="Wes Whetstone" src="/images/homepage-hero-wes-whetstone-86x72@2x.png">
|
||||
</div>
|
||||
<div purpose="quote-author-info">
|
||||
<p purpose="quote-author-name">Wes Whetstone</p>
|
||||
<p purpose="quote-author-title">Client Platform Engineer at Stripe</p>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="button-row" class="d-flex justify-content-start align-items-center">
|
||||
<a purpose="cta-button" href="/contact">Get a demo</a>
|
||||
<a purpose="video-button" @click="clickOpenVideoModal('fleet-in-three-minutes')"><img alt="Play" class="d-inline" src="/images/icon-play-video-32x32@2x.png">See Fleet in action<span>3 mins</span></a>
|
||||
|
|
@ -50,83 +32,39 @@
|
|||
<div purpose="hero-logos" class="mx-auto">
|
||||
<logo-carousel></logo-carousel>
|
||||
</div>
|
||||
<a purpose="statistics" class="d-flex" href="/testimonials" no-underline>
|
||||
<div purpose="statistics-column">
|
||||
<div purpose="customers" class="d-none d-sm-block">
|
||||
<h4>100+</h4>
|
||||
<p>customers</p>
|
||||
</div>
|
||||
<div purpose="countries" class="d-block d-sm-none">
|
||||
<h4>90+</h4>
|
||||
<p>countries</p>
|
||||
</div>
|
||||
<div purpose="devices">
|
||||
<h4>2,000,000+</h4>
|
||||
<p>computing devices</p>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="statistics-column">
|
||||
<div purpose="countries" class="d-none d-sm-block">
|
||||
<h4>90+</h4>
|
||||
<p>countries</p>
|
||||
</div>
|
||||
<div purpose="customers" class="d-block d-sm-none">
|
||||
<h4>100+</h4>
|
||||
<p>customers</p>
|
||||
</div>
|
||||
<div purpose="response-time">
|
||||
<h4>8 minutes</h4>
|
||||
<p>avg support response time</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<%/* Homepage content */%>
|
||||
<div purpose="homepage-content" class="container">
|
||||
<div purpose="page-section">
|
||||
<div purpose="homepage-text-block" class="mt-0">
|
||||
<h2>Everything in one place</h2>
|
||||
<p>Manage devices consistently in a single, open platform for Apple, Linux, and Windows.</p>
|
||||
</div>
|
||||
<div purpose="feature-cards" class="card-deck">
|
||||
<a purpose="feature-card" class="card" href="/device-management">
|
||||
<div purpose="card-content">
|
||||
<h5>Multi-platform MDM</h5>
|
||||
<p>Remotely manage, and protect laptops and mobile devices.</p>
|
||||
</div>
|
||||
<div purpose="card-chevron">
|
||||
<svg purpose="chevron" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
|
||||
<path d="M1.35712 1L5.64283 6L1.35712 11" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
<a purpose="feature-card" class="card" href="/orchestration">
|
||||
<div purpose="card-content">
|
||||
<h5>Orchestration</h5>
|
||||
<p>Automate tasks across devices, from app installs to scripts.</p>
|
||||
</div>
|
||||
<div purpose="card-chevron">
|
||||
<svg purpose="chevron" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
|
||||
<path d="M1.35712 1L5.64283 6L1.35712 11" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
<a purpose="feature-card" class="card" href="/software-management">
|
||||
<div purpose="card-content">
|
||||
<h5>Software management</h5>
|
||||
<p>Inventory, patch, and manage installed software.</p>
|
||||
</div>
|
||||
<div purpose="card-chevron">
|
||||
<svg purpose="chevron" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
|
||||
<path d="M1.35712 1L5.64283 6L1.35712 11" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
<a purpose="feature-card" class="card" href="/announcements/large-gaming-company-enhances-server-observability-with-fleet">
|
||||
<div purpose="card-content">
|
||||
<h5>Security</h5>
|
||||
<p>Monitor activity, spot anomalies, and get situational awareness.</p>
|
||||
</div>
|
||||
<div purpose="card-chevron">
|
||||
<svg purpose="chevron" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
|
||||
<path d="M1.35712 1L5.64283 6L1.35712 11" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
<a purpose="feature-card" class="card" href="/announcements/vehicle-manufacturer-transitions-to-fleet-for-endpoint-security">
|
||||
<div purpose="card-content">
|
||||
<h5>Vulnerability management</h5>
|
||||
<p>Detect, prioritize, and understand security risks and flaws.</p>
|
||||
</div>
|
||||
<div purpose="card-chevron">
|
||||
<svg purpose="chevron" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
|
||||
<path d="M1.35712 1L5.64283 6L1.35712 11" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
<a purpose="feature-card" class="card" href="https://www.linkedin.com/pulse/managing-santa-via-gitops-skip-sync-server-allen-houchins-3ni1c" target="_blank" no-icon>
|
||||
<div purpose="card-content">
|
||||
<h5>Binary authorization <span>Coming soon</span></h5>
|
||||
<p>Only allow trusted, pre-approved software to run.</p>
|
||||
</div>
|
||||
<div purpose="card-chevron">
|
||||
<svg purpose="chevron" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
|
||||
<path d="M1.35712 1L5.64283 6L1.35712 11" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
||||
<div purpose="page-section" class="mb-0">
|
||||
<div purpose="homepage-text-block">
|
||||
<h2>Freedom at every level</h2>
|
||||
<p>Manage devices your way, without vendor limits. Fleet gives you full control and supports the choices that work for your organization.</p>
|
||||
|
|
@ -138,8 +76,8 @@
|
|||
|
||||
<div purpose="feature-text">
|
||||
<div purpose="feature-block">
|
||||
<h5>All features, any deployment</h5>
|
||||
<p>Let us host Fleet for you or deploy it yourself. You get the same experience either way.</p>
|
||||
<h5>All features, flexible deployment</h5>
|
||||
<p>Unlike other solutions, you can let us host Fleet for you or deploy it yourself. You get the same experience either way.</p>
|
||||
</div>
|
||||
<div purpose="feature-block">
|
||||
<h5>UI, API, or GitOps</h5>
|
||||
|
|
@ -153,52 +91,18 @@
|
|||
|
||||
</div>
|
||||
|
||||
<a purpose="statistics" class="d-flex" href="/testimonials" no-underline>
|
||||
<div purpose="statistics-column">
|
||||
<div purpose="customers" class="d-none d-sm-block">
|
||||
<h4>100+</h4>
|
||||
<p>customers</p>
|
||||
</div>
|
||||
<div purpose="countries" class="d-block d-sm-none">
|
||||
<h4>90+</h4>
|
||||
<p>countries</p>
|
||||
</div>
|
||||
<div purpose="devices">
|
||||
<h4>2,000,000+</h4>
|
||||
<p>computing devices</p>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="statistics-column">
|
||||
<div purpose="countries" class="d-none d-sm-block">
|
||||
<h4>90+</h4>
|
||||
<p>countries</p>
|
||||
</div>
|
||||
<div purpose="customers" class="d-block d-sm-none">
|
||||
<h4>100+</h4>
|
||||
<p>customers</p>
|
||||
</div>
|
||||
<div purpose="response-time">
|
||||
<h4>8 minutes</h4>
|
||||
<p>avg support response time</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a purpose="quote" class="d-block" href="/announcements/consolidate-multiple-tools-with-fleet" no-underline>
|
||||
<img purpose="quote-logo" alt="Stripe logo" src="/images/social-proof-logo-stripe-67x32@2x.png">
|
||||
<p purpose="quote-text">
|
||||
Fleet helped us avoid being forced to the cloud by our current MDM provider. We were able to migrate everything over to Fleet a few weeks ahead of our renewal, and now Stripe is in control.
|
||||
</p>
|
||||
<div purpose="quote-attribution">
|
||||
<img alt="Scott MacVicar" purpose="quote-author-image" src="/images/testimonial-author-scott-macvicar-100x100@2x.png">
|
||||
<p purpose="name">Scott MacVicar</p>
|
||||
<p purpose="job-title">Head of Developer Infrastructure and Corporate Technology</p>
|
||||
</div>
|
||||
</a>
|
||||
<div purpose="testimonials-header">
|
||||
<h2>What people are saying</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<scrollable-tweets :testimonials="testimonialsForScrollableTweets"></scrollable-tweets>
|
||||
<div purpose="homepage-content" class="container">
|
||||
<div purpose="page-section">
|
||||
<div purpose="comparison-section">
|
||||
<h2>How does Fleet compare?</h2>
|
||||
<p>Considering a move to Fleet? See how we compare:</p>
|
||||
<h2>Moving to Fleet?</h2>
|
||||
<p>See how Fleet compares with your other options.</p>
|
||||
<div purpose="comparison-table-switch" class="d-flex d-sm-none">
|
||||
<div purpose="comparison-table-switch-option" :class="[comparisonTableMode === 'it' ? 'selected' : '']" @click="clickSwitchComparisonMode('it')">IT</div>
|
||||
<div purpose="comparison-table-switch-option" :class="[comparisonTableMode === 'security' ? 'selected' : '']" @click="clickSwitchComparisonMode('security')">Security</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue