Elgato_dark/fleet
1
0
Fork 0
mirror of https://github.com/fleetdm/fleet synced 2026-05-23 17:08:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 83

Website: Upgrade to DocSearch v3 (#12563)

Browse source 
Changes:
- Upgraded the version of Algolia DocSearch we use on the Fleet website.
- Updated search box styles in the docs, handbook, and osquery schema
pages.
This commit is contained in:
Eric 2023-07-11 19:54:05 -05:00 committed by GitHub
parent 85e9276193
commit 87714f466c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 895 additions and 593 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
website/assets/dependencies/docsearch.min.js vendored
View file

File diff suppressed because one or more lines are too long

6
website/assets/js/pages/docs/basic-documentation.page.js vendored
View file

@ -95,9 +95,9 @@ parasails.registerPage('basic-documentation', {
appId: 'NZXAYZXDGH',
apiKey: this.algoliaPublicKey,
indexName: 'fleetdm',
inputSelector: (this.isDocsLandingPage ? '#docsearch-query-landing' : '#docsearch-query'),
debug: false,
algoliaOptions: {
container: (this.isDocsLandingPage ? '#docsearch-query-landing' : '#docsearch-query'),
clickAnalytics: true,
searchParameters: {
'facetFilters': ['section:docs']
},
});

5
website/assets/js/pages/handbook/basic-handbook.page.js vendored
View file

@ -33,10 +33,11 @@ parasails.registerPage('basic-handbook', {
appId: 'NZXAYZXDGH',
apiKey: this.algoliaPublicKey,
indexName: 'fleetdm',
inputSelector: '#docsearch-query',
container: '#docsearch-query',
placeholder: 'Search the handbook...',
debug: false,
clickAnalytics: true,
algoliaOptions: {
searchParameters: {
facetFilters: ['section:handbook']
},
});

5
website/assets/js/pages/osquery-table-details.page.js vendored
View file

@ -42,9 +42,10 @@ parasails.registerPage('osquery-table-details', {
appId: 'NZXAYZXDGH',
apiKey: this.algoliaPublicKey,
indexName: 'fleetdm',
inputSelector: '#docsearch-query',
container: '#docsearch-query',
placeholder: 'Search tables',
debug: false,
algoliaOptions: {
searchParameters: {
'facetFilters': ['section:tables']
},
});

1187
website/assets/styles/docsearch.less vendored
View file

File diff suppressed because one or more lines are too long

3
website/assets/styles/layout.less vendored
View file

@ -8,6 +8,7 @@ html, body {
margin: 0;
}
[purpose='page-wrap'] {
height: 100%;
height: auto !important;//lesshint-disable-line importantRule,duplicateProperty
@ -32,7 +33,7 @@ html, body {
transition-duration: 500ms;
left: 0;
right: 0;
z-index: 999;
z-index: 199;
position: sticky;
position: -webkit-sticky; //lesshint-disable-line duplicateProperty
top: 0;

47
website/assets/styles/pages/docs/basic-documentation.less vendored
View file

@ -72,6 +72,47 @@
[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: 48px;
}
.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;
}
.DocSearch-Button-Placeholder::after {
content: ' the docs...';
}
input {
padding-top: 6px;
padding-bottom: 6px;
@ -209,7 +250,11 @@
font-size: 16px;
padding: 0;
}
.DocSearch-Button {
height: 36px;
font-size: 16px;
padding: 0;
}
}
[purpose='breadcrumbs'] {

102
website/assets/styles/pages/handbook/basic-handbook.less vendored
View file

@ -15,45 +15,89 @@
}
[purpose='search'] {
padding-bottom: 16px;
input {
padding-top: 6px;
padding-bottom: 6px;
border: none;
} &::placeholder {
font-size: 16px;
line-height: 24px;
}
.input-group {
// 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: #FFF;
background-color: #FFF;
padding: 6px;
height: 36px;
margin: 0;
}
.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-input {
height: 100%;
width: 98%;
}
.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;
.DocSearch-Button-Placeholder {
font-size: 16px;
} &:focus {
border: none;
font-weight: 400;
padding-left: 12px;
}
.DocSearch-Button-Placeholder::after {
content: ' the handbook...';
}
[purpose='disabled-search'] {
input {
padding-top: 6px;
padding-bottom: 6px;
border: none;
} &::placeholder {
font-size: 16px;
line-height: 24px;
}
.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;
}
.docsearch-input {
height: 100%;
width: 98%;
}
.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;
}
}
}

71
website/assets/styles/pages/osquery-table-details.less vendored
View file

@ -25,23 +25,69 @@
width: 160px;
cursor: pointer;
}
[purpose='search'] {
// Note: We're using classes here to override the default Docsearch styles;
width: 260px;
padding: 8px 15px;
border: 1px solid @core-vibrant-blue-15;
background: #FFF;
border-radius: 8px;
input {
border: 0;
padding: 0;
width: 100%;
button {
width: 260px;
cursor: text;
margin: 0;
}
input::placeholder {
.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;
height: 42px;
padding: 8px 15px;
margin: 0;
}
.DocSearch-Button:hover {
box-shadow: none;
border: 1px solid @core-fleet-black-25;
color: @core-fleet-black-50;
}
.DocSearch-Search-Icon {
height: 16px;
width: 16px;
color: @core-fleet-black-50;
stroke-width: 3px;
}
.DocSearch-Button-Keys {
display: none;
}
.DocSearch-Button-Placeholder {
font-size: 16px;
line-height: 24px;
font-weight: 400;
padding-left: 12px;
}
input:focus {
outline: rgba(0, 0, 0, 0);
.DocSearch-Button-Placeholder::after {
content: ' tables';
}
[purpose='disabled-search'] {
padding: 8px 15px;
border-radius: 8px;
border: 1px solid @core-vibrant-blue-15;
background: #FFF;
width: 100%;
display: flex;
input {
border: 0;
padding: 0;
width: 100%;
}
input::placeholder {
font-size: 16px;
line-height: 24px;
}
input:focus {
outline: rgba(0, 0, 0, 0);
}
}
}
[purpose='search']:focus-within {
@ -417,6 +463,9 @@
[purpose='search'] {
margin-top: 12px;
width: 100%;
button {
width: 100%;
}
}
}
[purpose='schema-table'] {

4
website/views/layouts/layout-customer.ejs vendored
View file

@ -293,12 +293,12 @@
// - https://github.com/lancedikson/bowser/tree/1fb99ced0e8834fd9662604bad7e0f0c3eba2786#rendering-engine-flags
// --------------------------------------------------------------------
var LATEST_SUPPORTED_VERSION_BY_OS = {
iOS: '11',//« earliest version that suppports the hubspot chatbot.
iOS: '12',//« earliest version that suppports the hubspot chatbot.
Android: '7' // « earliest version we can test for compatibility issues with on browserstack
};
var LATEST_SUPPORTED_VERSION_BY_USER_AGENT = {
msedge: '80',//« earliest version to support the backdrop filter css property.
safari: '11',//« earliest version that suppports the hubspot chatbot.
safari: '12',//« earliest version that suppports the hubspot chatbot.
firefox: '102',//« earliest version to support the backdrop filter css property.
chrome: '76',//« earliest version to support the backdrop filter css property.
opera: '64',//« earliest version to support the backdrop filter css property.

4
website/views/layouts/layout-landing.ejs vendored
View file

@ -293,12 +293,12 @@
// - https://github.com/lancedikson/bowser/tree/1fb99ced0e8834fd9662604bad7e0f0c3eba2786#rendering-engine-flags
// --------------------------------------------------------------------
var LATEST_SUPPORTED_VERSION_BY_OS = {
iOS: '11',//« earliest version that suppports the hubspot chatbot.
iOS: '12',//« earliest version that suppports the hubspot chatbot.
Android: '7' // « earliest version we can test for compatibility issues with on browserstack
};
var LATEST_SUPPORTED_VERSION_BY_USER_AGENT = {
msedge: '80',//« earliest version to support the backdrop filter css property.
safari: '11',//« earliest version that suppports the hubspot chatbot.
safari: '12',//« earliest version that suppports the hubspot chatbot.
firefox: '102',//« earliest version to support the backdrop filter css property.
chrome: '76',//« earliest version to support the backdrop filter css property.
opera: '64',//« earliest version to support the backdrop filter css property.

4
website/views/layouts/layout.ejs vendored
View file

@ -493,12 +493,12 @@
// - https://github.com/lancedikson/bowser/tree/1fb99ced0e8834fd9662604bad7e0f0c3eba2786#rendering-engine-flags
// --------------------------------------------------------------------
var LATEST_SUPPORTED_VERSION_BY_OS = {
iOS: '11',//« earliest version that suppports the hubspot chatbot.
iOS: '12',//« earliest version that suppports the hubspot chatbot.
Android: '7' // « earliest version we can test for compatibility issues with on browserstack
};
var LATEST_SUPPORTED_VERSION_BY_USER_AGENT = {
msedge: '80',//« earliest version to support the backdrop filter css property.
safari: '11',//« earliest version that suppports the hubspot chatbot.
safari: '12',//« earliest version that suppports the hubspot chatbot.
firefox: '102',//« earliest version to support the backdrop filter css property.
chrome: '76',//« earliest version to support the backdrop filter css property.
opera: '64',//« earliest version to support the backdrop filter css property.

12
website/views/pages/docs/basic-documentation.ejs vendored
View file

@ -8,7 +8,7 @@
<p class="mb-2">Welcome to the documentation for Fleet, the lightweight management platform for laptops and servers.</p>
</div>
<div purpose="search" class="d-flex p-0 mt-5">
<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" >
@ -16,9 +16,9 @@
</span>
</div>
<div class="form-control border-0 ">
<input id="docsearch-query-landing" class="docsearch-input pr-1"
<input class="docsearch-input pr-1"
placeholder="Search the docs..." aria-label="Search the docs"
v-model="inputTextValue" @keydown.self="delayInput(setSearchString, 400, 'defaultTimer')()" />
/>
</div>
</div>
</div>
@ -65,7 +65,7 @@
</div>
</div>
<div purpose="search" class="d-flex p-0 mb-2 mb-lg-0">
<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">
@ -73,9 +73,9 @@
</span>
</div>
<div class="form-control border-0 ">
<input id="docsearch-query" class="docsearch-input pr-1"
<input class="docsearch-input pr-1"
placeholder="Search the docs..." aria-label="Search the docs"
v-model="inputTextValue" @keydown.self="delayInput(setSearchString, 400, 'defaultTimer')()" />
v-model="inputTextValue"/>
</div>
</div>
</div>

24
website/views/pages/handbook/basic-handbook.ejs vendored
View file

@ -46,17 +46,19 @@
</div>
</div>
<div purpose="search" class="d-flex">
<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 id="docsearch-query" class="docsearch-input pr-1"
placeholder="Search the handbook..." aria-label="Search the handbook"
/>
<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 the handbook..." aria-label="Search the handbook"
/>
</div>
</div>
</div>
</div>

8
website/views/pages/osquery-table-details.ejs vendored
View file

@ -22,9 +22,11 @@
</div>
</div>
<div class="d-flex">
<div purpose="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" id="docsearch-query">
<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>
</div>
</div>