From f623eed47b202047df52d967193f97b4a629e56b Mon Sep 17 00:00:00 2001 From: Eric Date: Mon, 4 Nov 2024 10:58:08 -0600 Subject: [PATCH] Website: Update /queries page (#23472) Changes: - Standard query library: - Added three policies to the Standard query library (tagged as premium) - Changed the `kind` of the "Identify Apple development secrets (macOS)" query to `policy` because it is an informational query (It returns rows of results rather than 1 or 0) and removed its `resolution` value - Updated the build-static-content script to remove platform names from the end of query names (e.g., (macOS)). This is done to keep the URLs for queries the same while hiding them in the UI - Updated the layout of the queries page to match the latest wireframes and updated the page to only show policies - Updated the styles and layout of the queries-details page. --------- Co-authored-by: Rachael Shaw --- .../standard-query-library.yml | 96 +++- website/api/controllers/view-query-library.js | 19 +- website/assets/js/pages/query-detail.page.js | 8 + website/assets/js/pages/query-library.page.js | 73 +-- website/assets/styles/pages/query-detail.less | 414 +++++++++++----- .../assets/styles/pages/query-library.less | 443 +++++++----------- website/config/routes.js | 4 +- website/scripts/build-static-content.js | 2 + website/views/pages/query-detail.ejs | 134 +++--- website/views/pages/query-library.ejs | 320 +++++++------ 10 files changed, 819 insertions(+), 694 deletions(-) diff --git a/docs/01-Using-Fleet/standard-query-library/standard-query-library.yml b/docs/01-Using-Fleet/standard-query-library/standard-query-library.yml index 1abff8a2fc..c44f17f4d2 100644 --- a/docs/01-Using-Fleet/standard-query-library/standard-query-library.yml +++ b/docs/01-Using-Fleet/standard-query-library/standard-query-library.yml @@ -1,5 +1,98 @@ --- apiVersion: v1 +kind: policy +spec: + name: Ensure a password is required to wake the computer from sleep or screen saver is enabled + platforms: macOS + platform: darwin + description: Checks that password is required to wake the computer from sleep or screen saver is enabled. + resolution: | + Automated method: + Ask your system administrator to deploy an MDM profile that ensures a password is required to wake the computer from sleep or screen saver is enabled. + Graphical method: + Perform the following steps to ensure a password is required to wake the computer from sleep or screen saver is enabled: + 1. Open System Settings + 2. Select Lock Screen + 3. Verify that "Require password after screensaver begins or display is turned + off" is set with "After 0 seconds" or "After 5 seconds" + query: |- + SELECT 1 WHERE + EXISTS ( + SELECT 1 FROM managed_policies WHERE + domain='com.apple.screensaver' AND + name='askForPassword' AND + (value = 1 OR value = 'true') AND + username = '' + ) + AND EXISTS ( + SELECT 1 FROM managed_policies WHERE + domain='com.apple.screensaver' AND + name='askForPasswordDelay' AND + value <= 5 AND + username = '' + ) + AND NOT EXISTS ( + SELECT 1 FROM managed_policies WHERE + domain='com.apple.screensaver' AND + name='askForPassword' AND + (value != 1 AND value != 'true') + ) + AND NOT EXISTS ( + SELECT 1 FROM managed_policies WHERE + domain='com.apple.screensaver' AND + name='askForPasswordDelay' AND + value > 5 + ); + purpose: Informational + tags: compliance, CIS, CIS_Level1, premium, + contributors: sharon-fdm +--- +apiVersion: v1 +kind: policy +spec: + name: Ensure auto-update is enabled + platforms: macOS + platform: darwin + description: Checks that the system is configured via MDM to automatically install updates. + resolution: "Ask your system administrator to deploy an MDM profile that enables automatic updates." + query: | + SELECT 1 WHERE + EXISTS ( + SELECT 1 FROM managed_policies WHERE + domain='com.apple.SoftwareUpdate' AND + name='AutomaticCheckEnabled' AND + (value = 1 OR value = 'true') AND + username = '' + ) + AND NOT EXISTS ( + SELECT 1 FROM managed_policies WHERE + domain='com.apple.SoftwareUpdate' AND + name='AutomaticCheckEnabled' AND + (value != 1 AND value != 'true') + ); + purpose: Informational + tags: compliance, CIS, CIS_Level1, premium + contributors: sharon-fdm +--- +apiVersion: v1 +kind: policy +spec: + name: Ensure 'Minimum password length' is set to '14 or more characters' + platforms: win10 + platform: windows + description: | + This policy setting determines the least number of characters that make up a password for a user account. + resolution: | + Automatic method: + Ask your system administrator to establish the recommended configuration via GP, set the following UI path to 14 or more characters + 'Computer Configuration\Policies\Windows Settings\Security Settings\Account Policies\Password Policy\Minimum password length' + query: | + SELECT 1 FROM security_profile_info WHERE minimum_password_length >= 14; + purpose: Informational + tags: compliance, CIS, CIS_Level1, premium + contributors: marcosd4h +--- +apiVersion: v1 kind: query spec: name: Get OpenSSL versions @@ -1006,12 +1099,11 @@ spec: contributors: defensivedepth --- apiVersion: v1 -kind: policy +kind: query spec: name: Identify Apple development secrets (macOS) query: SELECT * FROM keychain_items WHERE label LIKE '%ABCDEFG%'; description: "Identifies certificates associated with Apple development signing and notarization. Replace ABCDEFG with your company's identifier." - resolution: "Ensure your official Apple builds, signing and notarization happen on a centralized system, and remove these certificates from workstations." tags: compliance, inventory, built-in platform: darwin contributors: GuillaumeRoss diff --git a/website/api/controllers/view-query-library.js b/website/api/controllers/view-query-library.js index 135fa3371c..b4d723b92b 100644 --- a/website/api/controllers/view-query-library.js +++ b/website/api/controllers/view-query-library.js @@ -18,10 +18,25 @@ module.exports = { if (!_.isObject(sails.config.builtStaticContent) || !_.isArray(sails.config.builtStaticContent.queries)) { throw {badConfig: 'builtStaticContent.queries'}; } - + let policies = _.where(sails.config.builtStaticContent.queries, {kind: 'policy'}); + let macOsPolicies = _.filter(policies, (policy)=>{ + let platformsForThisPolicy = policy.platform.split(','); + return _.includes(platformsForThisPolicy, 'darwin'); + }); + let windowsPolicies = _.filter(policies, (policy)=>{ + let platformsForThisPolicy = policy.platform.split(','); + return _.includes(platformsForThisPolicy, 'windows'); + }); + let linuxPolicies = _.filter(policies, (policy)=>{ + let platformsForThisPolicy = policy.platform.split(','); + return _.includes(platformsForThisPolicy, 'linux'); + }); // Respond with view. return { - queries: sails.config.builtStaticContent.queries + macOsPolicies, + windowsPolicies, + linuxPolicies, + policies,// FUTURE: remove this once Algolia search is on this page }; } diff --git a/website/assets/js/pages/query-detail.page.js b/website/assets/js/pages/query-detail.page.js index e273a48243..0c13ea8d48 100644 --- a/website/assets/js/pages/query-detail.page.js +++ b/website/assets/js/pages/query-detail.page.js @@ -16,6 +16,14 @@ parasails.registerPage('query-detail', { $('pre code').each((i, block) => { window.hljs.highlightElement(block); }); + $('[purpose="copy-button"]').on('click', async function() { + let code = $(this).siblings('pre').find('code').text(); + $(this).addClass('copied'); + await setTimeout(()=>{ + $(this).removeClass('copied'); + }, 2000); + navigator.clipboard.writeText(code); + }); }, // ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗ diff --git a/website/assets/js/pages/query-library.page.js b/website/assets/js/pages/query-library.page.js index 7da650d012..809d327c37 100644 --- a/website/assets/js/pages/query-library.page.js +++ b/website/assets/js/pages/query-library.page.js @@ -6,23 +6,12 @@ parasails.registerPage('query-library', { inputTextValue: '', inputTimers: {}, searchString: '', // The user input string to be searched against the query library - selectedKind: 'policy', // Initially set to 'policy', the user may select a different option to filter queries by purpose (e.g., "all queries", "informational", "policies") - selectedPlatform: 'all platforms', // Initially set to all, the user may select a different option to filter queries by platform (e.g., "all platforms", "macOS", "Windows", "Linux") - selectedTag: 'built-in', // Initially set to the 'built-in' tag, the user may select a different tag to filter queries by. + selectedPlatform: 'macos', // Initially set to 'macos' }, computed: { - filteredQueries: function () { - return this.queries.filter( - (query) => - this._isIncluded(query.platform, this.selectedPlatform) && - this._isIncluded(query.kind, this.selectedKind) && - this._isIncluded(query.tags, this.selectedTag) - ); - }, - searchResults: function () { - return this._search(this.filteredQueries, this.searchString); + return this._search(this.policies, this.searchString); }, queriesList: function () { @@ -44,51 +33,11 @@ parasails.registerPage('query-library', { // ║║║║ ║ ║╣ ╠╦╝╠═╣║ ║ ║║ ║║║║╚═╗ // ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝ methods: { - clickSelectKind(kind) { - this.selectedKind = kind; - }, clickSelectPlatform(platform) { this.selectedPlatform = platform; }, - clickSelectTag(tag) { - this.selectedTag = tag; - }, - - clickCard: function (querySlug) { - this.goto('/queries/' + querySlug); // we can trust the query slug is url-safe - }, - - clickAvatar: function (contributor) { - this.goto(contributor.htmlUrl); - }, - - getAvatarUrl: function (contributorData) { - return contributorData ? contributorData.avatarUrl : ''; - }, - - getContributorsString: function (contributors) { - if (!contributors) { - return; - } - const displayName = (contributorData) => { - if (contributorData) { - return !contributorData.name - ? contributorData.handle - : contributorData.name; - } - }; - let contributorString = displayName(contributors[0]); - if (contributors.length > 2) { - contributorString += ` and ${contributors.length - 1} others`; - } - if (contributors.length === 2) { - contributorString += ` and ${displayName(contributors[1])}`; - } - return contributorString; - }, - delayInput: function (callback, ms, label) { let inputTimers = this.inputTimers; return function () { @@ -117,27 +66,9 @@ parasails.registerPage('query-library', { textToSearch += ', ' + normalize(contributor.name) + ', ' + normalize(contributor.handle); }); } - if (query.tags) { - query.tags.forEach((tag) => { - textToSearch += ', ' + normalize(tag); - }); - } return (searchTerms.some((term) => textToSearch.includes(term))); }); }, - - _isIncluded: function (data, selectedOption) { - if (selectedOption.startsWith('all') || selectedOption === '') { - return true; - } - if (_.isArray(data)) { - data = data.join(', '); - } - return ( - _.isString(data) && data.toLowerCase().includes(selectedOption.toLowerCase()) - ); - }, - }, }); diff --git a/website/assets/styles/pages/query-detail.less b/website/assets/styles/pages/query-detail.less index f3652f791c..da9bed8c4a 100644 --- a/website/assets/styles/pages/query-detail.less +++ b/website/assets/styles/pages/query-detail.less @@ -1,157 +1,339 @@ #query-detail { - h5 { - font-weight: bold; - font-size: 16px; - line-height: 25px; - } - - h6 { - font-size: 16px; - line-height: 25px; - word-wrap: break-word; + h3 { + padding-bottom: 24px; + padding-top: 32px; + color: #192147; + font-size: 24px; + font-weight: 800; + line-height: 120%; + margin-bottom: 0px; } p { - line-height: 25px; + color: #515774; + font-size: 16px; + font-weight: 400; + line-height: 150%; } - a { + + [purpose='page-container'] { + padding: 64px 64px 32px 64px; + } + [purpose='page-content'] { + margin-left: auto; + margin-right: auto; + max-width: 1072px; + } + + [purpose='breadcrumbs-and-search'] { + margin-bottom: 64px; + max-width: 1072px; + font-size: 14px; + [purpose='breadcrumbs'] { + margin-right: 24px; + } + [purpose='search'] { + // Note: We're using classes here to override the default Docsearch styles; + button { + width: 100%; + cursor: text; + margin: 0; + } + .DocSearch-Button { + border-top-left-radius: 6px; + border-bottom-left-radius: 6px; + border-top-right-radius: 6px; + border-bottom-right-radius: 6px; + border: 1px solid @core-fleet-black-25; + background-color: #FFF; + padding: 6px; + height: 36px; + margin: 0; + width: 256px; + } + .DocSearch-Button:hover { + box-shadow: none; + border: 1px solid @core-fleet-black-25; + color: @core-fleet-black-50; + } + .DocSearch-Search-Icon { + margin-left: 10px; + height: 16px; + width: 16px; + color: @core-fleet-black-50; + stroke-width: 3px; + } + .DocSearch-Button-Keys { + display: none; + } + .input-group:focus-within { + border: 1px solid @core-vibrant-blue; + } + .DocSearch-Button-Placeholder { + font-size: 16px; + font-weight: 400; + padding-left: 12px; + } + [purpose='disabled-search'] { + input { + padding-top: 6px; + padding-bottom: 6px; + border: none; + } &::placeholder { + font-size: 16px; + line-height: 24px; + color: #8B8FA2; + } + .input-group { + border-top-left-radius: 6px; + border-bottom-left-radius: 6px; + border-top-right-radius: 6px; + border-bottom-right-radius: 6px; + border: 1px solid @core-fleet-black-25; + background: #FFF; + } + .input-group:focus-within { + border: 1px solid @core-vibrant-blue; + } + .form-control { + border-radius: 6px; + padding: 6px; + height: 36px; + margin: 0; + width: 212px; + } + .docsearch-input:focus-visible { + outline: none; + } + .ds-input:focus { + outline: rgba(0, 0, 0, 0); + } + .input-group-text { + color: @core-fleet-black-50; + } + .form-control { + height: 36px; + padding: 0px; + font-size: 16px; + } &:focus { + border: none; + } + } + } + + [purpose='breadcrumbs-category'] { + color: #8B8FA2; + margin-right: 8px; + font-size: 14px; + font-weight: 400; + line-height: 150%; /* */ + &:hover { + color: #192147; + text-decoration: none; + } + } + [purpose='breadcrumbs-title'] { + margin-left: 8px; + } + } + + [purpose='policy-name'] { + color: #192147; + font-size: 32px; + font-style: normal; + font-weight: 800; + line-height: 150%; + margin-bottom: 0px; + } + [purpose='policy-description'] { + color: #515774; font-size: 16px; - line-height: 25px; - color: @core-vibrant-blue; + font-style: normal; + font-weight: 400; + line-height: 150%; + margin-bottom: 0px; + padding: 16px 0px 32px 0px; + } + [purpose='policy-details'] { + padding-right: 64px; + max-width: 800px; + } + [purpose='policy-check'] { + padding-bottom: 24px; + } + + [purpose='right-sidebar'] { + width: 256px; + margin-left: 16px; + font-size: 14px; + transition-property: transform; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 500ms; + a:not([purpose='edit-button']) { + margin-bottom: 8px; + display: block; + color: #515774; + &:hover { + text-decoration: none; + color: @core-fleet-black; + } + } + } + [purpose='docs-links'] { + a { + display: block; + } + } + [purpose='social-share-buttons'] { + padding-bottom: 24px; + margin-bottom: 24px; + border-bottom: 1px solid #E2E4EA; + a { + margin-right: 16px; + } + img { + height: 20px; + width: 20px; + } + } + [purpose='policy-platform'] { + border-bottom: 1px solid #E2E4EA; + padding-bottom: 24px; + padding-top: 16px; + margin-bottom: 24px; + h4 { + color: #192147; + font-size: 14px; + font-weight: 700; + line-height: 150%; + padding-bottom: 8px; + margin-bottom: 8px; + } + img { + height: 24px; + } + } + [purpose='edit-button'] { + margin-top: 24px; + img { + width: 16px; + height: 16px; + display: inline; + margin-right: 8px; + } + padding: 6px 8px; + display: block; + color: @core-fleet-black-75; + text-decoration: none; + font-size: 14px; + line-height: 21px; + border-radius: 6px; + width: 102px; + background: rgba(25, 33, 71, 0.05); + &:hover { + background-color: rgba(25, 33, 71, 0.1); + } + &:active { + background-color: rgba(25, 33, 71, 0.1); + } + } + + [purpose='codeblock'] { + padding: 0; + position: relative; + [purpose='copy-button'] { + position: absolute; + top: 11px; + right: 10px; + // padding: 9px; + border-radius: 8px; + height: 32px; + width: 32px; + background: url('/images/icon-copy-16x16@2x.png'); + background-size: 14px 14px; + background-position: center; + background-repeat: no-repeat; + cursor: pointer; + &:hover { + background-color: #F2F2F5; + } + &.copied { + background: url('/images/icon-copy-clicked-checkmark-32x32@2x.png'); + background-size: 32px 32px; + background-repeat: no-repeat; + background-position: center; + } + } } pre { width: 100%; max-width: 100%; - padding: 30px; + padding: 16px 24px; + border: 1px solid #E2E4EA; background: #F9FAFC; - border: 1px solid @core-vibrant-blue-15; border-radius: 4px; - margin-bottom: 0px; + margin-top: 16px; + margin-bottom: 24px; code { + color: #515774; + font-family: 'Source Code Pro'; + font-size: 14px; + font-weight: 400; + line-height: 150%; .hljs-keyword { // SQL keywords (SELECT, FROM, WHERE, IN, etc.) color: #AE6DDF; - white-space: pre; } .hljs-string { // For words wrapped in quotation marks color: #3DB67B; - white-space: pre; } background-color: @ui-off-white; border: none; - word-break: break-word; - white-space: normal; padding: 0; - font-size: 13px; - line-height: 24px; } } - .border-top { - border-color: #E2E4EA; - } - - [purpose='query-tag'] { - font-size: 12px; - font-weight: 700; - padding: 4px 8px; - border-radius: 20px; - background-color: #E2E4EA; - } - - [purpose='requires-mdm-badge'] { - text-transform: uppercase; - background: #6A67FE; - border-radius: 4px; - padding: 4px; - font-weight: 700; - font-size: 10px; - line-height: 10px; - display: inline-block; - color: #FFF; - text-decoration: none; - white-space: nowrap; - } - [purpose='critical-badge'] { - text-transform: uppercase; - background: #FF5C83; - border-radius: 4px; - padding: 4px; - font-weight: 700; - font-size: 10px; - line-height: 10px; - display: inline-block; - color: #FFF; - text-decoration: none; - white-space: nowrap; - } - - - [purpose='remediation'] { - overflow-wrap: break-word; - word-wrap: break-word; - word-break: break-word; - p { - font-size: 16px; - line-height: 24px; + @media (max-width: 991px) { + [purpose='page-container'] { + padding: 32px; + } + [purpose='policy-details'] { + padding-right: 0px; + max-width: 100%; + } + [purpose='right-sidebar'] { + width: 100%; + margin-left: 0px; + } + [purpose='breadcrumbs-and-search'] { + margin-bottom: 32px; } } - [purpose='avatar-frame'] { - width: 24px; - height: 24px; - position: relative; - overflow: hidden; - border-radius: 50%; - &:hover { - cursor: pointer; - } - - img { - display: inline; - margin: 0 auto; - height: 100%; - width: auto; - } - - } - - [purpose='platforms'] { - img { - height: 18px; - width: 18px; - } - } - - @media (min-width: 768px) { - - h5, p, a { - font-size: 18px; - } - - [purpose='avatar-frame'] { - width: 32px; - height: 32px; - } - - [purpose='platforms'] { - img { - height: 24px; - width: 24px; + @media (max-width: 768px) { + [purpose='breadcrumbs-and-search'] { + max-width: 1072px; + font-size: 14px; + [purpose='breadcrumbs'] { + margin-bottom: 24px; + } + [purpose='search'] { + width: 100%; + .DocSearch-Button { + width: 100%; + } } } - } @media (max-width: 575px) { - - h2 { - font-size: 28px; - line-height: 36px; + [purpose='page-container'] { + padding: 32px 24px; } } + } diff --git a/website/assets/styles/pages/query-library.less b/website/assets/styles/pages/query-library.less index 6584078dd2..e2d40393e1 100644 --- a/website/assets/styles/pages/query-library.less +++ b/website/assets/styles/pages/query-library.less @@ -1,66 +1,174 @@ #query-library { - h2 { - padding: 0px 30px 0px 30px; - } - - h5 { - font-size: 18px; - font-weight: bold; - line-height: 25px; - } - - h6 { - font-size: 16px; - line-height: 22px; - padding: 0px 30px 0px 30px; - } a { + color: #515774; + font-family: Inter; font-size: 16px; - color: @core-vibrant-blue; + font-style: normal; + font-weight: 400; + line-height: 24px; + text-decoration-line: underline; } - img { - &.logo { + [purpose='policy-search'] { + img { height: 16px; - width: 16px; + margin-right: 8px; } - &.search { - transform: scale(0.5); + span { + padding-left: 15px; + padding-right: 0px; } - } - - input { + background: #FFF; &::placeholder { font-size: 16px; + color: @core-fleet-black-50; } } + [purpose='page-container'] { + padding: 64px; + } + [purpose='page-content'] { + margin-left: auto; + margin-right: auto; + max-width: 1072px; + } + [purpose='search-and-headline'] { + margin-bottom: 64px; + } + [purpose='page-headline'] { + max-width: 662px; + margin-right: 16px; + } + [purpose='platform-filters'] { + border-bottom: 1px solid #E2E4EA; + margin-bottom: 48px; + [purpose='platform-filter'] { + width: 33%; + display: flex; + padding: 16px 40px; + justify-content: center; + align-items: center; + cursor: pointer; + img { + height: 20px; + margin-right: 10px; + } + p { + color: #192147; + text-align: center; + margin-bottom: 0px; + font-family: Inter; + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 24px; /* 150% */ + white-space: nowrap; + } + &.selected { + border-bottom: 2px solid var(--text-text-brand, #192147); + p { + font-weight: 700; + } + } + } + + + + } + [purpose='policy'] { + padding: 32px 0px; + border-bottom: 1px solid #E2E4EA; + } + [purpose='read-more-link'] { + // margin-bottom: 16px; + span { + font-size: 14px; + color: ; + font-weight: 600; + } + } + [purpose='policy-link'] { + color: unset; + text-decoration: none; + + &:hover { + text-decoration: none; + } + } + [purpose='policy-name-and-description'] { + max-width: 663px; + } + [purpose='policy-name'] { + color: #192147; + font-size: 20px; + font-weight: 800; + line-height: 24px; + margin-bottom: 8px; + } + [purpose='policy-description'] { + margin-top: 16px; + p { + color: #515774; + + /* Body SM (FKA Card text) */ + font-family: Inter; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 21px; /* 150% */ + } + // max-width: 663px; + } + [purpose='contributor-profile-picture'] { + width: 24px; + height: 24px; + margin-right: 6px; + border-radius: 50%; + } + [purpose='contributor-profile-name'] { + font-size: 12px; + line-height: 18px; + } [purpose='requires-mdm-badge'] { - text-transform: uppercase; - background: #6A67FE; + // text-transform: uppercase; + display: flex; + padding: 4px 6px; + justify-content: center; + align-items: center; border-radius: 4px; - padding: 4px; + border: 1px solid #E2E4EA; + background: #F9FAFC; + color: #192147; + font-family: Inter; + font-size: 11px; + font-style: normal; + font-weight: 400; + line-height: 11px; + height: min-content; + white-space: nowrap; + // margin-bottom: 16px; + width: fit-content; + } + [purpose='premium-badge'] { + // margin-bottom: 16px; + margin-right: 16px; + border-radius: 4px; + border: 1px solid #0587FF; + background: #0587FF; + display: flex; + padding: 4px 6px; + justify-content: center; + align-items: center; + text-transform: uppercase; font-weight: 700; font-size: 10px; line-height: 10px; - display: inline; color: #FFF; text-decoration: none; + width: fit-content; } - [purpose='critical-badge'] { - text-transform: uppercase; - background: #FF5C83; - border-radius: 4px; - padding: 4px; - font-weight: 700; - font-size: 10px; - line-height: 10px; - display: inline; - color: #FFF; - text-decoration: none; - } - [purpose='query-tag'] { font-size: 12px; font-weight: 700; @@ -70,16 +178,6 @@ color: #515774; } - [purpose='selected-tag'] { - border-bottom: 1px solid #e1e4e9; - padding: 16px 0; - margin-left: 30px; - margin-right: 30px; - p { - margin-bottom: 0; - line-height: 18px; - } - } [purpose='query-list-empty-state'] { margin-top: 40px; margin-right: 30px; @@ -116,246 +214,31 @@ } } - .btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-secondary.dropdown-toggle:focus { - box-shadow: none; - } - .btn-secondary { - color: @core-vibrant-blue; - background-color: transparent; - border: 0; - cursor: pointer; - &:focus { - border: 0; - box-shadow: none; + @media (max-width: 991px) { + [purpose='page-container'] { + padding: 64px 32px; } - } - - .filters { - height: 54px; - p { - font-size: 16px; - line-height: 25px; + [purpose='policy-name-and-description'] { + max-width: unset; } - } - - .dropdown-menu { - left: 0px; - width: 180px; - border-radius: 8px; - cursor: pointer; - z-index: 1; - - } - .dropdown-item { - padding: 12px; - border-radius: 5px; - cursor: pointer; - &:hover { - background-color: lightness(@core-vibrant-blue, 10%); - margin-right: 15px; - } - } - .dropdown-toggle::after { - margin-left: 4px; - vertical-align: 3px; - border-top: 5px solid; - border-right: 5px solid transparent; - border-bottom: 0; - border-left: 5px solid transparent; - } - - select { - color: @core-vibrant-blue; - border: 0px; - outline: 0; - &:focus { - border: 0px; - } - &.select-purpose { - width: 102px; - } - &.select-platform { - width: 118px; - } - &.mobile { - height: 50px; - width: 100%; - margin-right: 0; - margin-left: 0; - border-radius: 8px; - padding: 12px; - background: url('/images/chevron-down-9x6@2x.png') no-repeat 95% 50%; - background-size: 9px 6px; - -webkit-appearance: none; - } - } - - .library { - max-width: 960px; - margin-top: 80px; - margin-bottom: 0; - } - - .description { - padding: 0px 30px 0px 30px; - p { - color: #515774; - font-size: 16px; - line-height: 25px; - } - a { - outline-bottom: 1px solid #c5c7d1; - text-decoration: underline; - } - } - - .select-mobile-border { - height: 52px; - width: 100%; - margin-right: 0; - margin-left: 0; - border: 1px solid #c5c7d1; - border-radius: 8px; - } - - .select-mobile { - padding-left: 30px; - padding-right: 30px; - padding-bottom: 12px; - } - - .search-mobile { - height: 52px; - padding-left: 30px; - padding-right: 30px; - padding-bottom: 12px; - } - - .filter-and-search-bar { - padding-left: 45px; - padding-right: 45px; - margin-bottom: 0; - min-height: 40px; - } - - .contributors, .platforms { - p { - font-size: 13px; - line-height: 20px; - } - } - - .row { - min-height: 70px; - align-items: center; - } - - .divider { - margin-left: 30px; - margin-right: 30px; - border-bottom: 1px solid; - border-color: #e2e4ea; - } - .query-card { - padding-top: 24px; - padding-bottom: 24px; - } - .card.results { - box-shadow: none; - border: none; - border-radius: 8px; - color: #515774; - &:hover { - .query-card { - background-color: #F8F7FF; - box-shadow: none; - border: none; - border-radius: 8px; - cursor: pointer; - } - text-decoration: none; - } - } - - .card.call-to-action { - background-color: @ui-off-white; - border-radius: 16px; - border-color: @ui-off-white; - box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.1); - margin-bottom: 90px; - width: 100%; - padding: 40px; - p { - margin-block-end: 0px; - } - a { - font-size: 16px; - } - } - - .card-body { - padding: 30px; - padding-top: 0px; - padding-bottom: 0px; - } - - .avatar-frame { - width: 21px; - height: 21px; - position: relative; - overflow: hidden; - border-radius: 50%; - &:hover { - cursor: pointer; - } - - img { - display: inline; - margin: 0 auto; - height: 100%; - width: auto; + [purpose='read-more-link'] { + margin-bottom: 16px; } } @media (max-width: 768px) { - .library { - max-width: 720px; - margin-top: 60px; - } - .results { - margin-top: 16px; + [purpose='policy-search'] { + margin-top: 32px; + width: 100%; + .input-group { + width: 100%; + } } + } @media (max-width: 575px) { - h2 { - font-size: 28px; - line-height: 36px; - } - .library { - max-width: none; - margin-bottom: 0px; - } - - [purpose='selected-tag'] { - margin-left: 30px; - margin-right: 30px; - [purpose='query-tag'] { - margin-top: 8px; - } - } - - .results { - margin-top: 16px; - } - - .contributors, .platforms { - p { - font-size: 13px; - line-height: 20px; - } - } } } diff --git a/website/config/routes.js b/website/config/routes.js index b3a51680bf..bec6660955 100644 --- a/website/config/routes.js +++ b/website/config/routes.js @@ -60,8 +60,8 @@ module.exports.routes = { action: 'view-query-library', locals: { currentSection: 'documentation', - pageTitleForMeta: 'Queries', - pageDescriptionForMeta: 'A growing collection of useful queries for organizations deploying Fleet and osquery.' + pageTitleForMeta: 'Controls and policies', + pageDescriptionForMeta: 'A growing collection of useful controls and policies for organizations deploying Fleet and osquery.' } }, diff --git a/website/scripts/build-static-content.js b/website/scripts/build-static-content.js index e9e8a01afb..75d0d64043 100644 --- a/website/scripts/build-static-content.js +++ b/website/scripts/build-static-content.js @@ -47,6 +47,8 @@ module.exports = { let query = yamlDocument.toJSON().spec; query.kind = yamlDocument.toJSON().kind; query.slug = _.kebabCase(query.name);// « unique slug to use for routing to this query's detail page + // Remove the platform name from query names. This allows us to keep queries at their existing URLs while hiding them in the UI. + query.name = query.name.replace(/\s\(macOS\)|\(Windows\)|\(Linux\)$/, ''); if ((query.resolution !== undefined && !_.isString(query.resolution)) || (query.kind !== 'policy' && _.isString(query.resolution))) { // console.log(typeof query.resolution); queriesWithProblematicResolutions.push(query); diff --git a/website/views/pages/query-detail.ejs b/website/views/pages/query-detail.ejs index cac8a35146..5310b01233 100644 --- a/website/views/pages/query-detail.ejs +++ b/website/views/pages/query-detail.ejs @@ -1,83 +1,77 @@
- -
-
- - back arrow - Back to queries - -
-

{{query.name}}

-
{{query.description ? query.description : '--'}}
-
-
-
-
-
-

{{query.name}}

-
{{query.description ? query.description : '--'}}
-
-
-
-

Query

- 
{{query.query ? query.query : '--'}}
+
+
+
+
+ -
-

Resolve

-

{{query.resolution}}

+
+ <%- query.name %>
-
-
-
-
-
Platforms
-

--

-
- macOS - Windows - Linux - ChromeOS -
-
-
-
-
-
Tags
-
-
requires mdm
-
critical
- -- -
- {{tag}} + +
+
+
+

<%- query.name %>

+

<%- query.description %>

+ +
+

Check

+

Use the policy below to verify

+
+
+ 
<%- query.query %>
-
-
-
-
Contribute to this page
-

View source

+
+
+
+

Platform

+ macOS + Windows + Linux + ChromeOS +
+
+

Share

+
+ Share this article on Hacker News + Share this article on LinkedIn + Share this article on Twitter +
+
+
+ Docs + REST API + Guides + A pencil iconEdit page +
diff --git a/website/views/pages/query-library.ejs b/website/views/pages/query-library.ejs index 14f54ec040..132e3eb9ed 100644 --- a/website/views/pages/query-library.ejs +++ b/website/views/pages/query-library.ejs @@ -1,168 +1,186 @@
-
-
-

- <%= ['eo-it', 'mdm'].includes(primaryBuyingSituation) ? 'Device health checks' : 'Built-in queries' %> - -

-

Fleet's standard query library includes a growing collection of useful queries for organizations deploying Fleet and osquery. Want to add your own query? Please contribute over on GitHub.

-
-
-
-
-
- search -
- -
-
-
-
- -
-
-
-
- -
-
+
+
+
+
+

Controls and policies

+

Fleet's controls and policies library includes a growing collection of policies, OS settings, and scripts for macOS, Windows, and Linux.

+

Contributions welcome over on GitHub.

- -
-
-
-
-

Show

- -
- - - -
-
-
-
-
-

compatible with

- -
- - - - - -
-
-
-
-
-
-
-
- search -
- -
+
+
+
+ + search +
+
-
-
-

Showing {{ selectedKind === 'query' ? 'informational queries' : selectedKind === 'policy' ? 'policies' : 'all queries'}} for {{selectedTag}}

+
+
+

+ macOS + Apple +

-
-
- -
-
-
-
-
{{query.name}}
- Critical - Requires MDM - {{tag}} -
-
-
-

{{query.description}}

-
-
-
-
- a GitHub user avatar -
-
-

contributed by {{getContributorsString(query.contributors)}}

-
-
-
-
-
- - - - -
-
-
+
+

+ Linux + Linux +

+
+
+

+ Windows + Windows +

+
+
+
+
+ <% // Unfiltered macOS policies (server-side-rendered) + for(let policy of macOsPolicies) { + %> +
+
+
+

<%- policy.name %>

+ <% if(policy.tags.includes('premium')) {%>
PREMIUM
<% } %> + <% if(policy.requiresMdm) {%>
mdm-required
<% } %>
-
- - +

<%- policy.description %>

+
Read more
+
+
+
+ + Contributor's GitHub profile picture +

<%= policy.contributors[0].name %>

 +
+
-
-

There are no results that match your filters. Everyone can contribute.

+ <% } %> +
+
+ <% // Filtered macOS policies %> +
+
+
+

{{policy.name}}

+
PREMIUM
+
mdm-required
+
+

{{policy.description}}

+
Read more
+
+
+
+ + Contributor's GitHub profile picture +

{{policy.contributors[0].name}}

 +
+
+
+
+
+ <% // Unfiltered Linux policies (server-side-rendered) + for(let policy of linuxPolicies) { + %> +
+
+
+

<%- policy.name %>

+ <% if(policy.tags.includes('premium')) {%>
PREMIUM
<% } %> + <% if(policy.requiresMdm) {%>
mdm-required
<% } %> +
+

<%- policy.description %>

+
Read more
+
+
+
+ + Contributor's GitHub profile picture +

<%= policy.contributors[0].name %>

 +
+
+
+ <% } %> +
+
+ <% // Filtered Linux policies %> +
+
+
+

{{policy.name}}

+
PREMIUM
+
mdm-required
+
+

{{policy.description}}

+
Read more
+
+
+
+ + Contributor's GitHub profile picture +

{{policy.contributors[0].name}}

 +
+
+
+
+
+ <% // Unfiltered Windows policies (server-side-rendered) + for(let policy of windowsPolicies) { + %> +
+
+
+

<%- policy.name %>

+ <% if(policy.tags.includes('premium')) {%>
PREMIUM
<% } %> + <% if(policy.requiresMdm) {%>
mdm-required
<% } %> +
+

<%- policy.description %>

+
Read more
+
+
+
+ + Contributor's GitHub profile picture +

<%= policy.contributors[0].name %>

 +
+
+
+ <% } %> +
+
+ <% // Filtered windows policies %> +
+
+
+

{{policy.name}}

+
PREMIUM
+
mdm-required
+
+

{{policy.description}}

+
Read more
+
+
+
+ + Contributor's GitHub profile picture +

{{policy.contributors[0].name}}

 +
+
-
-
-
-

Contributors

-

Want to add your own query? Please submit a pull request - - over on GitHub - . -

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