mirror of
https://github.com/fleetdm/fleet
synced 2026-05-23 17:08:53 +00:00
Update pricing.ejs (#7777)
* Update pricing.ejs Chris and I worked on changes to pricing.ejs. Changes include: - Changed plan descriptions to provide more context for users to identify which plan is the best for their organization. - Fixed up styles to match Figma. Theory being that if we present features to users for which they have little context, it's more difficult to make an informed decision. Therefore a brief summary provides more context than a few bullets. * Update pricing.ejs * Update pricing.ejs * Update pricing.ejs fixed up a line height. * Update pricing.ejs repositioned summary text.
This commit is contained in:
parent
c743b6ae08
commit
0d16974fd6
1 changed files with 39 additions and 110 deletions
149
website/views/pages/pricing.ejs
vendored
149
website/views/pages/pricing.ejs
vendored
|
|
@ -2,136 +2,65 @@
|
|||
<div class="pb-5">
|
||||
<div
|
||||
style="max-width: 1260px"
|
||||
class="container-fluid pt-5 px-2 px-sm-4 mx-auto"
|
||||
class="container-fluid pt-3 px-2 px-sm-4 mx-auto"
|
||||
>
|
||||
<section id="pricing-section" class="container-fluid px-1 d-flex flex-column justify-content-center pt-5 mx-auto">
|
||||
<h1 class="text-center">Choose your plan</h1>
|
||||
<h1 style="font-size: 28px; line-height: 38px; margin-bottom: 0;" class="text-center">Choose your plan</h1>
|
||||
<p class="text-center mb-5">
|
||||
Choose the right plan for where your organization is at today.
|
||||
Telemetry that scales with your organization.
|
||||
</p>
|
||||
<div class="d-flex justify-content-center p-0">
|
||||
<div class="container-fluid d-flex flex-wrap justify-content-center p-0">
|
||||
<div style="max-width: 384px;" class="w-100 mx-md-3 mx-0">
|
||||
<div style="border-radius: 15px" class="card mb-4">
|
||||
<div class="card-body">
|
||||
<div style="min-height: 125px" class="text-center mt-4">
|
||||
<div class="text-center mt-4">
|
||||
<p class="font-weight-bold mb-0">
|
||||
Free
|
||||
</p>
|
||||
<h2 style="color: #6b6cfa">$0</h2>
|
||||
<p style="padding-bottom: 28px" class="mb-0">/host/month</p>
|
||||
<h2 style="color: #6b6cfa; line-height: 32px;">$0</h2>
|
||||
<p class="mb-0" style="line-height: 24px;">/host/month</p>
|
||||
<p style="color: #8f8ea1; font-size: 12px; line-height:20px;" class="mb-0">
|
||||
(Really, it's free.)
|
||||
</p>
|
||||
</div>
|
||||
<div style="max-width: 242px;" class="mx-auto mb-4">
|
||||
<p style="font-size:14px; line-height:20px;" class="text-center my-3">
|
||||
A flexible solution to get accurate, actionable data from your servers and workstations.
|
||||
</p>
|
||||
</div>
|
||||
<a
|
||||
style="max-width: 242px"
|
||||
class="btn btn-block btn-lg btn-info my-3 mx-auto"
|
||||
style="max-width: 242px; font-size:16px;"
|
||||
class="btn btn-block btn-lg btn-info mt-3 mb-4 mx-auto"
|
||||
href="/try-fleet/register"
|
||||
>Get started</a
|
||||
>
|
||||
<div
|
||||
style="max-width: 242px; min-height: 150px"
|
||||
class="mx-auto mb-4"
|
||||
>
|
||||
<p
|
||||
style="padding-left: 32px"
|
||||
class="position-relative my-3"
|
||||
>
|
||||
<img
|
||||
alt="a circle with a checkmark"
|
||||
src="/images/check-circle-16x16@2x.png"
|
||||
style="width: 16px; height: 16px; left: 0; top: 4px"
|
||||
class="position-absolute"
|
||||
/>
|
||||
Open source
|
||||
</p>
|
||||
<p
|
||||
style="padding-left: 32px"
|
||||
class="position-relative my-3"
|
||||
>
|
||||
<img
|
||||
alt="a circle with a checkmark"
|
||||
src="/images/check-circle-16x16@2x.png"
|
||||
style="width: 16px; height: 16px; left: 0; top: 4px"
|
||||
class="position-absolute"
|
||||
/>
|
||||
Community supported
|
||||
</p>
|
||||
<p
|
||||
style="padding-left: 32px"
|
||||
class="position-relative my-3"
|
||||
>
|
||||
<img
|
||||
alt="a circle with a checkmark"
|
||||
src="/images/check-circle-16x16@2x.png"
|
||||
style="width: 16px; height: 16px; left: 0; top: 4px"
|
||||
class="position-absolute"
|
||||
/>
|
||||
Bring your own production environment
|
||||
</p>
|
||||
</div>
|
||||
>Sign up for Sandbox</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="max-width: 384px;" class="w-100 mx-0 mx-md-3">
|
||||
<div style="border-radius: 15px" class="card mb-4">
|
||||
<div class="card-body">
|
||||
<div style="min-height: 125px" class="text-center mt-4">
|
||||
<div class="text-center mt-4">
|
||||
<p class="font-weight-bold mb-0">
|
||||
Premium
|
||||
</p>
|
||||
<h2 style="color: #6b6cfa">$2</h2>
|
||||
<p class="mb-0">/host/month</p>
|
||||
<p style="color: #8f8ea1; font-size: 13px" class="mb-0">
|
||||
<h2 style="color: #6b6cfa; line-height: 32px;">$2</h2>
|
||||
<p class="mb-0" style="line-height: 24px;">/host/month</p>
|
||||
<p style="color: #8f8ea1; font-size: 12px; line-height:20px;" class="mb-0">
|
||||
(USD, billed annually at $24)
|
||||
</p>
|
||||
</div>
|
||||
<a
|
||||
style="max-width: 242px"
|
||||
class="btn btn-block btn-lg btn-info my-3 mx-auto"
|
||||
href="/customers/register"
|
||||
>
|
||||
Start now
|
||||
</a>
|
||||
<div
|
||||
style="max-width: 242px; min-height: 150px"
|
||||
class="position-relative mx-auto mb-4"
|
||||
>
|
||||
<p
|
||||
style="padding-left: 32px"
|
||||
class="position-relative my-3"
|
||||
>
|
||||
<img
|
||||
alt="a circle with a checkmark"
|
||||
src="/images/check-circle-16x16@2x.png"
|
||||
style="width: 16px; height: 16px; left: 0; top: 4px"
|
||||
class="position-absolute"
|
||||
/>
|
||||
Multiple teams (RBAC)
|
||||
</p>
|
||||
<p
|
||||
style="padding-left: 32px"
|
||||
class="position-relative my-3"
|
||||
>
|
||||
<img
|
||||
alt="a circle with a checkmark"
|
||||
src="/images/check-circle-16x16@2x.png"
|
||||
style="width: 16px; height: 16px; left: 0; top: 4px"
|
||||
class="position-absolute"
|
||||
/>
|
||||
Enterprise support
|
||||
</p>
|
||||
<p
|
||||
style="padding-left: 32px"
|
||||
class="position-relative my-3"
|
||||
>
|
||||
<img
|
||||
alt="a circle with a checkmark"
|
||||
src="/images/check-circle-16x16@2x.png"
|
||||
style="width: 16px; height: 16px; left: 0; top: 4px"
|
||||
class="position-absolute"
|
||||
/>
|
||||
Self-managed agent autoupdates
|
||||
<div style="max-width: 242px;" class="mx-auto mb-4">
|
||||
<p style="font-size:14px; line-height:20px;" class="text-center my-3">
|
||||
An enterprise plan that delivers rich endpoint data with dedicated support to organizations at scale.
|
||||
</p>
|
||||
</div>
|
||||
<a
|
||||
style="max-width: 242px; font-size:16px;"
|
||||
class="btn btn-block btn-lg btn-info mt-3 mb-4 mx-auto"
|
||||
href="/customers/register">
|
||||
Get your license key
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -146,7 +75,7 @@
|
|||
<div class="card-body py-md-5 pl-3 pr-2 px-md-5">
|
||||
<div class="row mb-4">
|
||||
<div class="col-7">
|
||||
<p class="m-0" style="color: #8b8fa2">SUPPORT</p>
|
||||
<p class="m-0" style="font-weight: bold;">Support</p>
|
||||
</div>
|
||||
<div class="col-2 m-0 px-0 px-md-2">
|
||||
<p class="text-center" style="font-weight: bold; font-size: 15px">
|
||||
|
|
@ -251,8 +180,8 @@
|
|||
</div>
|
||||
<div class="row mb-4 mt-5">
|
||||
<div class="col-10 col-sm-8">
|
||||
<p class="m-0" style="color: #8b8fa2">
|
||||
INVENTORY MANAGEMENT
|
||||
<p class="m-0" style="font-weight: bold;">
|
||||
Inventory management
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-1 col-sm-2"></div>
|
||||
|
|
@ -434,7 +363,7 @@
|
|||
</div>
|
||||
<div class="row mb-4 mt-5">
|
||||
<div class="col-10 col-sm-8">
|
||||
<p class="m-0" style="color: #8b8fa2">COLLABORATION</p>
|
||||
<p class="m-0" style="font-weight: bold;">Collaboration</p>
|
||||
</div>
|
||||
<div class="col-1 col-sm-2"></div>
|
||||
<div class="col-1 col-sm-3"></div>
|
||||
|
|
@ -564,8 +493,8 @@
|
|||
</div>
|
||||
<div class="row mb-4 mt-5">
|
||||
<div class="col-7 pr-0 pr-md-2">
|
||||
<p class="m-0" style="color: #8b8fa2">
|
||||
SECURITY AND COMPLIANCE
|
||||
<p class="m-0" style="font-weight: bold;">
|
||||
Security and compliance
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-2"></div>
|
||||
|
|
@ -698,7 +627,7 @@
|
|||
</div>
|
||||
<div class="row mb-4 mt-5">
|
||||
<div class="col-7 pr-0 pr-md-2">
|
||||
<p class="m-0" style="color: #8b8fa2">MONITORING</p>
|
||||
<p class="m-0" style="font-weight: bold;">Monitoring</p>
|
||||
</div>
|
||||
<div class="col-2"></div>
|
||||
<div class="col-2"></div>
|
||||
|
|
@ -926,7 +855,7 @@
|
|||
</div>
|
||||
<div class="row mb-4 mt-5">
|
||||
<div class="col-7">
|
||||
<p class="m-0" style="color: #8b8fa2">DATA OUTPUTS</p>
|
||||
<p class="m-0" style="font-weight: bold;">Data outputs</p>
|
||||
</div>
|
||||
<div class="col-2"></div>
|
||||
<div class="col-2"></div>
|
||||
|
|
@ -989,7 +918,7 @@
|
|||
</div>
|
||||
<div class="row mb-4 mt-5">
|
||||
<div class="col-7">
|
||||
<p class="m-0" style="color: #8b8fa2">DEPLOYMENT</p>
|
||||
<p class="m-0" style="font-weight: bold;">Deployment</p>
|
||||
</div>
|
||||
<div class="col-2"></div>
|
||||
<div class="col-2"></div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue