diff --git a/website/assets/images/logo-fleet-professional-support-48x48@2x.png b/website/assets/images/logo-fleet-professional-support-48x48@2x.png new file mode 100644 index 0000000000..e999905590 Binary files /dev/null and b/website/assets/images/logo-fleet-professional-support-48x48@2x.png differ diff --git a/website/assets/images/support-quote-adam-anklewicz-86x72@2x.png b/website/assets/images/support-quote-adam-anklewicz-86x72@2x.png new file mode 100644 index 0000000000..e73e55f0a6 Binary files /dev/null and b/website/assets/images/support-quote-adam-anklewicz-86x72@2x.png differ diff --git a/website/assets/styles/pages/support.less b/website/assets/styles/pages/support.less index 7ea7d4fa97..22f146097a 100644 --- a/website/assets/styles/pages/support.less +++ b/website/assets/styles/pages/support.less @@ -36,8 +36,31 @@ box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.05); } + [purpose='support-cards'] { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 24px; + margin: 0 auto; + + a { + text-decoration: none; + min-width: 0px; + &:hover { + color: @core-fleet-black-75; + } + &:nth-child(-n+3) [purpose='support-card'] { + min-height: 221px; + } + &:nth-child(n+4) [purpose='support-card'] { + min-height: 200px; + } + } + } + [purpose='support-card'] { cursor: pointer; + width: 100%; + justify-content: center; img { height: auto; width: 48px; @@ -53,14 +76,10 @@ line-height: 21px; margin-bottom: 0px; } - height: 318px; background: #FFFFFF; - border: 1px solid #E2E4EA; + border: 1px solid @core-fleet-black-10; border-radius: 16px; - padding: 40px; - margin-left: 12px; - margin-right: 12px; - margin-bottom: 30px; + padding: 24px; box-shadow: none; &:hover { @@ -68,42 +87,45 @@ } } - - [purpose='community-cards'] { - margin-bottom: 30px; - a { - text-decoration: none; - min-width: 0px; - &:hover { - color: @core-fleet-black-75; - } - } - [purpose='support-card'] { - width: 100%; - height: 200px; - img { - margin-right: 12px; - } - } - } - [purpose='support-cards'] { - a { - text-decoration: none; - min-width: 0px; - &:hover { - color: @core-fleet-black-75; - } - } + [purpose='support-quote'] { + display: flex; flex-direction: column; - [purpose='support-row'] { - flex-direction: row; - width: 100%; - } - a { - width: 33%; + align-items: center; + text-align: center; + max-width: 668px; + margin: 0 auto; + margin-top: 80px; + gap: 24px; + + img { + width: 86px; + height: 72px; } + [purpose='quote-text'] { + font-size: 18px; + line-height: 1.5; + font-style: italic; + color: @core-fleet-black-75; + margin-bottom: 0px; + } + [purpose='quote-author-info'] { + [purpose='quote-author-name'] { + color: @core-fleet-black; + font-weight: @bold; + font-size: 14px; + line-height: 150%; + margin-bottom: 0px; + } + + [purpose='quote-author-title'] { + color: @core-fleet-black-75; + font-size: 14px; + line-height: 150%; + margin-bottom: 0px; + } + } } @media (min-width: 1201px) { @@ -113,99 +135,39 @@ padding-bottom: 80px; } - [purpose='support-cards'] { - flex-direction: row; max-width: 1120px; - [purpose='support-row'] { - flex-direction: row; - } } - [purpose='support-row'] { - [purpose='support-card'] { - width: 341px; - height: 221px; - } - } - - [purpose='community-cards'] { - margin-bottom: 50px; - [purpose='support-card'] { - width: 384px; - height: 178px; - } - } [purpose='page-title'] { margin-bottom: 80px; } - - } @media (max-width: 1200px) { [purpose='page-container'] { padding-top: 60px; padding-bottom: 60px; } - - [purpose='community-cards'] { - a { - width: 50%; - } - [purpose='support-card'] { - height: 178px; - } - } - [purpose='support-cards'] { - [purpose='support-card'] { - height: 200px; - } - } } @media (max-width: 991px) { [purpose='support-cards'] { - [purpose='support-card'] { - height: 221px; - } + grid-template-columns: repeat(2, 1fr); + } + [purpose='support-card'] { + height: 100%; + text-align: center; + align-items: center; + } + [purpose='support-quote'] { + margin-top: 60px; } - } - @media (max-width: 768px) { - + @media (max-width: 767px) { [purpose='support-cards'] { - flex-direction: column; - [purpose='support-row'] { - flex-direction: column; - } - a { - width: 100%; - } + grid-template-columns: 1fr; } - - [purpose='community-cards'] { - a { - width: 100%; - } - [purpose='support-card'] { - height: 230px; - } - } - } @media (max-width: 576px) { - - [purpose='support-cards'] { - [purpose='support-card'] { - text-align: center; - align-items: center; - } - } - [purpose='community-cards'] { - [purpose='support-card'] { - padding: 32px 40px 40px 40px; - height: fit-content; - } - } [purpose='page-title'] { margin-bottom: 40px; max-width: 380px; @@ -218,33 +180,9 @@ } } @media (max-width: 375px) { - h1 { line-height: 43px; } - - [purpose='support-card'] { - margin-bottom: 30px; - margin-right: 0px; - margin-left: 0px; - - } - [purpose='community-cards'] { - [purpose='support-card'] { - padding-top: 32px; - margin-bottom: 16px; - - } - } - [purpose='support-cards'] { - [purpose='support-card'] { - margin-bottom: 16px; - - } - } - } - - } diff --git a/website/views/pages/support.ejs b/website/views/pages/support.ejs index 55bab64c30..adcf613855 100644 --- a/website/views/pages/support.ejs +++ b/website/views/pages/support.ejs @@ -2,62 +2,61 @@
-

Ask the community

-

Fleet has an active open-source community of kind and helpful people. If you have a question about something that isn't in the documentation, we hang out in:

- <%primaryBuyingSituation%> -
-
- -
-
- Macadmins logo -

macadmins // #fleet

-
-

Chat about next-gen MDM, packaging, Apple, Windows, desktop Linux, apps, scripting. (And all things IT.)

-
- - -
-
- Osquery logo -

osquery // #fleet

-
-

<%= primaryBuyingSituation === 'security-misc' ? 'Chat about securing servers, laptops, and more.' : - primaryBuyingSituation === 'security-vm' ? 'Chat about the future of security engineering, vulnerability management, OT/ICS, cybersecurity, and more.' : - 'Chat about posture, detection, vulns, reporting. (And all things cybersecurity.)' - %> -

-
- -
-
-

Support

-

Ask a question, chat with engineers, or get in touch with the Fleet team. For answers to commonly asked questions, check the FAQ.

+

How can we help?

+

Ask a question, chat with the community, or get in touch with the Fleet team. For answers to commonly asked questions, check the FAQ.

-
-
- -
- Bug report -

Bug report

-

Report a bug to help us improve.

-
- - -
- Suggestions -

Suggest a feature

-

Propose a new feature or enhancement in Fleet.

-
- - -
- Ask us anything -

Ask us anything

-

Can’t find what you’re looking for? Get in touch.

-
- +
+ +
+ Fleet professional support +

Professional support

+

Direct access to engineers via email, phone, or a dedicated Slack channel. See SLAs.

+
+ + +
+ Macadmins logo +

macadmins // #fleet

+

Chat about next-gen MDM, Apple, Windows, Linux, scripting, and all things IT.

+
+ + +
+ Osquery logo +

osquery // #fleet

+

Chat about posture, detection, vulns, reporting, and all things cybersecurity.

+
+ + +
+ Bug report +

Bug report

+

Report a bug to help us improve.

+
+ + +
+ Suggestions +

Suggest a feature

+

Propose a new feature or enhancement.

+
+ + +
+ Ask us anything +

Ask us anything

+

Need help? Get in touch.

+
+ +
+ +
+ Adam Anklewicz +

“Their support is huge. I just post in our joint Slack channel and within minutes I will get a reply and we can have a proper conversation.”

+
+

Adam Anklewicz

+

Manager of IT Endpoint Engineering at Thumbtack