mirror of
https://github.com/fleetdm/fleet
synced 2026-05-23 17:08:53 +00:00
Website: add navigation and search bar to documentation pages (#25795)
Closes #25655 Changes: - Created a new component: `<docs-nav-and-search>`, a component that displays links to documentation pages and a search bar. - Added the `<docs-nav-and-search>` component to documentation pages, query pages, policy pages, vitals pages, app library pages, and osquery schema documentation pages. - Updated the documentation template page to match the latest wireframes. - Updated the osquery schema documentation pages to match the latest wireframes. --------- Co-authored-by: Mike Thomas <78363703+mike-j-thomas@users.noreply.github.com>
This commit is contained in:
Eric
GitHub
parent
33e7af4fa6
commit
84d222d16d
32 changed files with 1270 additions and 1112 deletions
1
website/api/controllers/view-app-details.js
vendored
1
website/api/controllers/view-app-details.js
vendored
|
|
@ -52,6 +52,7 @@ module.exports = {
|
|||
thisApp,
|
||||
// pageDescriptionForMeta,
|
||||
pageTitleForMeta,
|
||||
algoliaPublicKey: sails.config.custom.algoliaPublicKey,
|
||||
};
|
||||
|
||||
}
|
||||
|
|
|
|||
5
website/api/controllers/view-app-library.js
vendored
5
website/api/controllers/view-app-library.js
vendored
|
|
@ -25,7 +25,10 @@ module.exports = {
|
|||
let allApps = sails.config.builtStaticContent.appLibrary;
|
||||
allApps = _.sortBy(allApps, 'name');
|
||||
// Respond with view.
|
||||
return {allApps};
|
||||
return {
|
||||
allApps,
|
||||
algoliaPublicKey: sails.config.custom.algoliaPublicKey,
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
|
|
|
|||
107
website/assets/js/components/docs-nav-and-search.component.js
vendored
Normal file
107
website/assets/js/components/docs-nav-and-search.component.js
vendored
Normal file
|
|
@ -0,0 +1,107 @@
|
|||
/**
|
||||
* <docs-nav-and-search>
|
||||
* -----------------------------------------------------------------------------
|
||||
* A navigation bar with a search box.
|
||||
*
|
||||
* @type {Component}
|
||||
*
|
||||
* -----------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
parasails.registerComponent('docsNavAndSearch', {
|
||||
// ╔═╗╦═╗╔═╗╔═╗╔═╗
|
||||
// ╠═╝╠╦╝║ ║╠═╝╚═╗
|
||||
// ╩ ╩╚═╚═╝╩ ╚═╝
|
||||
props: [
|
||||
'searchFilter',
|
||||
'algoliaPublicKey',
|
||||
'currentSection',
|
||||
],
|
||||
|
||||
// ╦╔╗╔╦╔╦╗╦╔═╗╦ ╔═╗╔╦╗╔═╗╔╦╗╔═╗
|
||||
// ║║║║║ ║ ║╠═╣║ ╚═╗ ║ ╠═╣ ║ ║╣
|
||||
// ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝ ╚═╝ ╩ ╩ ╩ ╩ ╚═╝
|
||||
data: function (){
|
||||
return {
|
||||
//…
|
||||
};
|
||||
},
|
||||
|
||||
// ╦ ╦╔╦╗╔╦╗╦
|
||||
// ╠═╣ ║ ║║║║
|
||||
// ╩ ╩ ╩ ╩ ╩╩═╝
|
||||
template: `
|
||||
<div class="d-block">
|
||||
<div class="d-flex flex-row w-100 justify-content-between">
|
||||
<div purpose="nav-link-container" class="d-flex align-items-center">
|
||||
<div purpose="docs-links" class="d-flex flex-row">
|
||||
<a :class="[currentSection === 'docs' ? 'active' : '']" purpose="docs-top-nav-menu-link" href="/docs" style="text-decoration: none; text-decoration-line: none;">Get started</a>
|
||||
<a :class="[currentSection === 'vitals' ? 'active' : '']" purpose="docs-top-nav-menu-link" href="/vitals" style="text-decoration: none; text-decoration-line: none;">Vitals</a>
|
||||
<a :class="[currentSection === 'queries' ? 'active' : '']" purpose="docs-top-nav-menu-link" href="/queries" style="text-decoration: none; text-decoration-line: none;">Queries</a>
|
||||
<a :class="[currentSection === 'policies' ? 'active' : '']" purpose="docs-top-nav-menu-link" href="/policies" style="text-decoration: none; text-decoration-line: none;">Policies</a>
|
||||
<a :class="[currentSection === 'software' ? 'active' : '']" purpose="docs-top-nav-menu-link" href="/app-library" style="text-decoration: none; text-decoration-line: none;">Software</a>
|
||||
<a :class="[currentSection === 'tables' ? 'active' : '']" purpose="docs-top-nav-menu-link" href="/tables" style="text-decoration: none; text-decoration-line: none;">Data tables</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div purpose="nav-bar-search" id="docsearch-query" class="d-flex" v-if="algoliaPublicKey">
|
||||
<div purpose="disabled-search" class="d-flex">
|
||||
<div class="input-group d-flex flex-nowrap">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text border-0 bg-transparent" >
|
||||
<img style="height: 16px; width: 16px;" class="search" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-control border-0 ">
|
||||
<input class="docsearch-input pr-1"
|
||||
placeholder="Search" aria-label="Search"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`,
|
||||
|
||||
// ╦ ╦╔═╗╔═╗╔═╗╦ ╦╔═╗╦ ╔═╗
|
||||
// ║ ║╠╣ ║╣ ║ ╚╦╝║ ║ ║╣
|
||||
// ╩═╝╩╚ ╚═╝╚═╝ ╩ ╚═╝╩═╝╚═╝
|
||||
beforeMount: function() {
|
||||
//…
|
||||
},
|
||||
mounted: async function() {
|
||||
let filterForSearch = {};
|
||||
if(this.searchFilter){
|
||||
let searchIndexesThatExist = ['docs', 'software', 'queries', 'vitals', 'policies', 'tables', 'handbook', 'software'];
|
||||
if(!searchIndexesThatExist.includes(this.searchFilter)){
|
||||
throw new Error(`Invalid 'searchFilter' value provided to <docs-nav-and-search> component. Please change the searchFilter value to one of: ${searchIndexesThatExist.join(', ')}`);
|
||||
}
|
||||
filterForSearch = {
|
||||
'facetFilters': [`section:${this.searchFilter}`]
|
||||
};
|
||||
}
|
||||
if(this.algoliaPublicKey) {
|
||||
docsearch({
|
||||
appId: 'NZXAYZXDGH',
|
||||
apiKey: this.algoliaPublicKey,
|
||||
indexName: 'fleetdm',
|
||||
container: '#docsearch-query',
|
||||
placeholder: 'Search',
|
||||
debug: false,
|
||||
searchParameters: filterForSearch,
|
||||
});
|
||||
}
|
||||
},
|
||||
beforeDestroy: function() {
|
||||
//…
|
||||
},
|
||||
|
||||
// ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗
|
||||
// ║║║║ ║ ║╣ ╠╦╝╠═╣║ ║ ║║ ║║║║╚═╗
|
||||
// ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝
|
||||
methods: {
|
||||
//…
|
||||
},
|
||||
});
|
||||
15
website/assets/js/pages/app-details.page.js
vendored
15
website/assets/js/pages/app-details.page.js
vendored
|
|
@ -13,21 +13,6 @@ parasails.registerPage('app-details', {
|
|||
//…
|
||||
},
|
||||
mounted: async function() {
|
||||
|
||||
if(this.algoliaPublicKey) { // Note: Docsearch will only be enabled if sails.config.custom.algoliaPublicKey is set. If the value is undefined, the documentation search will be disabled.
|
||||
docsearch({
|
||||
appId: 'NZXAYZXDGH',
|
||||
apiKey: this.algoliaPublicKey,
|
||||
indexName: 'fleetdm',
|
||||
container: '#docsearch-query',
|
||||
placeholder: 'Search',
|
||||
debug: false,
|
||||
searchParameters: {
|
||||
'facetFilters': ['section:queries']
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
$('[purpose="copy-button"]').on('click', async function() {
|
||||
let code = $(this).siblings('pre').find('code').text();
|
||||
$(this).addClass('copied');
|
||||
|
|
|
|||
|
|
@ -3,9 +3,6 @@ parasails.registerPage('basic-documentation', {
|
|||
// ║║║║║ ║ ║╠═╣║ ╚═╗ ║ ╠═╣ ║ ║╣
|
||||
// ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝ ╚═╝ ╩ ╩ ╩ ╩ ╚═╝
|
||||
data: {
|
||||
|
||||
isDocsLandingPage: false,
|
||||
|
||||
inputTextValue: '',
|
||||
inputTimers: {},
|
||||
searchString: '',
|
||||
|
|
@ -19,6 +16,7 @@ parasails.registerPage('basic-documentation', {
|
|||
scrollDistance: 0,
|
||||
navSectionsByDocsSectionSlug: {},
|
||||
lastScrollTop: 0,
|
||||
modal: undefined,
|
||||
},
|
||||
|
||||
computed: {
|
||||
|
|
@ -31,9 +29,6 @@ parasails.registerPage('basic-documentation', {
|
|||
// ║ ║╠╣ ║╣ ║ ╚╦╝║ ║ ║╣
|
||||
// ╩═╝╩╚ ╚═╝╚═╝ ╩ ╚═╝╩═╝╚═╝
|
||||
beforeMount: function() {
|
||||
if (this.thisPage.url === '/docs') {
|
||||
this.isDocsLandingPage = true;
|
||||
}
|
||||
|
||||
this.breadcrumbs = _.trim(this.thisPage.url, /\//).split(/\//);
|
||||
|
||||
|
|
@ -80,31 +75,13 @@ parasails.registerPage('basic-documentation', {
|
|||
return pagesBySectionSlug;
|
||||
})();
|
||||
// Adding a scroll event listener for scrolling sidebars and showing the back to top button.
|
||||
if(!this.isDocsLandingPage){
|
||||
window.addEventListener('scroll', this.handleScrollingInDocumentation);
|
||||
}
|
||||
window.addEventListener('scroll', this.handleScrollingInDocumentation);
|
||||
},
|
||||
|
||||
mounted: async function() {
|
||||
|
||||
// Set a currentDocsSection value to display different Fleet premium CTAs based on what section is being viewed.
|
||||
if(!this.isDocsLandingPage){
|
||||
this.currentDocsSection = this.thisPage.url.split(/\//).slice(-2)[0];
|
||||
}
|
||||
|
||||
// Algolia DocSearch
|
||||
if(this.algoliaPublicKey) { // Note: Docsearch will only be enabled if sails.config.custom.algoliaPublicKey is set. If the value is undefined, the documentation search will be disabled.
|
||||
docsearch({
|
||||
appId: 'NZXAYZXDGH',
|
||||
apiKey: this.algoliaPublicKey,
|
||||
indexName: 'fleetdm',
|
||||
container: (this.isDocsLandingPage ? '#docsearch-query-landing' : '#docsearch-query'),
|
||||
clickAnalytics: true,
|
||||
searchParameters: {
|
||||
'facetFilters': ['section:docs']
|
||||
},
|
||||
});
|
||||
}
|
||||
this.currentDocsSection = this.thisPage.url.split(/\//).slice(-2)[0];
|
||||
|
||||
// Handle hashes in urls when coming from an external page.
|
||||
if(window.location.hash){
|
||||
|
|
@ -337,6 +314,16 @@ parasails.registerPage('basic-documentation', {
|
|||
left: 0,
|
||||
behavior: 'smooth',
|
||||
});
|
||||
},
|
||||
clickOpenMobileSubtopicsNav: function() {
|
||||
this.modal = 'subtopics';
|
||||
},
|
||||
clickOpenMobileDocsNav: function() {
|
||||
this.modal = 'table-of-contents';
|
||||
},
|
||||
closeModal: async function() {
|
||||
this.modal = '';
|
||||
await this.forceRender();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ parasails.registerPage('osquery-table-details', {
|
|||
// ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝ ╚═╝ ╩ ╩ ╩ ╩ ╚═╝
|
||||
data: {
|
||||
//…
|
||||
selectedPlatform: 'all',
|
||||
selectedPlatform: 'apple',
|
||||
search: '',
|
||||
showTableNav: false,
|
||||
userFriendlyPlatformNames: {
|
||||
|
|
@ -14,13 +14,15 @@ parasails.registerPage('osquery-table-details', {
|
|||
'chrome': 'ChromeOS',
|
||||
'all': 'All platforms'
|
||||
},
|
||||
modal: undefined,
|
||||
},
|
||||
|
||||
computed: {
|
||||
filteredTables: function () {
|
||||
let platformToFilterBy = this.selectedPlatform !== 'apple' ? this.selectedPlatform : 'darwin';
|
||||
return this.allTables.filter(
|
||||
(table) =>
|
||||
this._isIncluded(table.platforms, this.selectedPlatform)
|
||||
table.platforms.includes(platformToFilterBy)
|
||||
);
|
||||
},
|
||||
numberOfTablesDisplayed: function() {
|
||||
|
|
@ -32,36 +34,15 @@ parasails.registerPage('osquery-table-details', {
|
|||
// ║ ║╠╣ ║╣ ║ ╚╦╝║ ║ ║╣
|
||||
// ╩═╝╩╚ ╚═╝╚═╝ ╩ ╚═╝╩═╝╚═╝
|
||||
beforeMount: function() {
|
||||
|
||||
if(['#apple','#linux','#windows','#chrome'].includes(window.location.hash)){
|
||||
this.selectedPlatform = window.location.hash.split('#')[1];
|
||||
} else {
|
||||
// otherwise, default the filter to be the first supported platform of the currently viewed table.
|
||||
this.selectedPlatform = this.tableToDisplay.platforms[0] === 'darwin' ? 'apple' : this.tableToDisplay.platforms[0];
|
||||
}
|
||||
},
|
||||
mounted: async function() {
|
||||
|
||||
// Algolia DocSearch
|
||||
if(this.algoliaPublicKey) { // Note: Docsearch will only be enabled if sails.config.custom.algoliaPublicKey is set. If the value is undefined, the documentation search will be disabled.
|
||||
docsearch({
|
||||
appId: 'NZXAYZXDGH',
|
||||
apiKey: this.algoliaPublicKey,
|
||||
indexName: 'fleetdm',
|
||||
container: '#docsearch-query',
|
||||
placeholder: 'Search tables',
|
||||
debug: false,
|
||||
searchParameters: {
|
||||
'facetFilters': ['section:tables']
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// Check the URL to see if a platformFilter was provided.
|
||||
if(window.location.search) {
|
||||
// https://caniuse.com/mdn-api_urlsearchparams_get
|
||||
let possibleSearchParamsToFilterBy = new URLSearchParams(window.location.search);
|
||||
let platformToFilterBy = possibleSearchParamsToFilterBy.get('platformFilter');
|
||||
// If the provided platform matches a key in the userFriendlyPlatformNames array, we'll set this.selectedPlatform.
|
||||
if(platformToFilterBy && this.userFriendlyPlatformNames[platformToFilterBy]){
|
||||
this.selectedPlatform = platformToFilterBy;
|
||||
}
|
||||
}
|
||||
|
||||
// sort the array of all tables
|
||||
this.allTables = this.allTables.sort((a, b)=>{
|
||||
return a.title > b.title ? 1 : -1;
|
||||
|
|
@ -128,7 +109,7 @@ parasails.registerPage('osquery-table-details', {
|
|||
await setTimeout(()=>{
|
||||
let activeTableLink = $('[purpose="table-of-contents-link"].active')[0];
|
||||
if(activeTableLink) {
|
||||
$('[purpose="table-of-contents"]')[0].scrollTop = activeTableLink.offsetTop - 12;
|
||||
$('[purpose="table-of-contents"]')[0].scrollTop = activeTableLink.offsetTop;
|
||||
}
|
||||
// Note: we're running this code after a 5ms delay to make sure the tables have been filtered, otherwise it will scroll the table of contents to the links posiiton in the full list of tables.
|
||||
}, 5);
|
||||
|
|
@ -141,11 +122,43 @@ parasails.registerPage('osquery-table-details', {
|
|||
clickFilterByPlatform: async function(platform) {
|
||||
this.selectedPlatform = platform;
|
||||
},
|
||||
clickSelectPlatform: function (platform) {
|
||||
let platformToLookFor = platform;
|
||||
if(platform === 'apple'){
|
||||
platformToLookFor = 'darwin';
|
||||
}
|
||||
let currentTableAvailableOnNewPlatform = this.tableToDisplay.platforms.includes(platformToLookFor);
|
||||
if(!currentTableAvailableOnNewPlatform){
|
||||
if(platformToLookFor === 'chrome'){
|
||||
this.goto('/tables/chrome_extensions#chrome');
|
||||
} else if(platformToLookFor === 'darwin') {
|
||||
this.goto('/tables/account_policy_data#apple');
|
||||
} else if(platformToLookFor === 'linux') {
|
||||
this.goto('/tables/apparmor_events#linux');
|
||||
} else if(platformToLookFor === 'windows') {
|
||||
this.goto('/tables/appcompat_shims#windows');
|
||||
}
|
||||
} else {
|
||||
this.selectedPlatform = platform;
|
||||
}
|
||||
|
||||
},
|
||||
clickToggleTableNav: function() {
|
||||
this.showTableNav = !this.showTableNav;
|
||||
},
|
||||
|
||||
clickOpenTablesNav: async function() {
|
||||
this.modal = 'table-of-contents';
|
||||
await setTimeout(()=>{
|
||||
let activeTableLink = $('[purpose="modal-table-of-contents-link"].active')[0];
|
||||
if(activeTableLink) {
|
||||
$('[purpose="modal-table-of-contents"]')[0].scrollTop = activeTableLink.offsetTop;
|
||||
}
|
||||
}, 250);
|
||||
},
|
||||
closeModal: async function() {
|
||||
this.modal = '';
|
||||
await this.forceRender();
|
||||
},
|
||||
_isIncluded: function (data, selectedOption) {
|
||||
if (selectedOption.startsWith('all') || selectedOption === '') {
|
||||
return true;
|
||||
|
|
|
|||
15
website/assets/js/pages/policy-details.page.js
vendored
15
website/assets/js/pages/policy-details.page.js
vendored
|
|
@ -14,21 +14,6 @@ parasails.registerPage('policy-details', {
|
|||
//…
|
||||
},
|
||||
mounted: async function () {
|
||||
// Note: Docsearch will be disabled on this page until a search index has been created for it.
|
||||
// Note: Docsearch will only be enabled if sails.config.custom.algoliaPublicKey is set. If the value is undefined, the documentation search will be disabled.
|
||||
if(this.algoliaPublicKey) {
|
||||
docsearch({
|
||||
appId: 'NZXAYZXDGH',
|
||||
apiKey: this.algoliaPublicKey,
|
||||
indexName: 'fleetdm',
|
||||
container: '#docsearch-query',
|
||||
placeholder: 'Search',
|
||||
debug: false,
|
||||
searchParameters: {
|
||||
'facetFilters': ['section:policies']
|
||||
},
|
||||
});
|
||||
}
|
||||
let columnNamesForThisQuery = [];
|
||||
let tableNamesForThisQuery = [];
|
||||
if(this.columnNamesForSyntaxHighlighting){
|
||||
|
|
|
|||
14
website/assets/js/pages/policy-library.page.js
vendored
14
website/assets/js/pages/policy-library.page.js
vendored
|
|
@ -13,19 +13,7 @@ parasails.registerPage('policy-library', {
|
|||
//…
|
||||
},
|
||||
mounted: async function () {
|
||||
if(this.algoliaPublicKey) { // Note: Docsearch will only be enabled if sails.config.custom.algoliaPublicKey is set. If the value is undefined, the documentation search will be disabled.
|
||||
docsearch({
|
||||
appId: 'NZXAYZXDGH',
|
||||
apiKey: this.algoliaPublicKey,
|
||||
indexName: 'fleetdm',
|
||||
container: '#docsearch-query',
|
||||
placeholder: 'Search',
|
||||
debug: false,
|
||||
searchParameters: {
|
||||
'facetFilters': ['section:policies']
|
||||
},
|
||||
});
|
||||
}
|
||||
//…
|
||||
},
|
||||
|
||||
// ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗
|
||||
|
|
|
|||
13
website/assets/js/pages/query-detail.page.js
vendored
13
website/assets/js/pages/query-detail.page.js
vendored
|
|
@ -15,19 +15,6 @@ parasails.registerPage('query-detail', {
|
|||
},
|
||||
mounted: async function () {
|
||||
|
||||
if(this.algoliaPublicKey) { // Note: Docsearch will only be enabled if sails.config.custom.algoliaPublicKey is set. If the value is undefined, the documentation search will be disabled.
|
||||
docsearch({
|
||||
appId: 'NZXAYZXDGH',
|
||||
apiKey: this.algoliaPublicKey,
|
||||
indexName: 'fleetdm',
|
||||
container: '#docsearch-query',
|
||||
placeholder: 'Search',
|
||||
debug: false,
|
||||
searchParameters: {
|
||||
'facetFilters': ['section:queries']
|
||||
},
|
||||
});
|
||||
}
|
||||
let columnNamesForThisQuery = [];
|
||||
let tableNamesForThisQuery = [];
|
||||
if(this.columnNamesForSyntaxHighlighting){
|
||||
|
|
|
|||
14
website/assets/js/pages/query-library.page.js
vendored
14
website/assets/js/pages/query-library.page.js
vendored
|
|
@ -13,19 +13,7 @@ parasails.registerPage('query-library', {
|
|||
//…
|
||||
},
|
||||
mounted: async function () {
|
||||
if(this.algoliaPublicKey) { // Note: Docsearch will only be enabled if sails.config.custom.algoliaPublicKey is set. If the value is undefined, the documentation search will be disabled.
|
||||
docsearch({
|
||||
appId: 'NZXAYZXDGH',
|
||||
apiKey: this.algoliaPublicKey,
|
||||
indexName: 'fleetdm',
|
||||
container: '#docsearch-query',
|
||||
placeholder: 'Search',
|
||||
debug: false,
|
||||
searchParameters: {
|
||||
'facetFilters': ['section:queries']
|
||||
},
|
||||
});
|
||||
}
|
||||
//…
|
||||
},
|
||||
|
||||
// ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗
|
||||
|
|
|
|||
14
website/assets/js/pages/vital-details.page.js
vendored
14
website/assets/js/pages/vital-details.page.js
vendored
|
|
@ -21,20 +21,6 @@ parasails.registerPage('vital-details', {
|
|||
if(['#apple','#linux','#windows','#chrome'].includes(window.location.hash)){
|
||||
this.selectedPlatform = window.location.hash.split('#')[1];
|
||||
}
|
||||
// Note: Docsearch will only be enabled if sails.config.custom.algoliaPublicKey is set. If the value is undefined, the documentation search will be disabled.
|
||||
if(this.algoliaPublicKey) {
|
||||
docsearch({
|
||||
appId: 'NZXAYZXDGH',
|
||||
apiKey: this.algoliaPublicKey,
|
||||
indexName: 'fleetdm',
|
||||
container: '#docsearch-query',
|
||||
placeholder: 'Search',
|
||||
debug: false,
|
||||
searchParameters: {
|
||||
'facetFilters': ['section:vitals']
|
||||
},
|
||||
});
|
||||
}
|
||||
let columnNamesForThisQuery = [];
|
||||
let tableNamesForThisQuery = [];
|
||||
if(this.columnNamesForSyntaxHighlighting){
|
||||
|
|
|
|||
263
website/assets/styles/components/docs-nav-and-search.component.less
vendored
Normal file
263
website/assets/styles/components/docs-nav-and-search.component.less
vendored
Normal file
|
|
@ -0,0 +1,263 @@
|
|||
|
||||
/**
|
||||
* <docs-nav-and-search>
|
||||
*
|
||||
*/
|
||||
|
||||
[parasails-component='docs-nav-and-search'] {
|
||||
margin-bottom: 48px;
|
||||
margin-left: -8px;
|
||||
[purpose='docs-links'] {
|
||||
min-height: 36px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
a {
|
||||
height: 29px;
|
||||
&[purpose='docs-top-nav-menu-link'] {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 4px 8px !important;//lesshint-disable-line importantRule
|
||||
margin-right: 16px !important;//lesshint-disable-line importantRule
|
||||
white-space: nowrap;
|
||||
&:last-of-type {
|
||||
margin-right: 0px !important;//lesshint-disable-line importantRule
|
||||
}
|
||||
color: #8B8FA2 !important;//lesshint-disable-line importantRule
|
||||
font-size: 14px !important;//lesshint-disable-line importantRule
|
||||
font-weight: 400 !important;//lesshint-disable-line importantRule
|
||||
line-height: 150% !important;//lesshint-disable-line importantRule
|
||||
text-decoration: none !important;//lesshint-disable-line importantRule
|
||||
text-decoration-line: none !important;//lesshint-disable-line importantRule
|
||||
&.active {
|
||||
border-radius: 8px;
|
||||
background: #F1F3F5;
|
||||
color: #192147 !important;//lesshint-disable-line importantRule
|
||||
}
|
||||
&:hover {
|
||||
border-radius: 8px;
|
||||
background: #F1F3F5;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
width: 100%;
|
||||
[purpose='nav-bar-search'] {
|
||||
margin-left: 24px;
|
||||
// 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: 8px 15px;
|
||||
height: 36px;
|
||||
margin: 0;
|
||||
width: 190px;
|
||||
}
|
||||
.DocSearch-Button:hover {
|
||||
box-shadow: none;
|
||||
border: 1px solid @core-fleet-black-25;
|
||||
color: @core-fleet-black-50;
|
||||
}
|
||||
.DocSearch-Search-Icon {
|
||||
margin-left: 0px;
|
||||
margin-right: 8px;
|
||||
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;
|
||||
line-height: 16px;
|
||||
font-weight: 400;
|
||||
padding-left: 0px;
|
||||
}
|
||||
[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;
|
||||
}
|
||||
}
|
||||
img {
|
||||
height: 16px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
background: #FFF;
|
||||
&::placeholder {
|
||||
font-size: 16px;
|
||||
color: @core-fleet-black-50;
|
||||
}
|
||||
}
|
||||
@media (max-width: 991px) {
|
||||
margin-bottom: 32px;
|
||||
[purpose='nav-bar-search'] {
|
||||
margin-left: 24px;
|
||||
// Note: We're using classes here to override the default Docsearch styles;
|
||||
button {
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
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: none;
|
||||
background-color: transparent;
|
||||
padding: 0px;
|
||||
height: 36px;
|
||||
margin: 0;
|
||||
width: 16px;
|
||||
}
|
||||
.DocSearch-Button:hover {
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
color: @core-fleet-black-50;
|
||||
}
|
||||
.DocSearch-Search-Icon {
|
||||
margin-left: 0px;
|
||||
margin-right: 8px;
|
||||
// padding: 8px 15px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
color: @core-fleet-black-75;
|
||||
stroke-width: 3px;
|
||||
}
|
||||
.DocSearch-Button-Keys {
|
||||
display: none;
|
||||
}
|
||||
.input-group:focus-within {
|
||||
border: 1px solid @core-vibrant-blue;
|
||||
}
|
||||
.DocSearch-Button-Placeholder {
|
||||
font-size: 16px;
|
||||
line-height: 16px;
|
||||
font-weight: 400;
|
||||
padding-left: 0px;
|
||||
display: none;
|
||||
}
|
||||
[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;
|
||||
}
|
||||
}
|
||||
img {
|
||||
height: 16px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
background: none;
|
||||
&::placeholder {
|
||||
font-size: 16px;
|
||||
color: @core-fleet-black-50;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
[purpose='nav-link-container'] {
|
||||
max-width: calc(~'100% - 48px');
|
||||
overflow-x: scroll;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
1
website/assets/styles/importer.less
vendored
1
website/assets/styles/importer.less
vendored
|
|
@ -28,6 +28,7 @@
|
|||
@import 'components/parallax-city.component.less';
|
||||
@import 'components/logo-carousel.component.less';
|
||||
@import 'components/animated-arrow-button.component.less';
|
||||
@import 'components/docs-nav-and-search.component.less';
|
||||
|
||||
// Per-page styles
|
||||
@import 'pages/homepage.less';
|
||||
|
|
|
|||
140
website/assets/styles/pages/app-details.less
vendored
140
website/assets/styles/pages/app-details.less
vendored
|
|
@ -17,7 +17,7 @@
|
|||
}
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding: 64px 64px 32px 64px;
|
||||
padding: 48px;
|
||||
}
|
||||
[purpose='page-content'] {
|
||||
margin-left: auto;
|
||||
|
|
@ -25,117 +25,25 @@
|
|||
max-width: 1072px;
|
||||
}
|
||||
|
||||
[purpose='breadcrumbs-and-search'] {
|
||||
margin-bottom: 64px;
|
||||
max-width: 1072px;
|
||||
[purpose='breadcrumbs'] {
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
|
||||
[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='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='icon-and-name'] {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
|
@ -373,24 +281,14 @@
|
|||
width: 100%;
|
||||
margin-left: 0px;
|
||||
}
|
||||
[purpose='breadcrumbs-and-search'] {
|
||||
[purpose='breadcrumbs'] {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
@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%;
|
||||
}
|
||||
}
|
||||
[purpose='breadcrumbs'] {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
9
website/assets/styles/pages/app-library.less
vendored
9
website/assets/styles/pages/app-library.less
vendored
|
|
@ -1,10 +1,10 @@
|
|||
#app-library {
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding: 64px;
|
||||
padding: 48px;
|
||||
}
|
||||
[purpose='page-content'] {
|
||||
max-width: 1072px;
|
||||
max-width: 1104px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
|
@ -240,7 +240,7 @@
|
|||
|
||||
@media (max-width: 991px) {
|
||||
[purpose='page-container'] {
|
||||
padding: 64px 32px;
|
||||
padding: 32px;
|
||||
}
|
||||
[purpose='app-card'] {
|
||||
min-width: 40%;
|
||||
|
|
@ -255,9 +255,6 @@
|
|||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
[purpose='page-container'] {
|
||||
padding: 48px 24px;
|
||||
}
|
||||
[purpose='app-search'] {
|
||||
margin-top: 32px;
|
||||
width: 100%;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,15 @@
|
|||
#basic-documentation {
|
||||
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding: 48px;
|
||||
}
|
||||
[purpose='page-content'] {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 1104px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
|
@ -25,23 +35,15 @@
|
|||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
|
||||
|
||||
a:not(.btn) {
|
||||
color: @core-vibrant-blue;
|
||||
line-height: 120%;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
padding-left: 8px;
|
||||
|
||||
li {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.markdown-heading:hover {
|
||||
|
|
@ -77,6 +79,75 @@
|
|||
80% {opacity: 20;}
|
||||
100% {opacity: 0;}
|
||||
}
|
||||
[purpose='mobile-custom-select'] {
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
height: 48px;
|
||||
padding: 0px 12px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
align-self: stretch;
|
||||
border-radius: 6px;
|
||||
border: 1px solid var(--border-border-primary, #E2E4EA);
|
||||
background: var(--surface-surface-primary, #FFF);
|
||||
width: 100%;
|
||||
margin-bottom: 16px;
|
||||
margin-top: 16px;
|
||||
p {
|
||||
color: var(--text-text-brand, #192147);
|
||||
|
||||
/* Body MD (FKA p) */
|
||||
font-family: Inter;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 24px; /* 150% */
|
||||
}
|
||||
img {
|
||||
height: 16px;
|
||||
}
|
||||
&:hover {
|
||||
border-radius: 6px;
|
||||
border: 1px solid var(--border-border-primary, #E2E4EA);
|
||||
background: var(--surface-surface-primary, #FFF);
|
||||
box-shadow: 0px 0px 0px 2px rgba(25, 33, 71, 0.05);
|
||||
}
|
||||
}
|
||||
[purpose='mobile-table-of-contents'] {
|
||||
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
height: 48px;
|
||||
padding: 0px 12px;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
align-self: stretch;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #E2E4EA;
|
||||
background: #FFF;
|
||||
width: 100%;
|
||||
margin-bottom: 8px;
|
||||
p {
|
||||
color: #192147;
|
||||
|
||||
/* Body MD (FKA p) */
|
||||
font-family: Inter;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 24px; /* 150% */
|
||||
}
|
||||
img {
|
||||
height: 14px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
&:hover {
|
||||
border-radius: 6px;
|
||||
border: 1px solid #E2E4EA;
|
||||
background: #FFF;
|
||||
box-shadow: 0px 0px 0px 2px rgba(25, 33, 71, 0.05);
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='search'] {
|
||||
// Note: We're using classes here to override the default Docsearch styles;
|
||||
|
|
@ -161,49 +232,6 @@
|
|||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='docs-landing-page'] {
|
||||
h3 {
|
||||
font-size: 24px;
|
||||
line-height: 32px;
|
||||
}
|
||||
a {
|
||||
color: @core-vibrant-blue;
|
||||
}
|
||||
[purpose='support-link'] {
|
||||
text-align: center;
|
||||
margin-top: 24px;
|
||||
margin-bottom: 0px;
|
||||
a {
|
||||
display: inline-block;
|
||||
}
|
||||
a:after {
|
||||
background-image: url('/images/icon-arrow-upper-right-7x7@2x.png');
|
||||
background-size: 7px 7px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
top: -4px;
|
||||
left: 4px;
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
content: '';
|
||||
}
|
||||
br {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
[purpose='docs-tree'] {
|
||||
a {
|
||||
color: @core-fleet-black;
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
color: @core-vibrant-blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
[purpose='docs-template'] {
|
||||
|
||||
h3 {
|
||||
|
|
@ -218,7 +246,6 @@
|
|||
|
||||
[purpose='edit-button'], [purpose='faq-edit-button'] {
|
||||
color: @core-vibrant-blue;
|
||||
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
right: 230px;
|
||||
|
|
@ -240,42 +267,16 @@
|
|||
[purpose='faq-edit-button'] {
|
||||
right: 48px;
|
||||
}
|
||||
|
||||
|
||||
[purpose='search'] {
|
||||
|
||||
.form-control {
|
||||
height: 36px;
|
||||
font-size: 16px;
|
||||
padding: 0;
|
||||
}
|
||||
.DocSearch-Button {
|
||||
height: 36px;
|
||||
font-size: 16px;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='breadcrumbs'] {
|
||||
p, a {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
[purpose='mobile-docs-nav'] {
|
||||
|
||||
a {
|
||||
color: @core-fleet-black;
|
||||
text-decoration: none;
|
||||
|
||||
&.active {
|
||||
color: @core-vibrant-blue;
|
||||
}
|
||||
&:hover {
|
||||
color: @core-vibrant-blue;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
[purpose='mobile-docs-nav-other-links'] {
|
||||
|
|
@ -303,94 +304,86 @@
|
|||
[purpose='left-sidebar'] {
|
||||
scrollbar-width: none;
|
||||
font-size: 14px;
|
||||
|
||||
a {
|
||||
color: @core-fleet-black;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: #6A67FE;
|
||||
}
|
||||
|
||||
&.btn-primary {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
color: #fff;
|
||||
background-color: #ff5c83;
|
||||
border-color: #ff5c83;
|
||||
|
||||
&:hover {
|
||||
background-color: darken(#ff5c83, 10%);
|
||||
border-color: darken(#ff5c83, 10%);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.left-nav {
|
||||
max-width: 200px;
|
||||
[purpose='left-sidebar-links'] {
|
||||
border-bottom: 1px solid @core-fleet-black-25;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.topic {
|
||||
padding-left: 0px;
|
||||
color: @core-fleet-black-75;
|
||||
&.active {
|
||||
color: @core-vibrant-blue;
|
||||
}
|
||||
|
||||
[purpose='section-title'] {
|
||||
margin-bottom: 8px;
|
||||
color: #192147;
|
||||
font-family: Inter;
|
||||
font-size: 14px;
|
||||
font-weight: 800;
|
||||
line-height: 120%;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
[purpose='left-sidebar']::-webkit-scrollbar, [purpose='right-sidebar']::-webkit-scrollbar, [purpose='subtopics']::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
[purpose='expanded-nav'] {
|
||||
li {
|
||||
[purpose='subpage-link'] {
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 21px;
|
||||
color: @core-fleet-black-75;
|
||||
display: block;
|
||||
padding: 4px 8px;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
&.active {
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='nav-section']:not(:last-of-type) {
|
||||
border-bottom: 1px solid #E2E4EA;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
[purpose='nav-section'] {
|
||||
padding-bottom: 12px;
|
||||
[purpose='nav-section-title'] {
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
line-height: 18px;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 12px;
|
||||
padding-top: 8px;
|
||||
color: @core-fleet-black;
|
||||
[purpose='expanded-nav'] {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-top: 8px;
|
||||
padding-bottom: 16px;
|
||||
[purpose='nav-section']:not(:last-of-type) {
|
||||
border-bottom: 1px solid #E2E4EA;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
[purpose='nav-section'] {
|
||||
padding-bottom: 12px;
|
||||
[purpose='nav-section-title'] {
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
line-height: 18px;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 12px;
|
||||
padding-top: 8px;
|
||||
color: @core-fleet-black;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
[purpose='left-sidebar']::-webkit-scrollbar, [purpose='right-sidebar']::-webkit-scrollbar, [purpose='subtopics']::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
[purpose='right-sidebar'] {
|
||||
scrollbar-width: none;
|
||||
p, a {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
a {
|
||||
&:hover {
|
||||
color: #6A67FE;
|
||||
color: @core-fleet-black-75;
|
||||
text-decoration: none;
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
&.active {
|
||||
color: @core-fleet-black-75;
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
}
|
||||
[purpose='swag-cta'] {
|
||||
cursor: pointer;
|
||||
|
|
@ -510,6 +503,7 @@
|
|||
|
||||
[purpose='content'] {
|
||||
width: 100%;
|
||||
padding-left: 32px;
|
||||
hr {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
|
|
@ -566,7 +560,9 @@
|
|||
margin-bottom: 24px;
|
||||
scroll-margin-top: 104px;
|
||||
}
|
||||
|
||||
a:not(.btn) {
|
||||
color: @core-vibrant-blue;
|
||||
}
|
||||
pre + hr + h3 {
|
||||
padding-top: 0px;
|
||||
}
|
||||
|
|
@ -882,15 +878,126 @@
|
|||
}
|
||||
}
|
||||
|
||||
[purpose='subtopics-modal'] {
|
||||
.modal.fade .modal-dialog {
|
||||
transition: transform 0.2s ease-out;
|
||||
-webkit-transform: translate(-25%, 0%);
|
||||
transform: translate(125%, 0%);
|
||||
}
|
||||
.modal.show .modal-dialog {
|
||||
-webkit-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
[parasails-component='modal'] {
|
||||
|
||||
[purpose='modal-dialog'] {
|
||||
margin-right: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='table-of-contents-modal'] {
|
||||
.modal.fade .modal-dialog {
|
||||
transition: transform 0.2s ease-out;
|
||||
-webkit-transform: translate(-25%, 0%);
|
||||
transform: translate(-125%, 0%);
|
||||
}
|
||||
.modal.show .modal-dialog {
|
||||
-webkit-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
[parasails-component='modal'] {
|
||||
|
||||
[purpose='modal-dialog'] {
|
||||
margin-left: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
[parasails-component='modal'] {
|
||||
[purpose='modal-dialog'] {
|
||||
// margin-left: 16px;
|
||||
margin-top: 16px;
|
||||
margin-bottom: 16px;
|
||||
max-width: 366px;
|
||||
// max-height: calc(~'100vh - 32px');
|
||||
[purpose='modal-content'] {
|
||||
display: flex;
|
||||
height: calc(~'100vh - 32px');
|
||||
margin-top: 0px;
|
||||
max-width: 366px;
|
||||
padding: 48px 19px 24px 24px;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
scrollbar-width: none;
|
||||
flex-shrink: 0;
|
||||
[purpose='modal-links'] {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
scrollbar-width: none;
|
||||
overflow: auto;
|
||||
[purpose='section-title'] {
|
||||
color: #192147;
|
||||
font-family: Inter;
|
||||
font-size: 14px;
|
||||
font-weight: 800;
|
||||
line-height: 120%;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
[purpose='expanded-nav'] {
|
||||
padding-top: 8px;
|
||||
padding-bottom: 16px;
|
||||
|
||||
}
|
||||
|
||||
[purpose='modal-nav-link'] {
|
||||
color: #515774;
|
||||
font-family: Inter;
|
||||
font-size: 14px;
|
||||
line-height: 150%;
|
||||
width: 100%;
|
||||
display: block;
|
||||
padding: 4px 8px;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
&.active {
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
}
|
||||
[purpose='modal-subtopics'] {
|
||||
a {
|
||||
color: #515774;
|
||||
font-family: Inter;
|
||||
margin-right: 5px;
|
||||
font-size: 14px;
|
||||
line-height: 150%;
|
||||
width: 100%;
|
||||
// text-wrap: nowrap;
|
||||
padding: 4px 8px;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
&.active {
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// for larger screens
|
||||
@media (min-width: 992px) {
|
||||
|
||||
[purpose='docs-template'] {
|
||||
ul {
|
||||
.topic {
|
||||
padding-left: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='search'] {
|
||||
.input-group {
|
||||
|
|
@ -909,7 +1016,8 @@
|
|||
}
|
||||
[purpose='left-sidebar'] {
|
||||
height: fit-content;
|
||||
min-width: 216px;
|
||||
min-width: 200px;
|
||||
margin-right: 16px;
|
||||
transition-property: all;
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition-duration: 500ms;
|
||||
|
|
@ -922,28 +1030,40 @@
|
|||
min-width: 190px;
|
||||
position: sticky;
|
||||
top: 104px;
|
||||
margin-left: 24px;
|
||||
height: fit-content;
|
||||
overflow-y: auto;
|
||||
transition-property: all;
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition-duration: 500ms;
|
||||
|
||||
[purpose='subtopics-heading'] {
|
||||
color: #192147;
|
||||
font-size: 14px;
|
||||
font-weight: 800;
|
||||
line-height: 120%;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
[purpose='subtopics'] {
|
||||
scrollbar-width: none;
|
||||
overflow-y: auto;
|
||||
color: @core-fleet-black;
|
||||
padding-top: 4px;
|
||||
padding-bottom: 4px;
|
||||
border-left: 1px solid @core-vibrant-blue-25;
|
||||
|
||||
max-height: calc(~'100vh - 60px');
|
||||
dispaly: flex;
|
||||
flex-direction: column;
|
||||
transition-property: max-height;
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition-duration: 500ms;
|
||||
a {
|
||||
color: @core-fleet-black;
|
||||
display: block;
|
||||
color: #515774;
|
||||
text-decoration: none;
|
||||
padding: 4px 8px;
|
||||
&:hover {
|
||||
color: @core-vibrant-blue;
|
||||
color: #515774;
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1001,6 +1121,9 @@
|
|||
|
||||
// for smaller screens
|
||||
@media (max-width: 991px) {
|
||||
[purpose='page-container'] {
|
||||
padding: 32px;
|
||||
}
|
||||
[purpose='back-to-top-button-container'] {
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -1015,27 +1138,23 @@
|
|||
top: -55px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
[purpose='right-sidebar'] {
|
||||
width: 100%;
|
||||
// Note: we're specifying a minimum height for this element to be the height of the edit page button.
|
||||
// Even if there are no subtopics on a documentation page, we can be sure that the edit page button will not overlap the pages content.
|
||||
min-height: 30px;
|
||||
margin-bottom: 32px;
|
||||
|
||||
[purpose='subtopics'] {
|
||||
color: @core-fleet-black;
|
||||
|
||||
a {
|
||||
color: @core-vibrant-blue;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
[purpose='content'] {
|
||||
width: 100%;
|
||||
padding-left: 0px;
|
||||
margin-left: 0px;
|
||||
a {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
|
@ -1050,9 +1169,8 @@
|
|||
|
||||
@media (max-width: 768px) {
|
||||
[purpose='docs-template'] {
|
||||
|
||||
[purpose='edit-button'] {
|
||||
top: 0px;
|
||||
top: 80px;
|
||||
right: 0px;
|
||||
}
|
||||
}
|
||||
|
|
@ -1060,11 +1178,60 @@
|
|||
}
|
||||
|
||||
// for mobile
|
||||
@media (max-width: 576px) {
|
||||
@media (max-width: 575px) {
|
||||
[purpose='docs-template'] {
|
||||
padding: 0px 24px;
|
||||
}
|
||||
[purpose='page-container'] {
|
||||
padding: 32px 24px;
|
||||
}
|
||||
[purpose='subtopics-modal'] {
|
||||
.modal.fade .modal-dialog {
|
||||
transition: transform 0.1s ease-out;
|
||||
-webkit-transform: translate(-25%, 0%);
|
||||
transform: translate(0, 125%);
|
||||
}
|
||||
.modal.show .modal-dialog {
|
||||
-webkit-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
[parasails-component='modal'] {
|
||||
|
||||
[purpose='modal-dialog'] {
|
||||
margin-right: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
[purpose='table-of-contents-modal'] {
|
||||
.modal.fade .modal-dialog {
|
||||
transition: transform 0.1s ease-out;
|
||||
-webkit-transform: translate(-25%, 0%);
|
||||
transform: translate(0%, 125%);
|
||||
}
|
||||
.modal.show .modal-dialog {
|
||||
-webkit-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
[parasails-component='modal'] {
|
||||
|
||||
[purpose='modal-dialog'] {
|
||||
margin-left: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
[parasails-component='modal'] {
|
||||
|
||||
[purpose='modal-dialog'] {
|
||||
margin: 16px;
|
||||
width: 100%;
|
||||
max-width: calc(~'100% - 32px');
|
||||
max-height: calc(~'100vh - 32px');
|
||||
[purpose='modal-content'] {
|
||||
max-width: 100%;
|
||||
height: calc(~'100vh - 72px');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media(hover) {
|
||||
[purpose='docs-template'] {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,68 @@
|
|||
#osquery-table-details {
|
||||
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding: 48px;
|
||||
}
|
||||
[purpose='page-content'] {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 1104px;
|
||||
}
|
||||
[purpose='page-headline'] {
|
||||
// max-width: 662px;
|
||||
// margin-right: 16px;
|
||||
margin-bottom: 48px;
|
||||
h2 {
|
||||
margin-bottom: 24px;
|
||||
color: #192147;
|
||||
font-size: 32px;
|
||||
font-weight: 800;
|
||||
line-height: 120%;
|
||||
}
|
||||
p {
|
||||
color: #515774;
|
||||
font-size: 15px;
|
||||
line-height: 150%;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='platform-filters'] {
|
||||
border-bottom: 1px solid #E2E4EA;
|
||||
margin-bottom: 48px;
|
||||
[purpose='platform-filter'] {
|
||||
width: 25%;
|
||||
display: flex;
|
||||
padding: 16px 40px 24px 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-weight: 400;
|
||||
line-height: 24px; /* 150% */
|
||||
white-space: nowrap;
|
||||
}
|
||||
&.selected {
|
||||
border-bottom: 2px solid var(--text-text-brand, #192147);
|
||||
padding: 16px 40px 22px 40px;
|
||||
p {
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
hr {
|
||||
margin: 0;
|
||||
width: 100vw;
|
||||
|
|
@ -132,31 +196,31 @@
|
|||
-ms-overflow-style: none;
|
||||
min-width: 245px;
|
||||
max-width: 250px;
|
||||
padding-top: 24px;
|
||||
height: 100%;
|
||||
margin-right: 16px;
|
||||
h4 {
|
||||
line-height: 24px;
|
||||
}
|
||||
}
|
||||
[purpose='table-of-contents'] {
|
||||
[purpose='table-of-contents'], [purpose='modal-table-of-contents'] {
|
||||
scrollbar-width: none;
|
||||
padding-top: 16px;
|
||||
padding-bottom: 120px;
|
||||
margin-top: 16px;
|
||||
border-top: 1px solid @core-fleet-black-25;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
a {
|
||||
font-size: 14px;
|
||||
line-height: 28px;
|
||||
color: @text-normal;
|
||||
color: @core-fleet-black-75;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover {
|
||||
color: @core-vibrant-blue;
|
||||
}
|
||||
a.active {
|
||||
color: @core-vibrant-blue;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
&.active {
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
}
|
||||
min-height: calc(~'100vh - 565px');
|
||||
overflow-y: scroll;
|
||||
|
|
@ -179,6 +243,7 @@
|
|||
[purpose='table-container'] {
|
||||
height: min-content;
|
||||
max-width: 860px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
[purpose='overflow-shadow'] {
|
||||
|
|
@ -191,9 +256,8 @@
|
|||
z-index: 2;
|
||||
}
|
||||
[purpose='content'] {
|
||||
padding-left: 40px;
|
||||
padding-right: 40px;
|
||||
max-width: 960px;
|
||||
margin-top: 32px;
|
||||
color: @core-fleet-black-75;
|
||||
h2 {
|
||||
font-weight: 800;
|
||||
font-size: 24px;
|
||||
|
|
@ -231,9 +295,8 @@
|
|||
}
|
||||
|
||||
[purpose='schema-table'] {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
position: relative;
|
||||
padding-top: 24px;
|
||||
margin-bottom: 40px;
|
||||
[purpose='platform-logos'] {
|
||||
height: 0px;
|
||||
|
|
@ -244,6 +307,7 @@
|
|||
a:not(.btn):not([purpose='evented-table-label']) {
|
||||
color: @core-vibrant-blue;
|
||||
padding-right: 7px;
|
||||
word-break: break-word;
|
||||
}
|
||||
a:not(.markdown-link):not([purpose='evented-table-label']) {
|
||||
&:after {
|
||||
|
|
@ -413,13 +477,152 @@
|
|||
margin-top: 40px;
|
||||
border-top: 1px solid @core-fleet-black-25;
|
||||
}
|
||||
[purpose='mobile-custom-select'] {
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
height: 48px;
|
||||
padding: 0px 12px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
align-self: stretch;
|
||||
border-radius: 6px;
|
||||
border: 1px solid var(--border-border-primary, #E2E4EA);
|
||||
background: var(--surface-surface-primary, #FFF);
|
||||
width: 100%;
|
||||
margin-bottom: 16px;
|
||||
margin-top: 16px;
|
||||
p {
|
||||
color: var(--text-text-brand, #192147);
|
||||
margin-top: 0px;
|
||||
/* Body MD (FKA p) */
|
||||
font-family: Inter;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 24px; /* 150% */
|
||||
}
|
||||
img {
|
||||
height: 16px;
|
||||
}
|
||||
&:hover {
|
||||
border-radius: 6px;
|
||||
border: 1px solid var(--border-border-primary, #E2E4EA);
|
||||
background: var(--surface-surface-primary, #FFF);
|
||||
box-shadow: 0px 0px 0px 2px rgba(25, 33, 71, 0.05);
|
||||
}
|
||||
}
|
||||
[purpose='table-of-contents-modal'] {
|
||||
[purpose='modal-table-of-contents'] {
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
.modal.fade .modal-dialog {
|
||||
transition: transform 0.2s ease-out;
|
||||
-webkit-transform: translate(-25%, 0%);
|
||||
transform: translate(-125%, 0%);
|
||||
}
|
||||
.modal.show .modal-dialog {
|
||||
-webkit-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
[parasails-component='modal'] {
|
||||
|
||||
[purpose='modal-dialog'] {
|
||||
margin-left: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
[parasails-component='modal'] {
|
||||
|
||||
[purpose='modal-dialog'] {
|
||||
// margin-left: 16px;
|
||||
margin-top: 16px;
|
||||
margin-bottom: 16px;
|
||||
max-width: 366px;
|
||||
// max-height: calc(~'100vh - 32px');
|
||||
[purpose='modal-content'] {
|
||||
display: flex;
|
||||
height: calc(~'100vh - 32px');
|
||||
margin-top: 0px;
|
||||
max-width: 366px;
|
||||
padding: 48px 19px 24px 24px;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
// gap: 24px;
|
||||
flex-shrink: 0;
|
||||
[purpose='modal-links'] {
|
||||
max-height: 100%;
|
||||
width: 100%;
|
||||
overflow-y: scroll;
|
||||
[purpose='section-title'] {
|
||||
color: #192147;
|
||||
font-family: Inter;
|
||||
font-size: 14px;
|
||||
font-weight: 800;
|
||||
line-height: 120%;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
[purpose='expanded-nav'] {
|
||||
padding-top: 8px;
|
||||
padding-bottom: 16px;
|
||||
}
|
||||
|
||||
[purpose='modal-nav-link'] {
|
||||
color: #515774;
|
||||
font-family: Inter;
|
||||
margin-right: 5px;
|
||||
font-size: 14px;
|
||||
line-height: 150%;
|
||||
width: 100%;
|
||||
display: block;
|
||||
// text-wrap: nowrap;
|
||||
padding: 4px 8px;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
&.active {
|
||||
border-radius: 4px;
|
||||
background: #F9FAFC;
|
||||
}
|
||||
}
|
||||
[purpose='modal-subtopics'] {
|
||||
a {
|
||||
color: #515774;
|
||||
font-family: Inter;
|
||||
margin-right: 5px;
|
||||
font-size: 14px;
|
||||
line-height: 150%;
|
||||
width: 100%;
|
||||
// text-wrap: nowrap;
|
||||
padding: 4px 8px;
|
||||
// &:hover {
|
||||
// text-decoration: none;
|
||||
// border-radius: 4px;
|
||||
// background: #F9FAFC;
|
||||
// }
|
||||
// &.active {
|
||||
// border-radius: 4px;
|
||||
// background: #F9FAFC;
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (max-width: 991px) {
|
||||
[purpose='page-container'] {
|
||||
padding: 32px;
|
||||
}
|
||||
[purpose='table-container'] {
|
||||
max-width: unset;
|
||||
}
|
||||
[purpose='content'] {
|
||||
margin-top: 0px;
|
||||
}
|
||||
[purpose='schema-table'] {
|
||||
padding-top: 40px;
|
||||
padding-top: 16px;
|
||||
[purpose='platform-logos'] {
|
||||
top: 53px;
|
||||
}
|
||||
|
|
@ -432,6 +635,9 @@
|
|||
display: block;
|
||||
}
|
||||
}
|
||||
[purpose='platform-filters'] {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
[purpose='filter-row'] {
|
||||
padding-left: 40px;
|
||||
padding-right: 40px;
|
||||
|
|
@ -458,9 +664,8 @@
|
|||
}
|
||||
|
||||
@media (max-width: 576px) {
|
||||
[purpose='content'] {
|
||||
padding-left: 24px;
|
||||
padding-right: 24px;
|
||||
[purpose='page-container'] {
|
||||
padding: 32px 24px;
|
||||
}
|
||||
[purpose='mobile-nav'] {
|
||||
padding-left: 24px;
|
||||
|
|
@ -511,5 +716,35 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
[purpose='table-of-contents-modal'] {
|
||||
.modal.fade .modal-dialog {
|
||||
transition: transform 0.1s ease-out;
|
||||
-webkit-transform: translate(-25%, 0%);
|
||||
transform: translate(0%, 125%);
|
||||
}
|
||||
.modal.show .modal-dialog {
|
||||
-webkit-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
[parasails-component='modal'] {
|
||||
|
||||
[purpose='modal-dialog'] {
|
||||
margin-left: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
[parasails-component='modal'] {
|
||||
|
||||
[purpose='modal-dialog'] {
|
||||
margin: 16px;
|
||||
width: 100%;
|
||||
max-width: calc(~'100% - 32px');
|
||||
max-height: calc(~'100vh - 32px');
|
||||
[purpose='modal-content'] {
|
||||
max-width: 100%;
|
||||
height: calc(~'100vh - 72px');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
145
website/assets/styles/pages/policy-details.less
vendored
145
website/assets/styles/pages/policy-details.less
vendored
|
|
@ -1,5 +1,5 @@
|
|||
#policy-details {
|
||||
// background-color: #FFF;
|
||||
|
||||
h3 {
|
||||
padding-bottom: 24px;
|
||||
padding-top: 32px;
|
||||
|
|
@ -19,125 +19,32 @@
|
|||
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding: 64px 64px 32px 64px;
|
||||
padding: 48px;
|
||||
}
|
||||
[purpose='page-content'] {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 1072px;
|
||||
max-width: 1104px;
|
||||
}
|
||||
|
||||
[purpose='breadcrumbs-and-search'] {
|
||||
margin-bottom: 64px;
|
||||
max-width: 1072px;
|
||||
[purpose='breadcrumbs'] {
|
||||
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;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
[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;
|
||||
|
|
@ -560,7 +467,7 @@
|
|||
width: 100%;
|
||||
margin-left: 0px;
|
||||
}
|
||||
[purpose='breadcrumbs-and-search'] {
|
||||
[purpose='breadcrumbs'] {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
pre {
|
||||
|
|
@ -573,18 +480,8 @@
|
|||
}
|
||||
|
||||
@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%;
|
||||
}
|
||||
}
|
||||
[purpose='breadcrumbs'] {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
23
website/assets/styles/pages/policy-library.less
vendored
23
website/assets/styles/pages/policy-library.less
vendored
|
|
@ -1,5 +1,15 @@
|
|||
#policy-library {
|
||||
// background-color: #FFF;
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding: 48px;
|
||||
}
|
||||
[purpose='page-content'] {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 1104px;
|
||||
}
|
||||
|
||||
|
||||
a {
|
||||
color: #515774;
|
||||
font-family: Inter;
|
||||
|
|
@ -110,14 +120,7 @@
|
|||
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;
|
||||
}
|
||||
|
|
@ -312,7 +315,7 @@
|
|||
|
||||
@media (max-width: 991px) {
|
||||
[purpose='page-container'] {
|
||||
padding: 64px 32px;
|
||||
padding: 32px;
|
||||
}
|
||||
[purpose='policy-name-and-description'] {
|
||||
max-width: unset;
|
||||
|
|
|
|||
145
website/assets/styles/pages/query-detail.less
vendored
145
website/assets/styles/pages/query-detail.less
vendored
|
|
@ -1,5 +1,5 @@
|
|||
#query-detail {
|
||||
// background-color: #FFF;
|
||||
|
||||
h3 {
|
||||
padding-bottom: 24px;
|
||||
padding-top: 32px;
|
||||
|
|
@ -19,125 +19,32 @@
|
|||
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding: 64px 64px 32px 64px;
|
||||
padding: 48px;
|
||||
}
|
||||
[purpose='page-content'] {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 1072px;
|
||||
max-width: 1104px;
|
||||
}
|
||||
|
||||
[purpose='breadcrumbs-and-search'] {
|
||||
margin-bottom: 64px;
|
||||
max-width: 1072px;
|
||||
[purpose='breadcrumbs'] {
|
||||
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;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
[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='query-name'] {
|
||||
color: #192147;
|
||||
|
|
@ -505,7 +412,7 @@
|
|||
width: 100%;
|
||||
margin-left: 0px;
|
||||
}
|
||||
[purpose='breadcrumbs-and-search'] {
|
||||
[purpose='breadcrumbs'] {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
pre {
|
||||
|
|
@ -518,18 +425,8 @@
|
|||
}
|
||||
|
||||
@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%;
|
||||
}
|
||||
}
|
||||
[purpose='breadcrumbs'] {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
23
website/assets/styles/pages/query-library.less
vendored
23
website/assets/styles/pages/query-library.less
vendored
|
|
@ -1,5 +1,15 @@
|
|||
#query-library {
|
||||
// background-color: #FFF;
|
||||
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding: 48px;
|
||||
}
|
||||
[purpose='page-content'] {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 1104px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #515774;
|
||||
font-family: Inter;
|
||||
|
|
@ -110,14 +120,7 @@
|
|||
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;
|
||||
}
|
||||
|
|
@ -318,7 +321,7 @@
|
|||
|
||||
@media (max-width: 991px) {
|
||||
[purpose='page-container'] {
|
||||
padding: 64px 32px;
|
||||
padding: 32px;
|
||||
}
|
||||
[purpose='policy-name-and-description'] {
|
||||
max-width: unset;
|
||||
|
|
|
|||
11
website/assets/styles/pages/vital-details.less
vendored
11
website/assets/styles/pages/vital-details.less
vendored
|
|
@ -1,5 +1,4 @@
|
|||
#vital-details {
|
||||
// background-color: #FFF;
|
||||
h3 {
|
||||
padding-bottom: 24px;
|
||||
padding-top: 32px;
|
||||
|
|
@ -20,12 +19,12 @@
|
|||
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding: 64px 64px 32px 64px;
|
||||
padding: 48px;
|
||||
}
|
||||
[purpose='page-content'] {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 1072px;
|
||||
max-width: 1104px;
|
||||
}
|
||||
[purpose='search-and-headline'] {
|
||||
margin-bottom: 48px;
|
||||
|
|
@ -247,10 +246,8 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
[purpose='vital-details-and-sidebar'] {
|
||||
padding-top: 32px;
|
||||
|
||||
|
|
@ -549,10 +546,10 @@
|
|||
max-height: 100%;
|
||||
width: 100%;
|
||||
overflow-y: scroll;
|
||||
scrollbar-width: none;
|
||||
[purpose='vital-link'] {
|
||||
color: #515774;
|
||||
font-family: Inter;
|
||||
margin-right: 5px;
|
||||
font-size: 14px;
|
||||
line-height: 150%;
|
||||
width: 100%;
|
||||
|
|
|
|||
1
website/views/layouts/layout.ejs
vendored
1
website/views/layouts/layout.ejs
vendored
|
|
@ -463,6 +463,7 @@
|
|||
<script src="/js/components/bar-chart.component.js"></script>
|
||||
<script src="/js/components/call-to-action.component.js"></script>
|
||||
<script src="/js/components/cloud-error.component.js"></script>
|
||||
<script src="/js/components/docs-nav-and-search.component.js"></script>
|
||||
<script src="/js/components/js-timestamp.component.js"></script>
|
||||
<script src="/js/components/logo-carousel.component.js"></script>
|
||||
<script src="/js/components/modal.component.js"></script>
|
||||
|
|
|
|||
31
website/views/pages/app-details.ejs
vendored
31
website/views/pages/app-details.ejs
vendored
|
|
@ -1,31 +1,14 @@
|
|||
<div id="app-details" v-cloak>
|
||||
<div purpose="page-container">
|
||||
<div purpose="page-content" class="container p-0">
|
||||
<div purpose="breadcrumbs-and-search" class="d-flex flex-md-row flex-column justify-content-between align-items-md-center align-items-start">
|
||||
<div purpose="breadcrumbs" class="d-flex flex-row align-items-start">
|
||||
<div>
|
||||
<a purpose="breadcrumbs-category" class="text-nowrap" href="/app-library">App library</a>/
|
||||
</div>
|
||||
<div purpose="breadcrumbs-title">
|
||||
<span><%- thisApp.name %></span>
|
||||
</div>
|
||||
<docs-nav-and-search current-section="software" search-filter="software" :algolia-public-key="algoliaPublicKey"></docs-nav-and-search>
|
||||
<div purpose="breadcrumbs" class="d-flex flex-row align-items-start">
|
||||
<div>
|
||||
<a purpose="breadcrumbs-category" class="text-nowrap" href="/app-library">App library</a>/
|
||||
</div>
|
||||
<div purpose="breadcrumbs-title">
|
||||
<span><%- thisApp.name %></span>
|
||||
</div>
|
||||
<!-- <div purpose="search" id="docsearch-query" class="d-flex">
|
||||
<div purpose="disabled-search" class="d-flex w-100">
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text border-0 bg-transparent pl-3" >
|
||||
<img style="height: 16px; width: 16px;" class="search" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-control border-0 ">
|
||||
<input class="docsearch-input pr-1"
|
||||
placeholder="Search" aria-label="Search the handbook"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div purpose="app-details-and-sidebar" class="d-flex flex-nowrap flex-lg-row flex-column">
|
||||
<div purpose="app-details" class="d-inline-flex flex-column flex-shrink w-0">
|
||||
|
|
|
|||
17
website/views/pages/app-library.ejs
vendored
17
website/views/pages/app-library.ejs
vendored
|
|
@ -1,27 +1,12 @@
|
|||
<div id="app-library" v-cloak>
|
||||
<div purpose="page-container">
|
||||
<div purpose="page-content" class="d-flex flex-column">
|
||||
<docs-nav-and-search current-section="software" search-filter="software" :algolia-public-key="algoliaPublicKey"></docs-nav-and-search>
|
||||
<div purpose="search-and-headline" class="d-flex flex-md-row flex-column justify-content-between align-items-md-center">
|
||||
<div purpose="page-title" class="d-flex flex-column">
|
||||
<h1>App library</h1>
|
||||
<p>Install Fleet-maintained apps on your hosts without the need for additional configuration. Activate self-service for your end users.</p>
|
||||
</div>
|
||||
<!-- <div purpose="app-search" id="docsearch-query" class="d-flex">
|
||||
<div purpose="disabled-search" class="d-flex w-100">
|
||||
<div class="input-group d-flex flex-nowrap">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text border-0 bg-transparent" >
|
||||
<img style="height: 16px; width: 16px;" class="search" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-control border-0 ">
|
||||
<input class="docsearch-input pr-1"
|
||||
placeholder="Search" aria-label="Search"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div purpose="count-and-cta" class="d-flex flex-sm-row flex-column align-items-sm-center align-items-start justify-content-sm-between justify-content-center mb-3">
|
||||
<div><p class="mb-0"><strong>{{allApps.length}} and counting....</strong></p></div>
|
||||
|
|
|
|||
232
website/views/pages/docs/basic-documentation.ejs
vendored
232
website/views/pages/docs/basic-documentation.ejs
vendored
|
|
@ -1,161 +1,36 @@
|
|||
<div id="basic-documentation" v-cloak>
|
||||
|
||||
<div purpose="docs-landing-page" v-if="isDocsLandingPage">
|
||||
<div style="max-width: 948px;" class="container-fluid p-0 px-3 px-sm-4 py-5 mb-5 mx-auto">
|
||||
|
||||
<div class="text-center">
|
||||
<h1 class="pt-5">Fleet documentation</h1>
|
||||
<p class="mb-2">Welcome to the documentation for Fleet, the lightweight management platform for laptops and servers.</p>
|
||||
</div>
|
||||
|
||||
<div purpose="search" id="docsearch-query-landing" class="d-flex p-0 mt-5">
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text border-0 bg-transparent pl-3" >
|
||||
<img style="height: 16px; width: 16px;" class="search" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-control border-0 ">
|
||||
<input class="docsearch-input pr-1"
|
||||
placeholder="Search..." aria-label="Search the docs and guides"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p purpose="support-link">Can't find what you're looking for? <a href="/support">Support</a></p>
|
||||
|
||||
|
||||
<div purpose="docs-tree">
|
||||
<div class="container-fluid d-flex flex-column flex-sm-row justify-content-sm-between p-0 px-4">
|
||||
<div v-for="page in findPagesByUrl()">
|
||||
<div style="max-width: 300px;" class="container-fluid justify-content-start align-items-center p-0 px-2 pt-4 m-0 mt-3">
|
||||
<h3 class="mb-4">{{page.title}}</h3>
|
||||
<ul style="list-style: none;" class="p-0 m-0">
|
||||
<li class="mb-2" v-for="subpage in findPagesByUrl(page.url)">
|
||||
<a :href="subpage.url">{{subpage.title}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="page-container">
|
||||
<div purpose="page-content">
|
||||
<docs-nav-and-search search-filter="docs" current-section="docs" :algolia-public-key="algoliaPublicKey"></docs-nav-and-search>
|
||||
<div purpose="mobile-table-of-contents" class="d-flex d-lg-none" @click="clickOpenMobileDocsNav()">
|
||||
<img src="/images/icon-hamburger-menu-16x14@2x.png" alt="click to open the table of contents." >
|
||||
<p class="mb-0"><%= thisPage.title %></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
<div purpose="docs-template" style="max-width: 1200px;" class="container-fluid px-lg-3 mb-5">
|
||||
|
||||
<div purpose="breadcrumbs-and-search" class="conainer-fluid d-flex flex-column flex-lg-row justify-content-lg-between p-0 pt-4 pb-lg-2 m-0 breadcrumbs-search">
|
||||
|
||||
<div purpose="breadcrumbs" class="d-none d-lg-flex p-0 m-0 align-items-center breadcrumbs">
|
||||
<a :href="'/' + breadcrumbs[0]" class="pr-3" v-if="breadcrumbs.length > 1">
|
||||
{{breadcrumbs[0] === 'docs' ? 'Documentation' : breadcrumbs[0]}}
|
||||
</a>
|
||||
<div class="d-flex p-0 m-0 align-items-center" v-if="breadcrumbs.length === 3">
|
||||
<img style="width: 6px; height: 9px;" alt="right chevron" src="/images/chevron-right-6x9@2x.png" />
|
||||
<a :href="'/' + breadcrumbs[0] + '/' + breadcrumbs[1]" class="px-3">
|
||||
{{getTitleFromUrl(breadcrumbs[1])}}
|
||||
</a>
|
||||
</div>
|
||||
<div class="d-flex p-0 m-0 align-items-center" v-if="breadcrumbs.length > 1">
|
||||
<img style="width: 6px; height: 9px;" alt="right chevron" src="/images/chevron-right-6x9@2x.png"/>
|
||||
<p class="px-3 m-0">
|
||||
{{thisPage.title}}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div purpose="search" id="docsearch-query" class="d-flex p-0 mb-2 mb-lg-0">
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text border-0 bg-transparent pl-3">
|
||||
<img style="height: 16px; width: 16px;" class="search" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-control border-0 ">
|
||||
<input class="docsearch-input pr-1"
|
||||
placeholder="Search the docs..." aria-label="Search the docs and guides"
|
||||
v-model="inputTextValue"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div purpose="mobile-docs-nav" class="d-flex-block d-lg-none">
|
||||
<div class="d-flex flex-column d-lg-none p-0 m-0 justify-content-start align-items-center">
|
||||
<button purpose="docs-nav-button" class="btn btn-block d-flex align-items-center docs-nav-button" type="button" @click="toggleDocsNav">
|
||||
<span class="pr-2 m-0">Docs</span>
|
||||
<img class="my-auto" style="width: 6px; height: 9px;" alt="right chevron" src="/images/chevron-right-6x9@2x.png"/>
|
||||
<span class="font-weight-bold px-2 m-0">{{getTitleFromUrl(breadcrumbs[1])}}</span>
|
||||
<img style="width: 6px; height: 9px;" class="ml-auto my-auto" alt="right chevron" src="/images/chevron-right-6x9@2x.png" v-if="!showDocsNav"/>
|
||||
<img style="width: 9px; height: 6px;" class="ml-auto my-auto" alt="down chevron" src="/images/chevron-down-9x6@2x.png" v-else/>
|
||||
</button>
|
||||
</div>
|
||||
<div class="border-bottom" v-if="!showDocsNav"></div>
|
||||
<div class="d-flex px-0 border-bottom mobile-docs-nav" v-if="showDocsNav">
|
||||
<div class="container-fluid px-0 pt-4">
|
||||
<ul class="px-0 mb-0 pb-3">
|
||||
<li class="px-0 mb-2" v-for="page in findPagesByUrl()" :key="page.title">
|
||||
<span class="font-weight-bold">
|
||||
{{page.title}}
|
||||
</span>
|
||||
<div purpose="expanded-nav" class="pt-3">
|
||||
<ul class="p-0 pl-2 mb-3" v-if="!_.isEmpty(findPagesByUrl(page.url))">
|
||||
<li v-for="subpage in findPagesByUrl(page.url)" :key="subpage.title">
|
||||
<a :href="subpage.url" :class="subpage.title === thisPage.title ? 'topic active' : 'topic'">
|
||||
{{subpage.title}}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="px-0 mb-0 pt-3" purpose="mobile-docs-nav-other-links">
|
||||
<li class="px-0 mb-3"><a href="/queries">Built-in checks</a></li>
|
||||
<li class="px-0 mb-3"><a href="/tables">Raw data</a></li>
|
||||
<li class="px-0 mb-3"><a href="/app-library">App library</a></li>
|
||||
<li class="px-0 mb-3"><a href="/releases">Release notes</a></li>
|
||||
<li class="px-0 mb-3"><a href="/docs/contributing" target="_blank">Contributing</a></li>
|
||||
<li class="px-0 mb-3"><a href="/support">Support</a></li>
|
||||
<li class="px-0 mb-3"><a href="/contact">Take a tour</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div purpose="docs-template" class="container-fluid p-0">
|
||||
<h1 purpose="page-title" class="d-flex d-lg-none py-4 m-0"><%= thisPage.title %></h1>
|
||||
|
||||
<div purpose="edit-button-container">
|
||||
<a :purpose="thisPage.title !== 'FAQ' ? 'edit-button' : 'faq-edit-button'" :href="'https://github.com/fleetdm/fleet/edit/main/docs/'+thisPage.sectionRelativeRepoPath" target="_blank">
|
||||
<i class="fa fa-pencil"></i>Edit page
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="container-fluid d-flex flex-column flex-lg-row p-0 pt-lg-4 pb-lg-4 m-0">
|
||||
<div purpose="left-sidebar" class="d-none d-lg-flex flex-column text-left pl-0 pr-4 left-sidebar">
|
||||
<ul class="p-0 pb-3 m-0 left-nav">
|
||||
<li v-for="page in findPagesByUrl()" :key="page.title">
|
||||
<span class="font-weight-bold pb-3">{{page.title}}</span>
|
||||
<div purpose="expanded-nav" class="pt-3" >
|
||||
<ul class="p-0 pl-2 mb-3">
|
||||
<li v-for="subpage in findPagesByUrl(page.url)" :key="subpage.title">
|
||||
<a :href="subpage.url" :class="subpage.title === thisPage.title ? 'topic active' : 'topic'">
|
||||
{{subpage.title}}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div purpose="content-and-desktop-sidebars" class="d-flex flex-column flex-lg-row">
|
||||
<div purpose="left-sidebar" class="d-none d-lg-flex flex-column text-left left-sidebar">
|
||||
<div purpose="left-sidebar-links">
|
||||
<div v-for="page in findPagesByUrl()" :key="page.title">
|
||||
<p purpose="section-title">{{page.title}}</p>
|
||||
<div purpose="expanded-nav">
|
||||
<a :href="subpage.url" purpose="subpage-link" :class="subpage.title === thisPage.title ? 'topic active' : 'topic'" v-for="subpage in findPagesByUrl(page.url)" :key="subpage.title">
|
||||
{{subpage.title}}
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<a class="pt-4 pb-3" href="/queries">Built-in checks</a>
|
||||
<a class="pb-3" href="/tables">Raw data</a>
|
||||
<a class="pb-3" href="/app-library">App library</a>
|
||||
<a class="pb-3" target="_blank" href="/releases">Release notes</a>
|
||||
<a class="pb-3" href="/docs/contributing" target="_blank">Contributing</a>
|
||||
<a class="pb-3" target="_blank" href="/support">Support</a>
|
||||
<a class="pb-3" href="/contact">Take a tour</a>
|
||||
</div>
|
||||
</div>
|
||||
<a purpose="subpage-link" target="_blank" href="/releases">Release notes</a>
|
||||
<a purpose="subpage-link" href="/docs/contributing" target="_blank">Contributing</a>
|
||||
<a purpose="subpage-link" target="_blank" href="/support">Support</a>
|
||||
<a purpose="subpage-link" href="/contact">Take a tour</a>
|
||||
<div class="d-none d-lg-block" purpose="swag-cta" v-if="showSwagForm">
|
||||
<a class="d-flex align-items-center justify-content-center" @click="clickSwagRequestCTA()">
|
||||
<div class="d-flex flex-column align-items-center">
|
||||
|
|
@ -169,27 +44,24 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div purpose="right-sidebar" class="order-first order-lg-last p-0 pb-2 pb-lg-0 pr-lg-0 right-sidebar" v-if="!thisPage.title.includes('FAQ')">
|
||||
|
||||
<p class="font-weight-bold pb-2 m-0 mb-2" v-if="!_.isEmpty(subtopics)">On this page:</p>
|
||||
<div purpose="subtopics" v-if="!_.isEmpty(subtopics)">
|
||||
<ul class="p-0 m-0">
|
||||
<!-- <li v-for="(subtopic, index) in subtopics" :class="pl-lg-2 pb-3 pb-1g-2 subtopic" :key="index">
|
||||
<a :class="getActiveSubtopicClass(currentLocation, subtopic.url)" :href="subtopic.url">{{subtopic.title}}</a>
|
||||
</li> -->
|
||||
<li v-for="(subtopic, index) in subtopics" class="pl-lg-3 pb-3 pb-lg-2 subtopic" :key="index">
|
||||
<a :href="subtopic.url">{{subtopic.title}}</a>
|
||||
</li>
|
||||
<li class="d-lg-none pl-lg-3 subtopic">
|
||||
<a href="/support">Help and feedback</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div purpose="right-sidebar" class="order-first order-lg-last right-sidebar" v-if="!thisPage.title.includes('FAQ') && !_.isEmpty(subtopics)">
|
||||
<div class="d-none d-lg-block">
|
||||
<p purpose="subtopics-heading" class="font-weight-bold">On this page:</p>
|
||||
<div purpose="subtopics" v-if="!_.isEmpty(subtopics)">
|
||||
<a purpose="subtopic-link" v-for="(subtopic, index) in subtopics" :href="subtopic.url">{{subtopic.title}}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-block d-lg-none" >
|
||||
<div purpose="mobile-custom-select" class="d-flex flex-row justify-content-between" @click="clickOpenMobileSubtopicsNav()">
|
||||
<div><p class="mb-0">On this page</p></div>
|
||||
<div><img src="/images/icon-select-arrows-16x16@2x.png" alt="click to open the table of contents"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div purpose="content" id="body-content" class="d-flex flex-column px-lg-5 content" parasails-has-no-page-script>
|
||||
|
||||
|
||||
<div purpose="content" id="body-content" class="d-flex flex-column content" parasails-has-no-page-script>
|
||||
<%- partial(
|
||||
path.relative(
|
||||
path.dirname(__filename),
|
||||
|
|
@ -202,7 +74,6 @@
|
|||
)
|
||||
)
|
||||
) %>
|
||||
|
||||
<div purpose="docs-start-cta" class="d-flex flex-column flex-sm-row justify-content-between">
|
||||
<div purpose="docs-start-cta-image" class="col-sm-6 col-md-5 col-lg-6"></div>
|
||||
<div purpose="docs-start-cta-content" class="d-flex flex-column justify-content-center text-center">
|
||||
|
|
@ -225,19 +96,40 @@
|
|||
<%}%>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div purpose="back-to-top-button-container">
|
||||
<div purpose="back-to-top-button" nohightlight @click="clickScrollToTop">
|
||||
<p class="mb-0"><img alt="An arrow pointing up" class="d-inline" src="/images/icon-arrow-up-12x13@2x.png">Back to top</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="back-to-top-button-container">
|
||||
<div purpose="back-to-top-button" nohightlight @click="clickScrollToTop">
|
||||
<p class="mb-0"><img alt="An arrow pointing up" class="d-inline" src="/images/icon-arrow-up-12x13@2x.png">Back to top</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div purpose="table-of-contents-modal">
|
||||
<modal v-if="modal === 'table-of-contents'" @close="closeModal()">
|
||||
<div purpose="modal-links">
|
||||
<div v-for="page in findPagesByUrl()" :key="page.title">
|
||||
<p purpose="section-title">{{page.title}}</p>
|
||||
<div purpose="expanded-nav">
|
||||
<a purpose="modal-nav-link" :href="subpage.url" :class="subpage.title === thisPage.title ? 'active' : ''" v-for="subpage in findPagesByUrl(page.url)" :key="subpage.title">
|
||||
{{subpage.title}}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</modal>
|
||||
</div>
|
||||
<div purpose="subtopics-modal">
|
||||
<modal v-if="modal === 'subtopics'" @close="closeModal()">
|
||||
<p class="font-weight-bold pb-2 m-0 mb-2" v-if="!_.isEmpty(subtopics)">On this page:</p>
|
||||
<div purpose="modal-links">
|
||||
<a v-for="subtopic in subtopics" purpose="modal-nav-link" class="d-block" :href="subtopic.url" @click="closeModal()">{{subtopic.title}}</a>
|
||||
</div>
|
||||
</modal>
|
||||
</div>
|
||||
</div>
|
||||
<%- /* Expose server-rendered data as window.SAILS_LOCALS :: */ exposeLocalsToBrowser() %>
|
||||
|
|
|
|||
150
website/views/pages/osquery-table-details.ejs
vendored
150
website/views/pages/osquery-table-details.ejs
vendored
|
|
@ -1,93 +1,74 @@
|
|||
<div id="osquery-table-details" v-cloak>
|
||||
<div class="d-flex flex-column justify-content-center">
|
||||
<div purpose="search-and-filters" class="d-flex flex-column justify-content-center">
|
||||
<div purpose="filter-row" style="max-width: 1200px;" class="mx-auto py-4 w-100 d-flex flex-sm-row flex-column justify-content-between">
|
||||
<div class="d-flex">
|
||||
<div purpose="platform-selector" class="d-flex flex-row justify-content-between align-items-center"
|
||||
id="dropdownMenuSelectPurpose" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
{{userFriendlyPlatformNames[selectedPlatform]}} <img class="d-flex align-self-end" style="width: 16px; height: 16px;" src="/images/chevron-down-16x16@2x.png" alt="a small shevron pointing downwards">
|
||||
</div>
|
||||
<div purpose="platform-selector-dropwdown" class="dropdown-menu" aria-labelledby="dropdownMenuSelectPurpose">
|
||||
<div class="dropdown-item d-block"
|
||||
@click="clickFilterByPlatform('all')">All platforms</div>
|
||||
<div class="dropdown-item d-block"
|
||||
@click="clickFilterByPlatform('windows')">Windows</div>
|
||||
<div class="dropdown-item d-block"
|
||||
@click="clickFilterByPlatform('linux')">Linux</div>
|
||||
<div class="dropdown-item d-block"
|
||||
@click="clickFilterByPlatform('darwin')">macOS</div>
|
||||
<div class="dropdown-item d-block"
|
||||
@click="clickFilterByPlatform('chrome')">ChromeOS</div>
|
||||
</div>
|
||||
<div purpose="page-container">
|
||||
<div purpose="page-content">
|
||||
<docs-nav-and-search search-filter="tables" current-section="tables" :algolia-public-key="algoliaPublicKey"></docs-nav-and-search>
|
||||
<div purpose="page-headline" class="d-flex flex-column">
|
||||
<h2>Tables</h2>
|
||||
<p>Fleet uses osquery tables to query operating system, hardware, and software data. Each table provides specific data for analysis and filtering.</p>
|
||||
</div>
|
||||
<div class="d-flex">
|
||||
<div purpose="search" id="docsearch-query" class="d-flex align-items-center">
|
||||
<div purpose="disabled-search" class="d-flex align-items-center">
|
||||
<img style="height: 16px; width: 16px;" class="d-inline mr-2" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
<input placeholder="Search tables" class="pl-1" >
|
||||
</div>
|
||||
<div purpose="platform-filters" class="d-flex flex-row justify-content-center">
|
||||
<div purpose="platform-filter" :class="[selectedPlatform === 'apple' ? 'selected' : '']" class="d-flex flex-row justify-content-center align-items-center" @click="clickSelectPlatform('apple')">
|
||||
<p class="d-flex align-items-center">
|
||||
<img src="/images/os-macos-dark-24x24@2x.png" alt="macOS" class="d-inline">
|
||||
<span class="d-none d-md-inline">Apple</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div purpose="mobile-nav" class="d-flex d-lg-none flex-column">
|
||||
<div class="d-flex flex-row justify-content-between align-items-center" @click="clickToggleTableNav()">
|
||||
<div purpose="table-of-contents-header" class="d-flex flex-row">
|
||||
<h4 style="font-size: 16px; line-height: 24px; font-weight: 700; margin-bottom: 0px;">
|
||||
<img class="d-inline" style="vertical-align: middle;margin-right: 12px; height: 14px; width: 16px;" src="/images/icon-hamburger-menu-16x14@2x.png" alt="A menu icon">
|
||||
Tables
|
||||
<span class="ml-2" purpose="number-of-tables">{{numberOfTablesDisplayed}}</span>
|
||||
</h4>
|
||||
<div purpose="platform-filter" :class="[selectedPlatform === 'linux' ? 'selected' : '']" class="d-flex flex-row justify-content-center align-items-center" @click="clickSelectPlatform('linux')">
|
||||
<p class="d-flex align-items-center">
|
||||
<img src="/images/os-linux-dark-24x24@2x.png" alt="Linux" class="d-inline">
|
||||
<span class="d-none d-md-inline">Linux</span>
|
||||
</p>
|
||||
</div>
|
||||
<img style="width: 6px; height: 9px;" class="d-flex d-lg-none justify-self-end" alt="right chevron" src="/images/chevron-right-6x9@2x.png" v-if="!showTableNav"/>
|
||||
<img style="width: 9px; height: 6px;" class="d-flex d-lg-none justify-self-end" alt="down chevron" src="/images/chevron-down-9x6@2x.png" v-else/>
|
||||
</div>
|
||||
<div class="d-flex d-lg-none pt-3" v-if="showTableNav">
|
||||
<div purpose="mobile-table-of-contents">
|
||||
<a class="d-block" :class="[tableToDisplay.title === table.title ? 'active' : '']" :href="table.url+[selectedPlatform !== 'all' ? '?platformFilter='+encodeURIComponent(selectedPlatform) : '' ]" v-for="table in filteredTables">{{table.title}} <span purpose="evented-table-icon" v-if="table.evented"><img alt="evented table" src="/images/icon-evented-12x12@2x.png" ></span></a>
|
||||
<div purpose="platform-filter" :class="[selectedPlatform === 'windows' ? 'selected' : '']" class="d-flex flex-row justify-content-center align-items-center" @click="clickSelectPlatform('windows')">
|
||||
<p class="d-flex align-items-center">
|
||||
<img src="/images/os-windows-dark-24x24@2x.png" alt="Windows" class="d-inline">
|
||||
<span class="d-none d-md-inline">Windows</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr class="d-lg-none d-flex">
|
||||
</div>
|
||||
<div purpose="content" class="container" style="max-width: 1200px;">
|
||||
<div class="d-flex flex-lg-row flex-column justify-content-between">
|
||||
<div purpose="left-sidebar" class="d-none d-lg-flex flex-column">
|
||||
<div class="d-flex flex-row justify-content-between">
|
||||
<div purpose="table-of-contents-header" class="d-flex flex-row">
|
||||
<h4 style="font-size: 16px; line-height: 24px; font-weight: 700;">
|
||||
Tables<span class="ml-2" purpose="number-of-tables">{{numberOfTablesDisplayed}}</span>
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div style="position: relative;">
|
||||
<div purpose="table-of-contents">
|
||||
<a class="d-block" purpose="table-of-contents-link" :class="[tableToDisplay.title === table.title ? 'active' : '']" :href="table.url+[selectedPlatform !== 'all' ? '?platformFilter='+encodeURIComponent(selectedPlatform) : '' ]" v-for="table in filteredTables">{{table.title}} <span purpose="evented-table-icon" v-if="table.evented"><img alt="evented table" src="/images/icon-evented-12x12@2x.png" ></span></a>
|
||||
</div>
|
||||
<div purpose="overflow-shadow" class="d-none d-lg-block"></div>
|
||||
<div purpose="platform-filter" :class="[selectedPlatform === 'chrome' ? 'selected' : '']" class="d-flex flex-row justify-content-center align-items-center" @click="clickSelectPlatform('chrome')">
|
||||
<p class="d-flex align-items-center">
|
||||
<img src="/images/os-chromeos-dark-24x24@2x.png" alt="Chrome" class="d-inline">
|
||||
<span class="d-none d-md-inline">ChromeOS</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div purpose="table-container" class="d-flex flex-column pl-xl-5 pl-lg-3 w-100">
|
||||
<div purpose="schema-table">
|
||||
<div purpose="platform-logos" class="d-flex flex-row align-items-center">
|
||||
<img class="mx-2" style="height: 25px" src="/images/os-macos-dark-24x24@2x.png" alt="macOS logo" v-if="_.includes(tableToDisplay.platforms, 'darwin')">
|
||||
<img class="mx-2" style="height: 24px" src="/images/os-windows-dark-24x24@2x.png" alt="Windows logo" v-if="_.includes(tableToDisplay.platforms, 'windows')">
|
||||
<img class="mx-2" style="height: 24px" src="/images/os-linux-dark-24x24@2x.png" alt="Linux logo" v-if="_.includes(tableToDisplay.platforms, 'linux')">
|
||||
<img class="mx-2" style="height: 25px" src="/images/os-chromeos-dark-24x24@2x.png" alt="macOS logo" v-if="_.includes(tableToDisplay.platforms, 'chrome')">
|
||||
</div>
|
||||
<%- partial(path.relative(path.dirname(__filename), path.resolve( sails.config.appPath, path.join(sails.config.builtStaticContent.compiledPagePartialsAppPath, tableToDisplay.htmlId)))) %>
|
||||
</div>
|
||||
|
||||
<div class="justify-self-end">
|
||||
<a :href="tableToDisplay.githubUrl" purpose="edit-button" target="_blank">Edit page<i class="fa fa-pencil"></i></a>
|
||||
<div class="d-block justify-self-end" purpose="slack-cta">
|
||||
<h3 class="pt-0" style="font-size: 24px; line-height: 28px;">Need more help?</h3>
|
||||
<div class="d-sm-flex">
|
||||
<a href="/slack" target="_blank" class="d-flex btn btn-md btn-outline-secondary justify-content-center align-items-center mt-3 mt-sm-0" purpose="next-steps-button">
|
||||
<img style="height: 24px;" class="pr-3" alt="Slack logo" src="/images/logo-slack-24x24@2x.png"/>
|
||||
Ask the community on Slack
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<div class="d-flex flex-column justify-content-center">
|
||||
<div purpose="content" class="container p-0" style="max-width: 1200px;">
|
||||
<div class="d-flex flex-lg-row flex-column justify-content-start">
|
||||
<div purpose="left-sidebar" class="d-none d-lg-flex flex-column">
|
||||
<div style="position: relative;">
|
||||
<div purpose="table-of-contents">
|
||||
<a class="d-block" purpose="table-of-contents-link" :class="[tableToDisplay.title === table.title ? 'active' : '']" :href="table.url+'#'+selectedPlatform" v-for="table in filteredTables">{{table.title}} <span purpose="evented-table-icon" v-if="table.evented"><img alt="evented table" src="/images/icon-evented-12x12@2x.png" ></span></a>
|
||||
</div>
|
||||
<div purpose="overflow-shadow" class="d-none d-lg-block"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="mobile-custom-select" class="d-flex d-lg-none flex-row justify-content-between" @click="clickOpenTablesNav()">
|
||||
<div><p class="mb-0"><%= tableToDisplay.title %></p></div>
|
||||
<div><img src="/images/icon-select-arrows-16x16@2x.png" alt="click to open the table of contents"></div>
|
||||
</div>
|
||||
|
||||
<div purpose="table-container" class="d-flex flex-column">
|
||||
<div purpose="schema-table">
|
||||
<%- partial(path.relative(path.dirname(__filename), path.resolve( sails.config.appPath, path.join(sails.config.builtStaticContent.compiledPagePartialsAppPath, tableToDisplay.htmlId)))) %>
|
||||
</div>
|
||||
|
||||
<div class="justify-self-end">
|
||||
<a :href="tableToDisplay.githubUrl" purpose="edit-button" target="_blank">Edit page<i class="fa fa-pencil"></i></a>
|
||||
<div class="d-block justify-self-end" purpose="slack-cta">
|
||||
<h3 class="pt-0" style="font-size: 24px; line-height: 28px;">Need more help?</h3>
|
||||
<div class="d-sm-flex">
|
||||
<a href="/slack" target="_blank" class="d-flex btn btn-md btn-outline-secondary justify-content-center align-items-center mt-3 mt-sm-0" purpose="next-steps-button">
|
||||
<img style="height: 24px;" class="pr-3" alt="Slack logo" src="/images/logo-slack-24x24@2x.png"/>
|
||||
Ask the community on Slack
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -95,5 +76,12 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="table-of-contents-modal" >
|
||||
<modal v-if="modal === 'table-of-contents'" @close="closeModal()">
|
||||
<div purpose="modal-table-of-contents">
|
||||
<a class="d-block" purpose="modal-table-of-contents-link" :class="[tableToDisplay.title === table.title ? 'active' : '']" :href="table.url+'#'+selectedPlatform" v-for="table in filteredTables">{{table.title}} <span purpose="evented-table-icon" v-if="table.evented"><img alt="evented table" src="/images/icon-evented-12x12@2x.png" ></span></a>
|
||||
</div>
|
||||
</modal>
|
||||
</div>
|
||||
</div>
|
||||
<%- /* Expose server-rendered data as window.SAILS_LOCALS :: */ exposeLocalsToBrowser() %>
|
||||
|
|
|
|||
29
website/views/pages/policy-details.ejs
vendored
29
website/views/pages/policy-details.ejs
vendored
|
|
@ -1,30 +1,13 @@
|
|||
<div id="policy-details" v-cloak>
|
||||
<div purpose="page-container">
|
||||
<div purpose="page-content">
|
||||
<div purpose="breadcrumbs-and-search" class="d-flex flex-md-row flex-column justify-content-between align-items-md-center align-items-start">
|
||||
<div purpose="breadcrumbs" class="d-flex flex-row align-items-start">
|
||||
<div>
|
||||
<a purpose="breadcrumbs-category" class="text-nowrap" href="/policies">Policies</a>/
|
||||
</div>
|
||||
<div purpose="breadcrumbs-title">
|
||||
<span><%- policy.name %></span>
|
||||
</div>
|
||||
<docs-nav-and-search search-filter="policies" current-section="policies" :algolia-public-key="algoliaPublicKey"></docs-nav-and-search>
|
||||
<div purpose="breadcrumbs" class="d-flex flex-row align-items-start">
|
||||
<div>
|
||||
<a purpose="breadcrumbs-category" class="text-nowrap" href="/policies">Policies</a>/
|
||||
</div>
|
||||
<div purpose="search" id="docsearch-query" class="d-flex">
|
||||
<div purpose="disabled-search" class="d-flex w-100">
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text border-0 bg-transparent pl-3" >
|
||||
<img style="height: 16px; width: 16px;" class="search" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-control border-0 ">
|
||||
<input class="docsearch-input pr-1"
|
||||
placeholder="Search" aria-label="Search the handbook"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="breadcrumbs-title">
|
||||
<span><%- policy.name %></span>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="policy-details-and-sidebar" class="d-flex flex-lg-row flex-column">
|
||||
|
|
|
|||
17
website/views/pages/policy-library.ejs
vendored
17
website/views/pages/policy-library.ejs
vendored
|
|
@ -2,28 +2,13 @@
|
|||
|
||||
<div purpose="page-container">
|
||||
<div purpose="page-content">
|
||||
<docs-nav-and-search search-filter="policies" current-section="policies" :algolia-public-key="algoliaPublicKey"></docs-nav-and-search>
|
||||
<div purpose="search-and-headline" class="d-flex flex-md-row flex-column justify-content-between align-items-md-center align-items-start">
|
||||
<div purpose="page-headline" class="d-flex flex-column">
|
||||
<h2>Policies</h2>
|
||||
<p>A collection of policies, OS settings, and scripts for macOS, Windows, and Linux.</p>
|
||||
<p>Contributions welcome <a target="_blank" href="https://github.com/fleetdm/fleet/blob/main/docs/01-Using-Fleet/standard-query-library/standard-query-library.yml">over on GitHub.</a></p>
|
||||
</div>
|
||||
<div purpose="policy-search" id="docsearch-query" class="d-flex">
|
||||
<div purpose="disabled-search" class="d-flex">
|
||||
<div class="input-group d-flex flex-nowrap">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text border-0 bg-transparent" >
|
||||
<img style="height: 16px; width: 16px;" class="search" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-control border-0 ">
|
||||
<input class="docsearch-input pr-1"
|
||||
placeholder="Search" aria-label="Search"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="platform-filters" class="d-flex flex-row justify-content-center">
|
||||
<div purpose="platform-filter" :class="[selectedPlatform === 'macos' ? 'selected' : '']" class="d-flex flex-row justify-content-center align-items-center" @click="clickSelectPlatform('macos')">
|
||||
|
|
|
|||
29
website/views/pages/query-detail.ejs
vendored
29
website/views/pages/query-detail.ejs
vendored
|
|
@ -1,30 +1,13 @@
|
|||
<div id="query-detail" v-cloak>
|
||||
<div purpose="page-container">
|
||||
<div purpose="page-content">
|
||||
<div purpose="breadcrumbs-and-search" class="d-flex flex-md-row flex-column justify-content-between align-items-md-center align-items-start">
|
||||
<div purpose="breadcrumbs" class="d-flex flex-row align-items-start">
|
||||
<div>
|
||||
<a purpose="breadcrumbs-category" class="text-nowrap" href="/queries">Queries</a>/
|
||||
</div>
|
||||
<div purpose="breadcrumbs-title">
|
||||
<span><%- query.name %></span>
|
||||
</div>
|
||||
<docs-nav-and-search search-filter="queries" current-section="queries" :algolia-public-key="algoliaPublicKey"></docs-nav-and-search>
|
||||
<div purpose="breadcrumbs" class="d-flex flex-row align-items-start">
|
||||
<div>
|
||||
<a purpose="breadcrumbs-category" class="text-nowrap" href="/queries">Queries</a>/
|
||||
</div>
|
||||
<div purpose="search" id="docsearch-query" class="d-flex">
|
||||
<div purpose="disabled-search" class="d-flex w-100">
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text border-0 bg-transparent pl-3" >
|
||||
<img style="height: 16px; width: 16px;" class="search" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-control border-0 ">
|
||||
<input class="docsearch-input pr-1"
|
||||
placeholder="Search" aria-label="Search the handbook"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="breadcrumbs-title">
|
||||
<span><%- query.name %></span>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="query-details-and-sidebar" class="d-flex flex-lg-row flex-column">
|
||||
|
|
|
|||
17
website/views/pages/query-library.ejs
vendored
17
website/views/pages/query-library.ejs
vendored
|
|
@ -2,27 +2,12 @@
|
|||
|
||||
<div purpose="page-container">
|
||||
<div purpose="page-content">
|
||||
<docs-nav-and-search search-filter="queries" current-section="queries" :algolia-public-key="algoliaPublicKey"></docs-nav-and-search>
|
||||
<div purpose="search-and-headline" class="d-flex flex-md-row flex-column justify-content-between align-items-md-center align-items-start">
|
||||
<div purpose="page-headline" class="d-flex flex-column">
|
||||
<h2>Queries</h2>
|
||||
<p>A collection of optional queries you can run anytime. Contributions welcome <a target="_blank" href="https://github.com/fleetdm/fleet/edit/main/docs/queries.yml">over on GitHub.</a></p>
|
||||
</div>
|
||||
<div purpose="policy-search" id="docsearch-query" class="d-flex">
|
||||
<div purpose="disabled-search" class="d-flex">
|
||||
<div class="input-group d-flex flex-nowrap">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text border-0 bg-transparent" >
|
||||
<img style="height: 16px; width: 16px;" class="search" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-control border-0 ">
|
||||
<input class="docsearch-input pr-1"
|
||||
placeholder="Search" aria-label="Search"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="platform-filters" class="d-flex flex-row justify-content-center">
|
||||
<div purpose="platform-filter" :class="[selectedPlatform === 'macos' ? 'selected' : '']" class="d-flex flex-row justify-content-center align-items-center" @click="clickSelectPlatform('macos')">
|
||||
|
|
|
|||
17
website/views/pages/vital-details.ejs
vendored
17
website/views/pages/vital-details.ejs
vendored
|
|
@ -1,27 +1,12 @@
|
|||
<div id="vital-details" v-cloak>
|
||||
<div purpose="page-container">
|
||||
<div purpose="page-content">
|
||||
<docs-nav-and-search search-filter="vitals" current-section="vitals" :algolia-public-key="algoliaPublicKey"></docs-nav-and-search>
|
||||
<div purpose="search-and-headline" class="d-flex flex-md-row flex-column justify-content-between align-items-md-center align-items-start">
|
||||
<div purpose="page-headline" class="d-flex flex-column">
|
||||
<h2>Vitals</h2>
|
||||
<p>Fleet’s built-in queries for collecting and storing important device information.</p>
|
||||
</div>
|
||||
<div purpose="vitals-search" id="docsearch-query" class="d-flex">
|
||||
<div purpose="disabled-search" class="d-flex">
|
||||
<div class="input-group d-flex flex-nowrap">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text border-0 bg-transparent" >
|
||||
<img style="height: 16px; width: 16px;" class="search" alt="search" src="/images/icon-search-16x16@2x.png">
|
||||
</span>
|
||||
</div>
|
||||
<div class="form-control border-0 ">
|
||||
<input class="docsearch-input pr-1"
|
||||
placeholder="Search" aria-label="Search"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="platform-filters" class="d-flex flex-row justify-content-center">
|
||||
<div purpose="platform-filter" :class="[selectedPlatform === 'apple' ? 'selected' : '']" class="d-flex flex-row justify-content-center align-items-center" @click="clickSelectPlatform('apple')">
|
||||
|
|
|
|||
Loading…
Reference in a new issue