remove waves, lint fixes

This commit is contained in:
eashaw 2022-01-24 15:35:53 -06:00
parent f1ee372699
commit 9534fced18
2 changed files with 86 additions and 93 deletions

View file

@ -23,34 +23,34 @@
bottom: 2px;
margin-left: 8px;
}
a & a:active{
a & a:active & a:hover {
text-decoration: none;
}
[purpose="platform-banner-background"] {
[purpose='platform-banner-background'] {
background: linear-gradient(100.68deg, #1F1D42 0%, #00FFF0 100%);
overflow: hidden;
}
[purpose="platform-feature-image"]{
[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"] {
[purpose='platform-content'] {
padding-top: 100px;
max-width: 1400px;
padding-left: 100px;
padding-right: 100px;
}
[purpose="platform-section"] {
[purpose='platform-section'] {
padding-top: 140px;
}
[purpose="platform-user-story"]{
[purpose='platform-user-story'] {
margin-top: 40px;
padding: 30px 24px;
max-height: 180px;
@ -61,7 +61,7 @@
color: #F9FAFC;
overflow: hidden;
a {
font-weight: 700
font-weight: 700;
}
svg {
position: fixed;
@ -77,23 +77,23 @@
position: fixed;
display: inline;
height: 120px;
z-index:1;
z-index: 1;
left: 60px;
bottom: 30px;
}
}
[purpose="platform-banner"] {
color:#F9FAFC;
[purpose='platform-banner'] {
color: #F9FAFC;
position: relative;
padding: 100px 80px 0px 80px;
height: 520px;
[purpose="platform-banner-text"] {
[purpose='platform-banner-text'] {
max-width: 544px;
z-index: 2;
padding-bottom: 140px;
}
[purpose="platform-banner-hero"] {
[purpose='platform-banner-hero'] {
img {
display: inline-block;
height: 100%;
@ -102,23 +102,15 @@
bottom: -90px;
z-index: 1;
}
svg {
position: absolute;
height: 100%;
width: 100%;
top: 0;
right: 0;
z-index: 0;
}
}
[purpose="banner-curve"] {
[purpose='banner-curve'] {
z-index: 2;
position: absolute;
left: -25px;
bottom: -1px;
}
}
[purpose="next-steps"] {
[purpose='next-steps'] {
padding-top: 80px;
padding-bottom: 120px;
.card {
@ -128,12 +120,12 @@
box-shadow: 1px 2px 2px rgba(197, 199, 209, 0.2);
border-radius: 16px;
padding: 32px;
border-radius: 16px;
a {
position: relative;
bottom: 5px;
color: #192147;
font-weight: 700;
text-decoration: none;
}
img {
display: inline;
@ -141,7 +133,7 @@
}
}
[purpose="platform-logos"] {
[purpose='platform-logos'] {
padding-top: 24px;
img {
height: 92px;
@ -150,7 +142,7 @@
}
}
[purpose="platform-bullet-list"] {
[purpose='platform-bullet-list'] {
p {
padding-left: 24px;
text-indent: -24px;
@ -163,19 +155,18 @@
@media (min-width: 1199px) {
[purpose="platform-content"] {
[purpose='platform-content'] {
padding-top: 100px;
max-width: 1400px;
padding-left: 100px;
padding-right: 100px;
}
[purpose="platform-banner"] {
[purpose='platform-banner'] {
[purpose="platform-banner-hero"] {
[purpose='platform-banner-hero'] {
img {
display: inline-block;
// height: 100%;
width: 850px;
position: relative;
right: 0px;
@ -189,13 +180,13 @@
@media (max-width: 1199px) {
[purpose="platform-banner"] {
color:#F9FAFC;
[purpose='platform-banner'] {
color: #F9FAFC;
position: relative;
[purpose="platform-banner-text"] {
[purpose='platform-banner-text'] {
max-width: 544px;
}
[purpose="platform-banner-hero"] {
[purpose='platform-banner-hero'] {
img {
width: 850px;
position: relative;
@ -205,7 +196,7 @@
}
}
}
[purpose="platform-content"] {
[purpose='platform-content'] {
padding-top: 80px;
padding-left: 40px;
padding-right: 40px;
@ -213,23 +204,22 @@
}
@media (max-width: 991px) {
[purpose="platform-banner"] {
[purpose='platform-banner'] {
padding: 60px 40px 0px 40px;
color:#F9FAFC;
color: #F9FAFC;
position: relative;
height: 740px;
[purpose="platform-banner-text"] {
[purpose='platform-banner-text'] {
max-width: 520px;
padding-bottom: 80px;
}
[purpose="platform-banner-hero"] {
[purpose='platform-banner-hero'] {
img {
position: relative;
width: 100%;
right: -45px;
right: -25px;
top: 0px;
}
}
}
@ -237,7 +227,7 @@
@media (max-width: 767px) {
[purpose="platform-user-story"]{
[purpose='platform-user-story'] {
max-height: 180px;
margin-top: 40px;
// padding: 31px 24px;
@ -252,38 +242,38 @@
margin-block-end: 4px;
}
}
[purpose="next-steps"] {
[purpose='next-steps'] {
.card {
padding: 32px 60px;
margin-bottom: 16px;
}
}
[purpose="platform-feature-image"]{
[purpose='platform-feature-image'] {
padding-top: 60px;
margin-left: auto;
margin-right: auto;
margin-top: -15px;
}
[purpose="platform-content"] {
[purpose='platform-content'] {
padding-top: 80px;
padding-left: 120px;
padding-right: 120px;
}
[purpose="platform-section"] {
[purpose='platform-section'] {
padding-top: 80px;
}
[purpose="platform-banner"] {
[purpose='platform-banner'] {
padding: 60px 40px 0px 40px;
color:#F9FAFC;
color: #F9FAFC;
position: relative;
height: 780px;
[purpose="platform-banner-text"] {
[purpose='platform-banner-text'] {
max-width: 520px;
padding-bottom: 60px;
}
[purpose="platform-banner-hero"] {
[purpose='platform-banner-hero'] {
img {
position: relative;
right: -25px;
@ -300,27 +290,39 @@
font-size: 26px;
line-height: 54px;
}
[purpose="platform-section"] {
[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: 0px;
[purpose='platform-content'] {
padding-top: 20px;
padding-left: 40px;
padding-right: 40px;
}
[purpose="platform-banner"] {
[purpose='platform-banner'] {
padding-top: 60px;
color:#F9FAFC;
color: #F9FAFC;
position: relative;
height: 700px;
[purpose="platform-banner-text"] {
[purpose='platform-banner-text'] {
max-width: 520px;
padding-bottom: 40px;
}
[purpose='platform-banner-hero'] {
img {
position: relative;
right: 11px;
top: -10px;
width: 110%;
}
}
}
[purpose="platform-user-story"]{
[purpose='platform-user-story'] {
margin-top: 40px;
padding: 31px 24px;
min-height: 375px;
@ -347,7 +349,7 @@
position: relative;
display: inline;
height: 120px;
z-index:1;
z-index: 1;
top: -20px;
left: 0px;
margin-left: auto;
@ -355,7 +357,7 @@
}
}
[purpose="platform-logos"] {
[purpose='platform-logos'] {
img {
height: auto;
width: 150px;

View file

@ -9,22 +9,13 @@
<p>Fleet allows you to harness the power of osquery to stream accurate, real-time data from all of your devices. Its easy to deploy at scale, granular and open source.</p>
<div class="flex-row row justify-content-around mx-md-0 mx-4">
<a href="/get-started" class="btn btn-primary col-md-6 col-12">Try it out</a>
<a style="color:#F9FAFC;" href="https://calendly.com/fleetdm/demo" target="_blank" class="btn col-md-6 col-12">Schedule a demo <img class="d-inline" src="/images/platform/icon-right-arrow-white-16x16@2x.png"></a>
<a style="color:#F9FAFC;" href="https://calendly.com/fleetdm/demo" target="_blank" class="btn col-md-6 col-12">Schedule a demo <img class="d-inline" alt="A small white arrow pointing to the right" src="/images/platform/icon-right-arrow-white-16x16@2x.png"></a>
</div>
</div>
<div class="col-lg-1"></div>
<div class="col-lg-6 col-12 px-0 px-sm-auto" purpose="platform-banner-hero">
<img class="d-none d-lg-inline" src="/images/platform/platform-hero-850x523@2x.png">
<img class="d-inline d-lg-none" src="/images/platform/platform-hero-660x430@2x.png">
<svg viewBox="0 0 1240 506" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1645.32 114.355C1730.67 87.0884 1753.93 -11.1946 1841.61 1.67706C1964.19 19.673 1882.29 323.194 1882.29 323.194L41.7563 726.003L0.151166 517.511C0.151166 517.511 127.085 421.332 225.114 397.767C320.823 374.759 379.484 418.817 476.159 400.012C595.706 376.758 636.359 294.476 755.117 267.643C864.664 242.892 931.9 285.026 1041.82 261.868C1169.73 234.916 1216.19 152.715 1343.77 124.257C1459.04 98.5424 1533.07 150.215 1645.32 114.355Z" fill="white" fill-opacity="0.05"/>
</svg>
<svg viewBox="0 0 1120 520" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1431.07 -121.429C1503.63 -168.844 1500.04 -266.296 1585.09 -276.967C1704.01 -291.886 1690.82 -23.9738 1690.82 -23.9738L80.9263 830.805L0.959998 678.617C0.959998 678.617 94.565 556.344 179.897 509.098C263.21 462.97 329.232 488.81 414.526 446.343C520 393.828 536.738 306.77 640.556 251.13C736.322 199.805 809.843 221.64 906.361 171.703C1018.69 113.586 1040.86 25.1036 1152.48 -34.3258C1253.34 -88.0274 1335.65 -59.0704 1431.07 -121.429Z" fill="white" fill-opacity="0.15"/>
</svg>
<svg viewBox="0 0 969 520" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1100.17 -227.133C1153.27 -299.302 1114.42 -392.527 1192.96 -433.567C1302.77 -490.944 1414.61 -197.136 1414.61 -197.136L160.863 1209.26L4.80768 1064.88C4.80768 1064.88 51.1279 912.505 116.665 835.89C180.651 761.088 254.004 762.328 321.238 690.362C404.38 601.369 388.999 510.89 469.402 419.462C543.568 335.126 622.735 329.776 698.134 246.514C785.883 149.614 775.252 55.7925 861.837 -42.1246C940.078 -130.604 1030.34 -132.216 1100.17 -227.133Z" fill="white" fill-opacity="0.15" shape-rendering="crispEdges"/>
</svg>
<img class="d-none d-lg-inline" alt="The Fleet instance and fleetctl command line tool" src="/images/platform/platform-hero-850x523@2x.png">
<img class="d-inline d-lg-none" alt="The Fleet instance and fleetctl command line tool" src="/images/platform/platform-hero-660x430@2x.png">
</div>
<div purpose="banner-curve">
<svg width="803" height="116" viewBox="0 0 803 116" fill="none" xmlns="http://www.w3.org/2000/svg">
@ -44,17 +35,17 @@
<img src="/images/platform/icon-aws-112x92@2x.png" alt="Amazon Web Services">
</div>
<div class="col-12 col-sm-6 justify-content-sm-start justify-content-center d-flex pl-sm-0">
<img src="/images/platform/icon-gcp-112x92@2x.png" alt="Google Cloud">
<img src="/images/platform/icon-gcp-112x92@2x.png" alt="Google Cloud Platform">
<img src="/images/platform/icon-azure-112x92@2x.png" alt="Microsoft Azure">
</div>
</div>
<div style="max-width: 673px;" purpose="platform-bullet-list" class="pt-3 mx-auto">
<div class="row px-3">
<div class="row">
<div class="col-md-6 col-12"><p>Identify vulnerabilities on devices.</p></div>
<div class="col-md-6 col-12"><p>Recognize out-of-policy user behavior.</p></div>
</div>
<div class="row px-3">
<div class="row">
<div class="col-md-6 col-12"><p>Pinpoint potential data leaks.</p></div>
<div class="col-md-6 col-12"><p>Verify changes made with other systems.</p></div>
</div>
@ -73,7 +64,7 @@
</div>
</div>
<div class="col-md-6 col-12 px-0 px-sm-auto">
<img purpose="platform-feature-image" src="/images/platform/platform-feature-image-1-598x345@2x.png">
<img purpose="platform-feature-image" alt="Easily detect and monitor vulnerable software" src="/images/platform/platform-feature-image-1-598x345@2x.png">
</div>
</div>
</div>
@ -98,7 +89,7 @@
<div purpose="platform-section">
<div class="flex-row row justify-content-around">
<div class="col-md-6 col-12 px-0 px-sm-auto order-last order-md-first">
<img style="transform-origin: bottom left;" purpose="platform-feature-image" src="/images/platform/platform-feature-image-2-598x410@2x.png">
<img style="transform-origin: bottom left;" purpose="platform-feature-image" alt="See up-to-date information about devices" src="/images/platform/platform-feature-image-2-598x410@2x.png">
</div>
<div class="col-md-6 col-12 ">
<h2>Keep an accurate inventory of all your devices</h2>
@ -128,14 +119,14 @@
</div>
</div>
<div class="col-md-6 col-12 px-0 px-sm-auto">
<img purpose="platform-feature-image" src="/images/platform/platform-feature-image-3-598x367@2x.png">
<img purpose="platform-feature-image" alt="Set policies for for specific teams" src="/images/platform/platform-feature-image-3-598x367@2x.png">
</div>
</div>
</div>
<div purpose="platform-section">
<div class="flex-row row">
<div class="col-12">
<div class="col-12 text-center">
<h2>Automate security workflows in a single application</h2>
<div purpose="platform-bullet-list">
<p>Collect and send accurate security events to any external SIEM or data platform.</p>
@ -144,14 +135,14 @@
</div>
</div>
</div>
<div purpose="platform-logos" class="flex-row row justify-content-center">
<img src="/images/platform/icon-panther-112x92@2x.png" alt="Panther Labs">
<img src="/images/platform/icon-jamf-112x92@2x.png" alt="Jamf">
<img src="/images/platform/icon-splunk-112x92@2x.png" alt="Splunk">
<img src="/images/platform/icon-kandji-112x92@2x.png" alt="Kandji">
<img src="/images/platform/icon-elastic-112x92@2x.png" alt="Elastic">
<img src="/images/platform/icon-snowflake-112x92@2x.png" alt="Snowflake">
</div>
<div purpose="platform-logos" class="flex-row row justify-content-center">
<img src="/images/platform/icon-panther-112x92@2x.png" alt="Panther Labs">
<img src="/images/platform/icon-jamf-112x92@2x.png" alt="Jamf">
<img src="/images/platform/icon-splunk-112x92@2x.png" alt="Splunk">
<img src="/images/platform/icon-kandji-112x92@2x.png" alt="Kandji">
<img src="/images/platform/icon-elastic-112x92@2x.png" alt="Elastic">
<img src="/images/platform/icon-snowflake-112x92@2x.png" alt="Snowflake">
</div>
</div>
</div>
@ -159,7 +150,7 @@
<div purpose="platform-user-story" class="mx-auto">
<div class="flex-sm-row flex-column row justify-content-around justify-content-sm-between text-center text-sm-left">
<div class="col-12 col-sm-2 col-md-4 pb-md-0 pb-5">
<img src="/images/platform/logo-schrodinger-120x120@2x.png">
<img alt="Schrodinger logo" src="/images/platform/logo-schrodinger-120x120@2x.png">
<svg class="d-none d-sm-inline" viewBox="0 0 238 181" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="53.9834" cy="90.2871" r="183.5" fill="white"/>
</svg>
@ -170,7 +161,7 @@
<div class="col-12 col-sm-7 col-md-8 flex-grow-1 justify-content-end align-self-end pt-sm-0 pl-sm-4 pl-md-3 pr-sm-0">
<h3>Fleet user story</h3>
<p>Jason Walton gives insight into how his team uses Fleet and osquery at Schrödinger.</p>
<a class="mt-3 mt-sm-0">Read more <img src="/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png"></a>
<a class="mt-3 mt-sm-0">Read more <img alt="A vibrant blue arrow pointing right" src="/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png"></a>
</div>
</div>
</div>
@ -187,22 +178,22 @@
<div purpose="next-steps" class="row card-deck flex-md-row flex-column">
<div class="card card-body text-center">
<img class="mx-auto" style="width: 40px; height: 40px; margin-bottom: 16px;" src="/images/platform/logo-fleet-brandmark-40x40@2x.png">
<img class="mx-auto" style="width: 40px; height: 40px; margin-bottom: 16px;" alt="Fleet logo" src="/images/platform/logo-fleet-brandmark-40x40@2x.png">
<h3>Try Fleet</h3>
<p>Install Fleet and osquery locally on your device in less than 5 minutes.</p>
<a href="/get-started" class="mt-auto">Try it out<img src="/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png"></a>
<a href="/get-started" class="mt-auto">Try it out<img alt="A vibrant blue arrow pointing right" src="/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png"></a>
</div>
<div class="card card-body text-center">
<img class="mx-auto" style="width: 40px; height: 40px; margin-bottom: 16px;" src="/images/platform/icon-queries-40x40@2x.png">
<img class="mx-auto" style="width: 40px; height: 40px; margin-bottom: 16px;" alt="A vibrant blue magnifying glass" src="/images/platform/icon-queries-40x40@2x.png">
<h3>Queries</h3>
<p>A growing collection of useful queries for organizations deploying Fleet and osquery.</p>
<a href="/queries" class="mt-auto">Go to query library<img src="/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png"></a>
<a href="/queries" class="mt-auto">Go to query library<img alt="A vibrant blue arrow pointing right" src="/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png"></a>
</div>
<div class="card card-body text-center">
<img class="mx-auto" style="width: 40px; height: 40px; margin-bottom: 16px;" src="/images/logo-slack-24x24@2x.png">
<img class="mx-auto" style="width: 40px; height: 40px; margin-bottom: 16px;" alt="Slack logo" src="/images/logo-slack-24x24@2x.png">
<h3>Join the community</h3>
<p>Join the conversation or ask for help in our Slack channel.</p>
<a href="https://osquery.slack.com/join/shared_invite/zt-h29zm0gk-s2DBtGUTW4CFel0f0IjTEw#/" target="_blank" class="mt-auto">Join on Slack<img src="/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png"></a>
<a href="https://osquery.slack.com/join/shared_invite/zt-h29zm0gk-s2DBtGUTW4CFel0f0IjTEw#/" target="_blank" class="mt-auto">Join on Slack<img alt="A vibrant blue arrow pointing right" src="/images/platform/icon-right-arrow-vibrant-blue-16x16@2x.png"></a>
</div>
</div>
</div>