steve/just-the-docs
1
0
Fork 0
mirror of https://github.com/snachodog/just-the-docs.git synced 2025-09-12 21:03:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

Updated lunr.js, added search navigation and preview/highlighting

Browse Source
This commit is contained in:
Silvio Giebl
2019-05-18 23:07:02 +02:00
parent e9f016ac0f
commit e64a6aa239
5 changed files with 219 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
_sass/layout.scss
View File

@@ -179,7 +179,6 @@ body {
bottom: 0;
padding-top: $sp-4;
padding-bottom: $sp-4;
background-color: $sidebar-color;
@include mq(md) {
position: static;

54
_sass/search.scss
View File

@@ -79,6 +79,10 @@
&.active {
display: block;
}
@include mq(md) {
width: $search-results-width;
}
}
.search-results-list {
@@ -98,15 +102,57 @@
margin: 0;
}
.search-results-link {
.search-result {
display: block;
padding-top: $sp-1;
padding-right: $sp-3;
padding-bottom: $sp-1;
padding-left: $sp-3;
padding-right: $sp-3;
&:hover {
color: $body-heading-color;
background-color: darken($body-background-color, 2%);
background-color: darken($body-background-color, 5%);
}
@include mq(md) {
padding-left: $sp-4;
padding-right: $sp-4;
&.active {
background-color: darken($body-background-color, 5%);
}
}
.search-result-title {
display: block;
padding-top: $sp-2;
padding-bottom: $sp-2;
padding-right: $sp-4;
@include mq(sm) {
display: inline-block;
width: 40%;
vertical-align: top;
}
}
.search-result-preview {
display: block;
padding-top: $sp-2;
padding-bottom: $sp-2;
padding-left: $sp-4;
border-left: $border;
border-left-color: $border-color;
color: $search-result-preview-color;
@include fs-2;
@include mq(sm) {
display: inline-block;
width: 60%;
}
}
.search-result-highlight {
color: $link-color;
font-weight: bold;
}
}

2
_sass/support/_variables.scss
View File

@@ -56,6 +56,7 @@ $code-background-color: $grey-lt-000 !default;
$body-text-color: $grey-dk-100 !default;
$body-heading-color: $grey-dk-300 !default;
$search-result-preview-color: $grey-dk-100 !default;
$nav-child-link-color: $grey-dk-100 !default;
$link-color: $purple-000 !default;
$btn-primary-color: $purple-100 !default;
@@ -110,6 +111,7 @@ $nav-width: 264px !default;
$nav-width-md: 248px !default;
$content-width: 800px !default;
$header-height: 60px !default;
$search-results-width: 488px !default;
//
// Media queries in pixels