diff --git a/website/api/controllers/view-platform.js b/website/api/controllers/view-platform.js new file mode 100644 index 0000000000..3e8d9a06e4 --- /dev/null +++ b/website/api/controllers/view-platform.js @@ -0,0 +1,27 @@ +module.exports = { + + + friendlyName: 'View platform', + + + description: 'Display "Platform" page.', + + + exits: { + + success: { + viewTemplatePath: 'pages/platform' + } + + }, + + + fn: async function () { + + // Respond with view. + return {}; + + } + + +}; diff --git a/website/assets/images/platform/icon-aws-112x92@2x.png b/website/assets/images/platform/icon-aws-112x92@2x.png new file mode 100644 index 0000000000..4bae56af9a Binary files /dev/null and b/website/assets/images/platform/icon-aws-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-azure-112x92@2x.png b/website/assets/images/platform/icon-azure-112x92@2x.png new file mode 100644 index 0000000000..6709c6a670 Binary files /dev/null and b/website/assets/images/platform/icon-azure-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-bullet-point-6x6@2x.png b/website/assets/images/platform/icon-bullet-point-6x6@2x.png new file mode 100644 index 0000000000..faaba95e8f Binary files /dev/null and b/website/assets/images/platform/icon-bullet-point-6x6@2x.png differ diff --git a/website/assets/images/platform/icon-elastic-112x92@2x.png b/website/assets/images/platform/icon-elastic-112x92@2x.png new file mode 100644 index 0000000000..bf4d5fa2d9 Binary files /dev/null and b/website/assets/images/platform/icon-elastic-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-gcp-112x92@2x.png b/website/assets/images/platform/icon-gcp-112x92@2x.png new file mode 100644 index 0000000000..12db8e7a44 Binary files /dev/null and b/website/assets/images/platform/icon-gcp-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-jamf-112x92@2x.png b/website/assets/images/platform/icon-jamf-112x92@2x.png new file mode 100644 index 0000000000..b8a4643017 Binary files /dev/null and b/website/assets/images/platform/icon-jamf-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-kandji-112x92@2x.png b/website/assets/images/platform/icon-kandji-112x92@2x.png new file mode 100644 index 0000000000..98e12326c8 Binary files /dev/null and b/website/assets/images/platform/icon-kandji-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-laptop-112x92@2x.png b/website/assets/images/platform/icon-laptop-112x92@2x.png new file mode 100644 index 0000000000..39b2f8b22c Binary files /dev/null and b/website/assets/images/platform/icon-laptop-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-munki-112x92@2x.png b/website/assets/images/platform/icon-munki-112x92@2x.png new file mode 100644 index 0000000000..d5c4c65057 Binary files /dev/null and b/website/assets/images/platform/icon-munki-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-panther-112x92@2x.png b/website/assets/images/platform/icon-panther-112x92@2x.png new file mode 100644 index 0000000000..23efa42f94 Binary files /dev/null and b/website/assets/images/platform/icon-panther-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-queries-40x40@2x.png b/website/assets/images/platform/icon-queries-40x40@2x.png new file mode 100644 index 0000000000..c37cba47f5 Binary files /dev/null and b/website/assets/images/platform/icon-queries-40x40@2x.png differ diff --git a/website/assets/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png b/website/assets/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png new file mode 100644 index 0000000000..074e727ff7 Binary files /dev/null and b/website/assets/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png differ diff --git a/website/assets/images/platform/icon-right-arrow-white-16x16@2x.png b/website/assets/images/platform/icon-right-arrow-white-16x16@2x.png new file mode 100644 index 0000000000..86caac8747 Binary files /dev/null and b/website/assets/images/platform/icon-right-arrow-white-16x16@2x.png differ diff --git a/website/assets/images/platform/icon-simple-mdm-112x92@2x.png b/website/assets/images/platform/icon-simple-mdm-112x92@2x.png new file mode 100644 index 0000000000..2c59a436a5 Binary files /dev/null and b/website/assets/images/platform/icon-simple-mdm-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-snowflake-112x92@2x.png b/website/assets/images/platform/icon-snowflake-112x92@2x.png new file mode 100644 index 0000000000..84df0ddfb1 Binary files /dev/null and b/website/assets/images/platform/icon-snowflake-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-splunk-112x92@2x.png b/website/assets/images/platform/icon-splunk-112x92@2x.png new file mode 100644 index 0000000000..11eb96bf1f Binary files /dev/null and b/website/assets/images/platform/icon-splunk-112x92@2x.png differ diff --git a/website/assets/images/platform/icon-tenable-112x92@2x.png b/website/assets/images/platform/icon-tenable-112x92@2x.png new file mode 100644 index 0000000000..8c26c9fed5 Binary files /dev/null and b/website/assets/images/platform/icon-tenable-112x92@2x.png differ diff --git a/website/assets/images/platform/logo-fleet-brandmark-40x40@2x.png b/website/assets/images/platform/logo-fleet-brandmark-40x40@2x.png new file mode 100644 index 0000000000..df2e480144 Binary files /dev/null and b/website/assets/images/platform/logo-fleet-brandmark-40x40@2x.png differ diff --git a/website/assets/images/platform/logo-schrodinger-120x120@2x.png b/website/assets/images/platform/logo-schrodinger-120x120@2x.png new file mode 100644 index 0000000000..a739536cb4 Binary files /dev/null and b/website/assets/images/platform/logo-schrodinger-120x120@2x.png differ diff --git a/website/assets/images/platform/platform-feature-image-1-598x345@2x.png b/website/assets/images/platform/platform-feature-image-1-598x345@2x.png new file mode 100644 index 0000000000..98a6d0a856 Binary files /dev/null and b/website/assets/images/platform/platform-feature-image-1-598x345@2x.png differ diff --git a/website/assets/images/platform/platform-feature-image-2-598x410@2x.png b/website/assets/images/platform/platform-feature-image-2-598x410@2x.png new file mode 100644 index 0000000000..409f5ed108 Binary files /dev/null and b/website/assets/images/platform/platform-feature-image-2-598x410@2x.png differ diff --git a/website/assets/images/platform/platform-feature-image-3-598x367@2x.png b/website/assets/images/platform/platform-feature-image-3-598x367@2x.png new file mode 100644 index 0000000000..6d14ebb751 Binary files /dev/null and b/website/assets/images/platform/platform-feature-image-3-598x367@2x.png differ diff --git a/website/assets/images/platform/platform-hero-660x430@2x.png b/website/assets/images/platform/platform-hero-660x430@2x.png new file mode 100644 index 0000000000..f18de0824a Binary files /dev/null and b/website/assets/images/platform/platform-hero-660x430@2x.png differ diff --git a/website/assets/images/platform/platform-hero-850x523@2x.png b/website/assets/images/platform/platform-hero-850x523@2x.png new file mode 100644 index 0000000000..49184ce9ff Binary files /dev/null and b/website/assets/images/platform/platform-hero-850x523@2x.png differ diff --git a/website/assets/js/pages/platform.page.js b/website/assets/js/pages/platform.page.js new file mode 100644 index 0000000000..a31cb85320 --- /dev/null +++ b/website/assets/js/pages/platform.page.js @@ -0,0 +1,25 @@ +parasails.registerPage('platform', { + // ╦╔╗╔╦╔╦╗╦╔═╗╦ ╔═╗╔╦╗╔═╗╔╦╗╔═╗ + // ║║║║║ ║ ║╠═╣║ ╚═╗ ║ ╠═╣ ║ ║╣ + // ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝ ╚═╝ ╩ ╩ ╩ ╩ ╚═╝ + data: { + //… + }, + + // ╦ ╦╔═╗╔═╗╔═╗╦ ╦╔═╗╦ ╔═╗ + // ║ ║╠╣ ║╣ ║ ╚╦╝║ ║ ║╣ + // ╩═╝╩╚ ╚═╝╚═╝ ╩ ╚═╝╩═╝╚═╝ + beforeMount: function() { + //… + }, + mounted: async function() { + //… + }, + + // ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗ + // ║║║║ ║ ║╣ ╠╦╝╠═╣║ ║ ║║ ║║║║╚═╗ + // ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝ + methods: { + //… + } +}); diff --git a/website/assets/styles/importer.less b/website/assets/styles/importer.less index 0232b51baa..5a4aafc602 100644 --- a/website/assets/styles/importer.less +++ b/website/assets/styles/importer.less @@ -27,6 +27,7 @@ @import 'pages/homepage.less'; @import 'pages/get-started.less'; @import 'pages/pricing.less'; +@import 'pages/platform.less'; @import 'pages/dashboard/welcome.less'; @import 'pages/entrance/signup.less'; @import 'pages/entrance/confirmed-email.less'; diff --git a/website/assets/styles/layout.less b/website/assets/styles/layout.less index 3fb29638d5..1a45a6e5de 100644 --- a/website/assets/styles/layout.less +++ b/website/assets/styles/layout.less @@ -64,7 +64,7 @@ html, body { .collapse.show { opacity: 1; pointer-events: auto; - z-index: 1; + z-index: 3; } .collapse { opacity: 0; @@ -155,7 +155,7 @@ html, body { .collapse.show { opacity: 1; pointer-events: auto; - z-index: 1; + z-index: 3; } .collapse { opacity: 0; diff --git a/website/assets/styles/pages/platform.less b/website/assets/styles/pages/platform.less new file mode 100644 index 0000000000..9106485c3f --- /dev/null +++ b/website/assets/styles/pages/platform.less @@ -0,0 +1,375 @@ +#platform { + + h2 { + font-size: 24px; + line-height: 32px; + margin-bottom: 24px; + } + h3 { + font-size: 20px; + line-height: 24px; + font-weight: 700; + } + h4 { + font-size: 24px; + line-height: 28px; + font-weight: 400; + } + a > img { + display: inline; + height: 16px; + width: 16px; + position: relative; + bottom: 2px; + margin-left: 8px; + } + a & a:active & a:hover { + text-decoration: none; + } + + [purpose='platform-banner-background'] { + background: linear-gradient(100.68deg, #1F1D42 0%, #00FFF0 100%); + overflow: hidden; + } + + [purpose='platform-feature-image'] { + max-width: 100%; + filter: drop-shadow(0px 3.85401px 24.0876px rgba(0, 0, 0, 0.15)); + border-radius: 4.78295px; + margin-top: -15px; + } + + [purpose='platform-content'] { + padding-top: 100px; + max-width: 1400px; + padding-left: 100px; + padding-right: 100px; + } + + [purpose='platform-section'] { + padding-top: 100px; + } + + [purpose='platform-user-story'] { + margin-top: 80px; + padding: 30px 24px; + max-height: 180px; + max-width: 900px; + background-color: #192147; + filter: drop-shadow(0px 4px 16px rgba(0, 0, 0, 0.1)); + border-radius: 16px; + color: #F9FAFC; + overflow: hidden; + a { + color: #F9FAFC; + font-weight: 700; + text-decoration: none; + } + svg { + position: fixed; + left: -50px; + bottom: 0px; + overflow: hidden; + vertical-align: middle; + z-index: -1; + width: 367px; + height: 180px; + } + img:not(a > img) { + position: fixed; + display: inline; + height: 120px; + z-index: 1; + left: 60px; + bottom: 30px; + } + } + + [purpose='platform-banner'] { + color: #F9FAFC; + position: relative; + padding: 100px 80px 0px 80px; + height: 520px; + [purpose='platform-banner-text'] { + max-width: 544px; + z-index: 2; + padding-bottom: 140px; + } + [purpose='platform-banner-hero'] { + img { + display: inline-block; + height: 100%; + position: absolute; + right: -25px; + bottom: -90px; + z-index: 1; + } + } + [purpose='banner-curve'] { + z-index: 2; + position: absolute; + left: -25px; + bottom: -1px; + } + } + [purpose='next-steps'] { + padding-top: 80px; + padding-bottom: 120px; + .card { + background: #FFFFFF; + border: 1px solid #E2E4EA; + box-sizing: border-box; + box-shadow: 1px 2px 2px rgba(197, 199, 209, 0.2); + border-radius: 16px; + padding: 32px; + a { + position: relative; + bottom: 5px; + color: #192147; + font-weight: 700; + text-decoration: none; + } + img { + display: inline; + } + } + } + + [purpose='platform-logos'] { + padding-top: 24px; + img { + height: 92px; + width: 112px; + display: inline; + } + } + + [purpose='platform-bullet-list'] { + p { + padding-left: 24px; + text-indent: -24px; + } + p::before { + content: url('/images/platform/icon-bullet-point-6x6@2x.png'); + margin-right: 12px; + } + } + + @media (min-width: 1199px) { + + [purpose='platform-content'] { + padding-top: 100px; + max-width: 1400px; + padding-left: 100px; + padding-right: 100px; + } + + [purpose='platform-banner'] { + + [purpose='platform-banner-hero'] { + img { + display: inline-block; + width: 850px; + position: relative; + right: 0px; + top: 0px; + z-index: 1; + bottom: unset; + } + } + } + } + + @media (max-width: 1199px) { + + [purpose='platform-banner'] { + color: #F9FAFC; + position: relative; + [purpose='platform-banner-text'] { + max-width: 544px; + } + [purpose='platform-banner-hero'] { + img { + width: 850px; + position: relative; + right: 0; + top: 0; + z-index: 1; + } + } + } + [purpose='platform-content'] { + padding-top: 80px; + padding-left: 40px; + padding-right: 40px; + } + } + + @media (max-width: 991px) { + [purpose='platform-banner'] { + padding: 60px 40px 0px 40px; + color: #F9FAFC; + position: relative; + height: 740px; + + [purpose='platform-banner-text'] { + max-width: 520px; + padding-bottom: 80px; + } + [purpose='platform-banner-hero'] { + img { + position: relative; + width: 100%; + right: -25px; + top: 0px; + } + } + } + } + + @media (max-width: 767px) { + + [purpose='platform-user-story'] { + max-height: 180px; + margin-top: 40px; + // padding: 31px 24px; + // max-height: 345px; + max-width: fit-content; + background-color: #192147; + filter: drop-shadow(0px 4px 16px rgba(0, 0, 0, 0.1)); + border-radius: 16px; + color: #F9FAFC; + overflow: hidden; + p { + margin-block-end: 4px; + } + } + [purpose='next-steps'] { + .card { + padding: 32px 60px; + margin-bottom: 16px; + } + } + + [purpose='platform-feature-image'] { + padding-top: 60px; + margin-left: auto; + margin-right: auto; + margin-top: -15px; + } + [purpose='platform-content'] { + padding-top: 80px; + padding-left: 120px; + padding-right: 120px; + } + [purpose='platform-section'] { + padding-top: 80px; + } + [purpose='platform-banner'] { + padding: 60px 40px 0px 40px; + color: #F9FAFC; + position: relative; + height: 780px; + + [purpose='platform-banner-text'] { + max-width: 520px; + padding-bottom: 60px; + } + [purpose='platform-banner-hero'] { + img { + position: relative; + right: -25px; + top: 0px; + width: 100%; + } + } + } + + } + + @media (max-width: 576px) { + h1 { + font-size: 28px; + line-height: 54px; + } + [purpose='platform-banner-background'] { + background: linear-gradient(141.32deg, #1F1D42 0%, #00FFF0 91.41%);; + overflow: hidden; + } + [purpose='platform-section'] { + padding-top: 60px; + } + [purpose='platform-content'] { + padding-top: 20px; + padding-left: 40px; + padding-right: 40px; + } + + [purpose='platform-banner'] { + padding-top: 60px; + color: #F9FAFC; + position: relative; + height: 700px; + [purpose='platform-banner-text'] { + max-width: 520px; + padding-bottom: 40px; + } + [purpose='platform-banner-hero'] { + img { + position: relative; + right: 0px; + top: 0px; + width: 110%; + } + } + } + + [purpose='platform-user-story'] { + margin-top: 40px; + padding: 31px 24px; + min-height: 375px; + max-width: 375px; + background-color: #192147; + filter: drop-shadow(0px 4px 16px rgba(0, 0, 0, 0.1)); + border-radius: 16px; + color: #F9FAFC; + overflow: hidden; + p { + margin-block-end: 16px; + } + svg { + position: fixed; + top: 0px; + left: 0px; + overflow: hidden; + vertical-align: middle; + z-index: -1; + width: 100%; + height: auto; + } + img:not(a > img) { + position: relative; + display: inline; + height: 120px; + z-index: 1; + top: -20px; + left: 0px; + margin-left: auto; + margin-right: auto; + } + } + [purpose='platform-logos'] { + img { + height: auto; + width: 150px; + margin: -10px; + display: inline; + } + } + } + @media (max-width: 329px) { + h1 { + font-size: 26px; + } + } +} diff --git a/website/config/policies.js b/website/config/policies.js index 9b0f038c89..932cbdaabe 100644 --- a/website/config/policies.js +++ b/website/config/policies.js @@ -31,5 +31,6 @@ module.exports.policies = { 'download-sitemap': true, 'view-transparency': true, 'view-press-kit': true, + 'view-platform': true, }; diff --git a/website/config/routes.js b/website/config/routes.js index 5bb9d50253..c12246a355 100644 --- a/website/config/routes.js +++ b/website/config/routes.js @@ -137,6 +137,15 @@ module.exports.routes = { } }, + 'GET /platform': { + action: 'view-platform', + locals: { + currentPage: 'platform', + pageTitleForMeta: 'Platform | Fleet for osquery', + pageDescriptionForMeta: 'Learn about the Fleet\'s features.', + } + }, + // ╦ ╔═╗╔═╗╔═╗╔═╗╦ ╦ ╦═╗╔═╗╔╦╗╦╦═╗╔═╗╔═╗╔╦╗╔═╗ diff --git a/website/views/layouts/layout.ejs b/website/views/layouts/layout.ejs index a0b8e5be13..e69b52ecd8 100644 --- a/website/views/layouts/layout.ejs +++ b/website/views/layouts/layout.ejs @@ -95,33 +95,35 @@
Fleet allows you to harness the power of osquery to stream accurate, real-time data from all of your devices. It’s easy to deploy at scale, granular and open source.
+
+
+ Identify vulnerabilities on devices.
Recognize out-of-policy user behavior.
Pinpoint potential data leaks.
Verify changes made with other systems.
Interpret incidents accurately and make decisions using real device data.
+Investigate computers in real-time, asking arbitrary questions.
+Notify your team when a CVE is detected, or if a user changes relevant settings.
+Perform custom remediation actions using osquery extensions.
+
+ Verify whether vulnerable software was actually patched / verify changes made with other systems
+
+ Enroll macOS, Windows, and Linux laptops.
+Enroll servers and containers in any (or multiple) cloud providers or data centers.
+Quickly look up the installed software and OS details for any device.
+Identify outdated, vulnerable, or compromised software, apps, and packages.
+Identify devices with misconfigurations and MDM enrollment issues.
+Verify other agents, like Munki or Falcon, are installed and working properly.
+Verify compliance with accurate, up-to-the-minute data from actual devices.
+Comply with internal processes, controls, and regulations.
+Identify out-of-policy devices.
+Modify policies instantly when standards harden or expand.
+Measure progress towards compliance goals across teams and individuals.
+Audit historical compliance of devices, computers, and teams.
+
+ Collect and send accurate security events to any external SIEM or data platform.
+Enroll computers, update policies, and scan vulnerabilities in a CI/CD workflow.
+Ask your devices anything, using the Fleet GUI, command line, or REST API.
+
+
+
+ Jason Walton gives insight into how his team uses Fleet and osquery at Schrödinger.
+ Read moreFind out how Fleet can benefit your organization by exploring our docs and community. Want to get up and running quicker? Then try out Fleet locally on your device - you’ll be up and running in minutes.
+
+ Install Fleet and osquery locally on your device in less than 5 minutes.
+ Try it outA growing collection of useful queries for organizations deploying Fleet and osquery.
+ Go to query library
+ Join the conversation or ask for help in our Slack channel.
+ Join on Slack