diff --git a/_config.yml b/_config.yml index 79084a83c373d428a2c47ce7a33d648eefde02ca..60ab6ce39e1dd07f3243282fd55dae1749604df0 100644 --- a/_config.yml +++ b/_config.yml @@ -25,3 +25,11 @@ sass: permalink: pretty exclude: ["node_modules/", "*.gemspec", "Gemfile", "Gemfile.lock", "package.json", "LICENSE.txt"] + +aux_links: + GitHub: + - "//github.com/pmarsceill/just-the-docs" + "Support link": + - "//google.com/turds" + "Another link": + - "//yahoo.com" diff --git a/_layouts/default.html b/_layouts/default.html index bfeb2defdb487cfe4eb166232d3c7cdbf8767ee9..e8c090e7e6e3f953e8ac132b3ac945014dcce382 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -15,24 +15,34 @@ </div> </div> <div class="main-content-wrap"> - <div class="search"> - <div class="search-input-wrap"> - <input type="text" class="js-search-input search-input fs-2" placeholder="Search {{ site.title }}" aria-label="Search {{ site.title }}" autocomplete="off"> - <svg width="14" height="14" viewBox="0 0 28 28" xmlns="http://www.w3.org/2000/svg" class="search-icon"><title>Search</title><g fill-rule="nonzero"><path d="M17.332 20.735c-5.537 0-10-4.6-10-10.247 0-5.646 4.463-10.247 10-10.247 5.536 0 10 4.601 10 10.247s-4.464 10.247-10 10.247zm0-4c3.3 0 6-2.783 6-6.247 0-3.463-2.7-6.247-6-6.247s-6 2.784-6 6.247c0 3.464 2.7 6.247 6 6.247z"/><path d="M11.672 13.791L.192 25.271 3.02 28.1 14.5 16.62z"/></g></svg> + <div class="page-header"> + <div class="main-content pb-0"> + <div class="search"> + <div class="search-input-wrap"> + <input type="text" class="js-search-input search-input fs-2" placeholder="Search {{ site.title }}" aria-label="Search {{ site.title }}" autocomplete="off"> + <svg width="14" height="14" viewBox="0 0 28 28" xmlns="http://www.w3.org/2000/svg" class="search-icon"><title>Search</title><g fill-rule="nonzero"><path d="M17.332 20.735c-5.537 0-10-4.6-10-10.247 0-5.646 4.463-10.247 10-10.247 5.536 0 10 4.601 10 10.247s-4.464 10.247-10 10.247zm0-4c3.3 0 6-2.783 6-6.247 0-3.463-2.7-6.247-6-6.247s-6 2.784-6 6.247c0 3.464 2.7 6.247 6 6.247z"/><path d="M11.672 13.791L.192 25.271 3.02 28.1 14.5 16.62z"/></g></svg> + </div> + <div class="js-search-results search-results-wrap"></div> + </div> + {% if site.aux_links != nil %} + <ul class="list-style-none text-small"> + {% 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> + {% endfor %} + </ul> + {% endif %} </div> - <div class="js-search-results search-results-wrap"></div> </div> - <div class="main-content {% if page.url == '/' %}mt-2 mt-md-10{% endif %}"> + <div class="main-content"> {% unless page.url == "/" %} - <nav class="breadcrumb-nav"> - <ol class="breadcrumb-nav-list"> - <li class="breadcrumb-nav-list-item"><a href="{{ site.url }}">Home</a></li> - {% if page.parent != nil and page.parent != page.title %} - <li class="breadcrumb-nav-list-item"><a href="{{ site.url }}/{{ page.parent | slugify }}">{{ page.parent }}</a></li> - {% endif %} - <li class="breadcrumb-nav-list-item"><span>{{ page.title }}</span></li> - </ol> - </nav> + {% if page.parent != nil and page.parent != page.title %} + <nav class="breadcrumb-nav"> + <ol class="breadcrumb-nav-list"> + <li class="breadcrumb-nav-list-item"><a href="{{ site.url }}/{{ page.parent | slugify }}">{{ page.parent }}</a></li> + <li class="breadcrumb-nav-list-item"><span>{{ page.title }}</span></li> + </ol> + </nav> + {% endif %} {% endunless %} <div class="page-content"> {{ content }} diff --git a/_sass/layout.scss b/_sass/layout.scss index 8c07ea0d8250b0f105a090a0579accb98ea8e6dc..3124b66bcfe8473503ffd4b9e55e39bb419c778f 100644 --- a/_sass/layout.scss +++ b/_sass/layout.scss @@ -53,8 +53,7 @@ } } -.main-content, -.search { +.main-content { padding-top: $gutter-spacing-sm; @include container; @@ -73,6 +72,17 @@ } } +.page-header { + border-bottom: $border $border-color; + + @include mq(md) { + .main-content { + display: flex; + justify-content: space-between; + } + } +} + .navigation, .site-title { diff --git a/_sass/navigation.scss b/_sass/navigation.scss index 8a16e9c3b3bfb4bfe68a9daeac81f8b9223aabcb..9e76e5a048b55d90b09d35a3ebe09dc5316b54f1 100644 --- a/_sass/navigation.scss +++ b/_sass/navigation.scss @@ -105,13 +105,8 @@ .breadcrumb-nav-list { padding-left: 0; - margin-top: $sp-3; margin-bottom: $sp-3; list-style: none; - - @include mq(md) { - margin-bottom: $sp-5; - } } .breadcrumb-nav-list-item { diff --git a/_sass/search.scss b/_sass/search.scss index df3c3ff5f3f5ff97454ca38b723f18d954dca60b..f57e5be64326e2b1336029c1c9ce9d82b66e0d46 100644 --- a/_sass/search.scss +++ b/_sass/search.scss @@ -8,10 +8,9 @@ @include mq(md) { position: relative; z-index: 99; - display: flex; - justify-content: flex-end; - padding-top: 0; - padding-bottom: 0; + display: block; + padding-top: $sp-1; + padding-bottom: $gutter-spacing / 2; } } @@ -20,22 +19,17 @@ &.active { position: absolute; - top: $sp-10; - right: $gutter-spacing; + top: $sp-1; z-index: 100; display: block; width: 300px; - margin-top: $sp-2; + margin-top: $gutter-spacing; background: $white; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.07), 0 4px 14px rgba(0, 0, 0, 0.05); } } .search-input-wrap { - position: absolute; - top: $sp-7; - right: $gutter-spacing; - z-index: 99; display: flex; background-color: $white; } @@ -46,14 +40,13 @@ padding-bottom: $sp-1; border-top: 0; border-right: 0; - border-bottom: $border $border-color; + border-bottom: 0; border-left: 0; order: 2; &:focus { - border-bottom: $border $grey-lt-300; outline: 0; - box-shadow: 0; + box-shadow: none; + .search-icon { fill: $purple-000; @@ -70,6 +63,7 @@ .search-results-list { padding-left: 0; + margin-top: $sp-1; margin-bottom: $sp-1; list-style: none; @include fs-3; diff --git a/assets/js/just-the-docs.js b/assets/js/just-the-docs.js index 20033abadb6833896f40b82181edc4efe6f13a6a..ec68f915448c6e529cb95343d97cbb51a5eb25d4 100644 --- a/assets/js/just-the-docs.js +++ b/assets/js/just-the-docs.js @@ -30,7 +30,7 @@ function toggleNav(){ function initSearch() { var index = lunr(function () { this.ref('id'); - this.field('title', { boost: 20 }); + this.field('title'); this.field('content'); this.field('url'); }); diff --git a/docs/ui-components/buttons.md b/docs/ui-components/buttons.md index 1184af2eb83213afeeb350e04db036c0064cbfc4..849071df4e68822b1f257867edea023149657b80 100644 --- a/docs/ui-components/buttons.md +++ b/docs/ui-components/buttons.md @@ -62,7 +62,8 @@ GitHub flavored markdown does not support the `button` element, so you'll have t ### Button size -Wrap the button in container that uses the [font-size utility classes]({{ site.baseurl }}{% link docs/utilities/utilities.md %}#typography) to scale buttons: +Wrap the button in container that uses the [font-size utility classes]({{ +site.baseurl }}{% link docs/utilities/typography.md %}) to scale buttons: <div class="code-example" markdown="1"> diff --git a/index.md b/index.md index 36cd3f58ecd61aaa90a45a473ab6832617471788..bb0c2298705d6ea717805b1cb421abdc01e4f131 100644 --- a/index.md +++ b/index.md @@ -5,20 +5,13 @@ nav_order: 1 --- -# Focus on writing your docs, instead of building a website for them. +# Focus on writing good documentation {: .fs-9 .mb-md-8 :} -<div class="d-sm-flex my-sm-7"> - <div class="px-10 pl-sm-0 pr-sm-7 mb-5 mb-sm-0"> - <img src="/assets/images/just-the-docs.png" alt="" class="mt-sm-2"> - </div> - <div markdown="1"> - 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 } - - [Get started now](#getting-started){: .btn .btn-purple .mr-2 } [View it on GitHub](https://github.com/pmarsceill/just-the-docs){: .btn } - </div> -</div> +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 } + +[Get started now](#getting-started){: .btn .btn-purple .mr-2 } [View it on GitHub](https://github.com/pmarsceill/just-the-docs){: .btn } --- diff --git a/just-the-docs.gemspec b/just-the-docs.gemspec index 74e0668b25ec4449ac3dc62676d79bdf8b1e1ba5..6c8b3be717c968e77682ad2990ca6d843baa30e5 100644 --- a/just-the-docs.gemspec +++ b/just-the-docs.gemspec @@ -10,7 +10,7 @@ Gem::Specification.new do |spec| spec.homepage = "https://github.com/pmarsceill/just-the-docs" spec.license = "MIT" - spec.files = `git ls-files -z`.split("\x0").select { |f| f.match(%r{^(assets|_layouts|_includes|_sass|LICENSE|README|search-data.json)}i) } + spec.files = `git ls-files -z`.split("\x0").select { |f| f.match(%r{^(assets|bin|lib|_layouts|_includes|_sass|LICENSE|README)}i) } spec.add_runtime_dependency "jekyll", "~> 3.3" diff --git a/search-data.json b/search-data.json index 93e3e320dcc07656789d0b2dc1588501075d5dd2..4a71e7c0943b7cf2add39949507029065774b8ae 100644 --- a/search-data.json +++ b/search-data.json @@ -2,9 +2,10 @@ --- { {% 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 }}" - }{% unless forloop.last %},{% endunless %}{% endfor %} + "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 %} }