Skip to content
Snippets Groups Projects
Unverified Commit be0d00cb authored by Patrick Marsceill's avatar Patrick Marsceill
Browse files

getting this on GH

parent bdd5d105
No related branches found
No related tags found
No related merge requests found
......@@ -26,10 +26,7 @@ sass:
permalink: pretty
exclude: ["node_modules/", "*.gemspec", "Gemfile", "Gemfile.lock", "package.json", "script/", "LICENSE.txt", "lib/", "bin/"]
# Aux links for the upper right navigation
aux_links:
GitHub:
"View it on GitHub":
- "//github.com/pmarsceill/just-the-docs"
"Support link":
- "//google.com/turds"
"Another link":
- "//yahoo.com"
......@@ -25,9 +25,9 @@
<div class="js-search-results search-results-wrap"></div>
</div>
{% if site.aux_links != nil %}
<ul class="list-style-none text-small">
<ul class="list-style-none text-small mt-2 js-aux-nav aux-nav">
{% for link in site.aux_links %}
<li class="d-inline-block{% unless forloop.last %} mr-2{% endunless %}"><a href="{{ link.last }}">{{ link.first }}</a></li>
<li class="d-inline-block my-0{% unless forloop.last %} mr-2{% endunless %}"><a href="{{ link.last }}">{{ link.first }}</a></li>
{% endfor %}
</ul>
{% endif %}
......
......@@ -73,12 +73,21 @@
}
.page-header {
border-bottom: $border $border-color;
background-color: $grey-lt-000;
@include mq(md) {
.main-content {
background-color: $white;
border-bottom: $border $border-color;
}
.main-content {
padding-top: 0;
@include mq(md) {
display: flex;
justify-content: space-between;
padding-top: $sp-4;
}
}
}
......
......@@ -23,7 +23,7 @@
list-style: none;
@include mq(md) {
margin-top: $sp-8;
margin-top: $sp-10;
}
}
......@@ -71,7 +71,8 @@
// Small screen nav
.main-nav {
.main-nav,
.aux-nav {
display: none;
&.nav-open {
......
......@@ -9,6 +9,7 @@
position: relative;
z-index: 99;
display: block;
flex-grow: 1;
padding-top: $sp-1;
padding-bottom: $gutter-spacing / 2;
}
......@@ -35,7 +36,7 @@
}
.search-input {
width: 200px;
width: 100%;
padding-top: $sp-1;
padding-bottom: $sp-1;
border-top: 0;
......
......@@ -11,6 +11,7 @@ function removeEvent(el, type, handler) {
function toggleNav(){
const nav = document.querySelector('.js-main-nav');
const auxNav = document.querySelector('.js-aux-nav');
const navTrigger = document.querySelector('.js-main-nav-trigger');
addEvent(navTrigger, 'click', function(){
......@@ -18,6 +19,7 @@ function toggleNav(){
var textToggle = navTrigger.getAttribute('data-text-toggle');
nav.classList.toggle('nav-open');
auxNav.classList.toggle('nav-open');
navTrigger.classList.toggle('nav-open');
navTrigger.innerText = textToggle;
navTrigger.setAttribute('data-text-toggle', text);
......@@ -30,7 +32,7 @@ function toggleNav(){
function initSearch() {
var index = lunr(function () {
this.ref('id');
this.field('title');
this.field('title', { boost: 20 });
this.field('content');
this.field('url');
});
......
......@@ -12,4 +12,31 @@ Just the docs uses [lunr.js](http://lunrjs.com) to add a client-side search inte
- Page content
- Page URL
## Setup search
Before you can use search, you must initialize the feature by running this
rake command that comes with the `just-the-docs`
```bash
$ bundle exec just-the-docs rake search:init
```
This command creates the `search-data.json` file that Jekyll uses to create
your search index. Alternatively, you can create the file manually in the
root of your Jekyll site with this content:
```{% raw %}
---
---
{
{% for page in site.html_pages %}"{{ forloop.index0 }}": {
"id": "{{ forloop.index0 }}",
"title": "{{ page.title | xml_escape }}",
"content": "{{ page.content | markdownify | strip_html | xml_escape | remove: 'Table of contents' | remove: page.title | strip_newlines | replace: '\', ' '}}",
"url": "{{ page.url | xml_escape }}"
}{% if forloop.last %}{% else %},
{% endif %}{% endfor %}
}{% endraw %}
```
You can modify this by modifying the forloop in `search-data.json` and the javascript in `just-the-docs.js` on line 30.
......@@ -6,7 +6,7 @@ nav_order: 1
# Focus on writing good documentation
{: .fs-9 .mb-md-8 :}
{: .fs-9 }
Just the Docs gives your documentation a jumpstart with a responsive Jekyll theme that is easily customizable and hosted on GitHub pages.
{: .fs-6 .fw-300 }
......@@ -32,6 +32,10 @@ gem "just-the-docs"
```yaml
theme: "just-the-docs"
```
3. _Optional:_ Initialize search data (creates `search-data.json`)
```bash
$ bundle exec just-the-docs rake search:init
```
3. Run you local Jekyll server
```bash
$ jekyll serve
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment