diff --git a/website/api/controllers/microsoft-proxy/view-remediate.js b/website/api/controllers/microsoft-proxy/view-remediate.js new file mode 100644 index 0000000000..4d23d6543b --- /dev/null +++ b/website/api/controllers/microsoft-proxy/view-remediate.js @@ -0,0 +1,27 @@ +module.exports = { + + + friendlyName: 'View remediate', + + + description: 'Display "Remediate" page.', + + + exits: { + + success: { + viewTemplatePath: 'pages/microsoft-proxy/remediate' + } + + }, + + + fn: async function () { + + // Respond with view. + return {}; + + } + + +}; diff --git a/website/api/controllers/microsoft-proxy/view-turn-on-mdm.js b/website/api/controllers/microsoft-proxy/view-turn-on-mdm.js new file mode 100644 index 0000000000..ff975f00b9 --- /dev/null +++ b/website/api/controllers/microsoft-proxy/view-turn-on-mdm.js @@ -0,0 +1,27 @@ +module.exports = { + + + friendlyName: 'View turn on mdm', + + + description: 'Display "Turn on mdm" page.', + + + exits: { + + success: { + viewTemplatePath: 'pages/microsoft-proxy/turn-on-mdm' + } + + }, + + + fn: async function () { + + // Respond with view. + return {}; + + } + + +}; diff --git a/website/assets/images/fleet-logo-muted-69x24@2x.png b/website/assets/images/fleet-logo-muted-69x24@2x.png new file mode 100644 index 0000000000..01692c6d55 Binary files /dev/null and b/website/assets/images/fleet-logo-muted-69x24@2x.png differ diff --git a/website/assets/images/remediate-step-1-456x170@2x.png b/website/assets/images/remediate-step-1-456x170@2x.png new file mode 100644 index 0000000000..ca6bfef86d Binary files /dev/null and b/website/assets/images/remediate-step-1-456x170@2x.png differ diff --git a/website/assets/images/remediate-step-2-456x170@2x.png b/website/assets/images/remediate-step-2-456x170@2x.png new file mode 100644 index 0000000000..0b90d8b1d2 Binary files /dev/null and b/website/assets/images/remediate-step-2-456x170@2x.png differ diff --git a/website/assets/images/remediate-step-3-456x170@2x.png b/website/assets/images/remediate-step-3-456x170@2x.png new file mode 100644 index 0000000000..f9dae1d14c Binary files /dev/null and b/website/assets/images/remediate-step-3-456x170@2x.png differ diff --git a/website/assets/images/remediate-step-4-456x170@2x.png b/website/assets/images/remediate-step-4-456x170@2x.png new file mode 100644 index 0000000000..5100b62663 Binary files /dev/null and b/website/assets/images/remediate-step-4-456x170@2x.png differ diff --git a/website/assets/images/turn-on-mdm-step-2-456x170@2x.png b/website/assets/images/turn-on-mdm-step-2-456x170@2x.png new file mode 100644 index 0000000000..69eda9f9dc Binary files /dev/null and b/website/assets/images/turn-on-mdm-step-2-456x170@2x.png differ diff --git a/website/assets/js/pages/microsoft-proxy/remediate.page.js b/website/assets/js/pages/microsoft-proxy/remediate.page.js new file mode 100644 index 0000000000..1de8b67630 --- /dev/null +++ b/website/assets/js/pages/microsoft-proxy/remediate.page.js @@ -0,0 +1,25 @@ +parasails.registerPage('remediate', { + // ╦╔╗╔╦╔╦╗╦╔═╗╦ ╔═╗╔╦╗╔═╗╔╦╗╔═╗ + // ║║║║║ ║ ║╠═╣║ ╚═╗ ║ ╠═╣ ║ ║╣ + // ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝ ╚═╝ ╩ ╩ ╩ ╩ ╚═╝ + data: { + //… + }, + + // ╦ ╦╔═╗╔═╗╔═╗╦ ╦╔═╗╦ ╔═╗ + // ║ ║╠╣ ║╣ ║ ╚╦╝║ ║ ║╣ + // ╩═╝╩╚ ╚═╝╚═╝ ╩ ╚═╝╩═╝╚═╝ + beforeMount: function() { + //… + }, + mounted: async function() { + //… + }, + + // ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗ + // ║║║║ ║ ║╣ ╠╦╝╠═╣║ ║ ║║ ║║║║╚═╗ + // ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝ + methods: { + //… + } +}); diff --git a/website/assets/js/pages/microsoft-proxy/turn-on-mdm.page.js b/website/assets/js/pages/microsoft-proxy/turn-on-mdm.page.js new file mode 100644 index 0000000000..4b130f8477 --- /dev/null +++ b/website/assets/js/pages/microsoft-proxy/turn-on-mdm.page.js @@ -0,0 +1,25 @@ +parasails.registerPage('turn-on-mdm', { + // ╦╔╗╔╦╔╦╗╦╔═╗╦ ╔═╗╔╦╗╔═╗╔╦╗╔═╗ + // ║║║║║ ║ ║╠═╣║ ╚═╗ ║ ╠═╣ ║ ║╣ + // ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝ ╚═╝ ╩ ╩ ╩ ╩ ╚═╝ + data: { + //… + }, + + // ╦ ╦╔═╗╔═╗╔═╗╦ ╦╔═╗╦ ╔═╗ + // ║ ║╠╣ ║╣ ║ ╚╦╝║ ║ ║╣ + // ╩═╝╩╚ ╚═╝╚═╝ ╩ ╚═╝╩═╝╚═╝ + beforeMount: function() { + //… + }, + mounted: async function() { + //… + }, + + // ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗ + // ║║║║ ║ ║╣ ╠╦╝╠═╣║ ║ ║║ ║║║║╚═╗ + // ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝ + methods: { + //… + } +}); diff --git a/website/assets/styles/importer.less b/website/assets/styles/importer.less index 38e8fe69af..2b98695d1a 100644 --- a/website/assets/styles/importer.less +++ b/website/assets/styles/importer.less @@ -88,3 +88,5 @@ @import 'pages/policy-details.less'; @import 'pages/os-settings.less'; @import 'pages/configuration-builder.less'; +@import 'pages/microsoft-proxy/turn-on-mdm.less'; +@import 'pages/microsoft-proxy/remediate.less'; diff --git a/website/assets/styles/layout.less b/website/assets/styles/layout.less index 310752655e..22d9638e04 100644 --- a/website/assets/styles/layout.less +++ b/website/assets/styles/layout.less @@ -635,7 +635,7 @@ html, body { [purpose='page-wrap'].header-hidden { padding-top: 0px; padding-bottom: 0px; - background: #F9FAFC; + background: #FFF; } // Landing page footer styles diff --git a/website/assets/styles/pages/microsoft-proxy/remediate.less b/website/assets/styles/pages/microsoft-proxy/remediate.less new file mode 100644 index 0000000000..2e1ed29984 --- /dev/null +++ b/website/assets/styles/pages/microsoft-proxy/remediate.less @@ -0,0 +1,101 @@ +#remediate { + background-color: #FFF; + + h1 { + color: var(--Fleet-Black-100, #192147); + text-align: center; + + /* Title LF (FKA h2) */ + font-family: Inter; + font-size: 32px; + font-style: normal; + font-weight: 800; + line-height: 38.4px; /* 120% */ + margin-bottom: 24px; + } + + p { + color: var(--Fleet-Black-75, #515774); + text-align: center; + + /* Body SM (FKA Card text) */ + font-family: Inter; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 21px; /* 150% */ + margin-bottom: 0px; + } + [purpose='page-container'] { + padding: 120px 0px 60px 0px; + } + [purpose='page-content'] { + max-width: 528px; + margin-left: auto; + margin-right: auto; + } + [purpose='remediation-steps'] { + margin-top: 80px; + margin-bottom: 80px; + counter-reset: custom-counter; + list-style-type: none; + padding-inline-start: 0px; + padding: 0; + ul > li { + text-indent: 0px; + margin-left: 0px; + } + > li { + counter-increment: custom-counter; + margin-left: 36px; + text-indent: -36px; + padding-left: 0px; + margin-bottom: 40px; + img { + max-height: 170px; + margin-top: 20px; + max-width: 100%; + } + p { + display: inline; + margin-bottom: 0px; + } + } + > li::before { + content: counter(custom-counter); + background-color: #E2E4EA; + width: 24px; + font-size: 13px; + display: inline-block; + border-radius: 50%; + margin-right: 10px; + padding: 2px 4px; + text-align: center; + line-height: 20px; + text-indent: 0px; + } + } + [purpose='bottom-logo'] { + position: absolute; + bottom: 60px; + right: calc(~'50% - 34.5px'); + img { + height: 24px; + } + } + @media(max-width: 991px) { + [purpose='page-container'] { + padding: 80px 32px 40px 32px; + } + } + @media(max-width: 767px) { + [purpose='page-container'] { + padding: 80px 24px 40px 24px; + } + } + @media(max-width: 575px) { + [purpose='page-container'] { + padding: 48px 16px 40px 26px; + } + } +} diff --git a/website/assets/styles/pages/microsoft-proxy/turn-on-mdm.less b/website/assets/styles/pages/microsoft-proxy/turn-on-mdm.less new file mode 100644 index 0000000000..f758e0e7e1 --- /dev/null +++ b/website/assets/styles/pages/microsoft-proxy/turn-on-mdm.less @@ -0,0 +1,103 @@ +#turn-on-mdm { + background-color: #FFF; + + h1 { + color: var(--Fleet-Black-100, #192147); + text-align: center; + + /* Title LF (FKA h2) */ + font-family: Inter; + font-size: 32px; + font-style: normal; + font-weight: 800; + line-height: 38.4px; /* 120% */ + margin-bottom: 24px; + } + + p { + color: var(--Fleet-Black-75, #515774); + text-align: center; + + /* Body SM (FKA Card text) */ + font-family: Inter; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 21px; /* 150% */ + margin-bottom: 0px; + } + [purpose='page-container'] { + padding: 120px 0px 60px 0px; + + } + [purpose='page-content'] { + max-width: 528px; + margin-left: auto; + margin-right: auto; + } + [purpose='remediation-steps'] { + margin-top: 80px; + margin-bottom: 80px; + counter-reset: custom-counter; + list-style-type: none; + padding-inline-start: 0px; + padding: 0; + ul > li { + text-indent: 0px; + margin-left: 0px; + } + > li { + counter-increment: custom-counter; + margin-left: 36px; + text-indent: -36px; + padding-left: 0px; + margin-bottom: 40px; + img { + max-height: 170px; + margin-top: 20px; + max-width: 100%; + } + p { + display: inline; + margin-bottom: 0px; + } + } + > li::before { + content: counter(custom-counter); + background-color: #E2E4EA; + width: 24px; + font-size: 13px; + display: inline-block; + border-radius: 50%; + margin-right: 10px; + padding: 2px 4px; + text-align: center; + line-height: 20px; + text-indent: 0px; + } + } + [purpose='bottom-logo'] { + position: absolute; + bottom: 60px; + right: calc(~'50% - 34.5px'); + img { + height: 24px; + } + } + @media(max-width: 991px) { + [purpose='page-container'] { + padding: 80px 32px 40px 32px; + } + } + @media(max-width: 767px) { + [purpose='page-container'] { + padding: 80px 24px 40px 24px; + } + } + @media(max-width: 575px) { + [purpose='page-container'] { + padding: 48px 16px 40px 26px; + } + } +} + diff --git a/website/config/policies.js b/website/config/policies.js index f6f0e5f8d7..e2c2bba7d6 100644 --- a/website/config/policies.js +++ b/website/config/policies.js @@ -73,4 +73,6 @@ module.exports.policies = { 'microsoft-proxy/receive-redirect-from-microsoft': true, 'view-configuration-builder': true, 'android-proxy/*': true, + 'microsoft-proxy/view-remediate': true, + 'microsoft-proxy/view-turn-on-mdm': true, }; diff --git a/website/config/routes.js b/website/config/routes.js index e7c91da817..6e5921616b 100644 --- a/website/config/routes.js +++ b/website/config/routes.js @@ -498,6 +498,22 @@ module.exports.routes = { } }, + 'GET /microsoft-compliance-partner/remediate': { + action: 'microsoft-proxy/view-remediate', + locals: { + showConfigurationProfileLayout: true, + hideStartCTA: true, + } + }, + + 'GET /microsoft-compliance-partner/turn-on-mdm': { + action: 'microsoft-proxy/view-turn-on-mdm', + locals: { + showConfigurationProfileLayout: true, + hideStartCTA: true, + } + }, + // ╦ ╔═╗╔═╗╔═╗╔═╗╦ ╦ ╦═╗╔═╗╔╦╗╦╦═╗╔═╗╔═╗╔╦╗╔═╗ // ║ ║╣ ║ ╦╠═╣║ ╚╦╝ ╠╦╝║╣ ║║║╠╦╝║╣ ║ ║ ╚═╗ // ╩═╝╚═╝╚═╝╩ ╩╚═╝ ╩ ╩╚═╚═╝═╩╝╩╩╚═╚═╝╚═╝ ╩ ╚═╝ diff --git a/website/views/layouts/layout.ejs b/website/views/layouts/layout.ejs index 9bf4a0fc8e..fb98745b43 100644 --- a/website/views/layouts/layout.ejs +++ b/website/views/layouts/layout.ejs @@ -475,6 +475,8 @@ + + diff --git a/website/views/pages/microsoft-proxy/remediate.ejs b/website/views/pages/microsoft-proxy/remediate.ejs new file mode 100644 index 0000000000..7e390b0b7c --- /dev/null +++ b/website/views/pages/microsoft-proxy/remediate.ejs @@ -0,0 +1,35 @@ +
+ +
+
+

Secure your device

+

Your organization has blocked sign-in because your computer is failing some security checks. Follow the steps below to restore access.

+
    +
  1. +

    Click the Fleet icon in your menu bar, and select My device:

    + The Fleet Desktop menu +
    2. +
  2. +

    Navigate to the Policies tab:

    + The Policies tab +
    3. +
  3. +

    Select the failing policies and follow the resolution instructions:

    + Failing policies +
    4. +
  4. +

    Click the Refetch button:

    + Clicking the refetch button on the 'My device' page +
    5. +
  5. +

    Once all policies have a Yes status, you'll be able to log in.

    +
    6. +
+
+ The Fleet logo +
+
+
+ +
+<%- /* Expose server-rendered data as window.SAILS_LOCALS :: */ exposeLocalsToBrowser() %> diff --git a/website/views/pages/microsoft-proxy/turn-on-mdm.ejs b/website/views/pages/microsoft-proxy/turn-on-mdm.ejs new file mode 100644 index 0000000000..a28e1d68a8 --- /dev/null +++ b/website/views/pages/microsoft-proxy/turn-on-mdm.ejs @@ -0,0 +1,27 @@ +
+ +
+
+

Turn on MDM

+

Your organization has blocked sign-in because your computer does not have mobile device management (MDM) turned on. Follow the steps below to resolve.

+
    +
  1. +

    Click the Fleet icon in your menu bar, and select My device:

    + The Fleet Desktop menu +
    2. +
  2. +

    Click Turn on MDM

    + The 'My Device' page in Fleet +
    3. +
  3. +

    Follow the on-screen instructions, then try logging in again.

    +
    4. +
+
+ The Fleet logo +
+
+
+ +
+<%- /* Expose server-rendered data as window.SAILS_LOCALS :: */ exposeLocalsToBrowser() %>