Compare commits

...

26 Commits

Author SHA1 Message Date
Matt Wang
e92afffb9c 0.8.2 2024-04-01 11:26:23 -07:00
Matt Wang
e434f916ce Prep 0.8.2 2024-04-01 11:25:25 -07:00
Peter Mosses
328893dd30 Fix: Protect theme JS file from front matter default for layout (#1447)
Fix #1445

Front matter defaults with unrestricted `scope` (`path: ""`) can affect theme code files. [Jekyll](https://jekyllrb.com/docs/front-matter/#predefined-global-variables) supports using `null` to "produce a file without using a layout file".

This PR adds `layout: null` to `just-the-docs.js`, to avoid this file being affected by the following front matter defaults:

```yaml
defaults:
  -
    scope:
      path: ""
    values:
      layout: "default"
```
2024-04-01 19:59:07 +02:00
Matt Wang
7de5f7abe5 0.8.1 2024-03-06 14:53:10 -08:00
Matt Wang
930a0e0c36 Prep 0.8.1 2024-03-06 14:50:44 -08:00
Jos Ahrens
880f4dc8b0 Build docs site using strict mode and strict_filters (#1435)
Ref: https://github.com/just-the-docs/just-the-docs/pull/1434#issuecomment-1981666074
2024-03-06 14:48:00 -08:00
Jos Ahrens
15a0b6e91b Fix Liquid filter typo in breadcrumb component (strip instead of trim) (#1434)
We are running into an issue upgrading from 0.7 to 0.8, suggesting that `trim` is not a method.

```
1.963   Liquid Exception: Liquid error (/usr/gem/gems/just-the-docs-0.8.0/_includes/components/breadcrumbs.html line 59): undefined filter trim included in /_layouts/default.html
1.968 /usr/gem/gems/liquid-4.0.4/lib/liquid/strainer.rb:58:in `invoke': Liquid error (/usr/gem/gems/just-the-docs-0.8.0/_includes/components/breadcrumbs.html line 59): undefined filter trim included  (Liquid::UndefinedFilter)
```
Looking at the liquid docs, we're probably looking for `strip` and not `trim`

https://shopify.github.io/liquid/filters/strip/

https://github.com/Shopify/liquid/blob/main/History.md#300--2014-11-12, I don't see a trim so it may have been an extension? This does work normally on just-the-docs itself running from scratch, so it might also be a bug in our application (or combination of different versions in plugins).
2024-03-06 14:39:45 -08:00
Matthew Wang
5357ffad22 0.8.0 2024-02-22 22:07:18 -08:00
Matthew Wang
6fc71c108b Prep 0.8.0 2024-02-22 22:05:07 -08:00
Peter Mosses
820d256bcd Quicker build (#1397)
This PR uses the cached site-nav to determine the position of each page in the navigation hierarchy. [Profiling](https://just-the-docs.github.io/just-the-docs-tests/tests/profiles/index/) shows that it significantly reduces the v0.7.0 build time for larger sites – especially with Jekyll 3. The improvement is due mainly to the elimination of loops and filters that depended on the entire site. 

For example:

- [endoflife.date](https://just-the-docs.github.io/just-the-docs-tests/tests/profiles/endoflife.date/index/) drops from 32s to 11s
- [machinetranslate.org](https://just-the-docs.github.io/just-the-docs-tests/tests/profiles/machinetranslate.org/index/) drops from 267s to ~~73s~~ 56s

### Testing

[Just the Docs Tests](https://just-the-docs.github.io/just-the-docs-tests/) is currently built using this PR branch. With JS disabled, the highlighting and unfolding of the navigation panel should be as with v0.7.0.

A diff of the tests site built with this PR branch compared to v0.7.0 should report no significant changes. For more rigorous testing, diffs of variants of the tests site should also be inspected.
2024-02-22 21:56:52 -08:00
dependabot[bot]
b8f6f2b75c Bump prettier from 3.2.2 to 3.2.5 (#1424)
Bumps [prettier](https://github.com/prettier/prettier) from 3.2.2 to 3.2.5.
- [Release notes](https://github.com/prettier/prettier/releases)
- [Changelog](https://github.com/prettier/prettier/blob/main/CHANGELOG.md)
- [Commits](https://github.com/prettier/prettier/compare/3.2.2...3.2.5)

---
updated-dependencies:
- dependency-name: prettier
  dependency-type: direct:development
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2024-02-21 16:00:19 -08:00
Roman KC
01719a8752 Add configurable keyboard shortcut to focus search input (#1411)
Adds a keyboard shortcut to use Ctrl/Cmd and a configurable key to focus the search input. The key is configurable with `search.focus_shortcut_key`; enables it on the core docs site with `'k'` (default on many sites).

---------
Co-authored-by: Matt Wang <mxw@cs.washington.edu>
2024-02-21 20:43:45 +00:00
dependabot[bot]
52b4b444d0 Bump nokogiri from 1.15.4 to 1.16.2 (#1425)
Bumps [nokogiri](https://github.com/sparklemotion/nokogiri) from 1.15.4 to 1.16.2.
- [Release notes](https://github.com/sparklemotion/nokogiri/releases)
- [Changelog](https://github.com/sparklemotion/nokogiri/blob/main/CHANGELOG.md)
- [Commits](https://github.com/sparklemotion/nokogiri/compare/v1.15.4...v1.16.2)

---
updated-dependencies:
- dependency-name: nokogiri
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2024-02-07 02:21:58 -08:00
Peter Mosses
742281635f Fix navigation when .html omitted (#1374)
* Prefer exact match of pathname
* Update CHANGELOG.md
2024-01-25 18:02:39 +01:00
dependabot[bot]
e96bf6ae3d Bump prettier from 3.1.1 to 3.2.2 (#1415)
Bumps [prettier](https://github.com/prettier/prettier) from 3.1.1 to 3.2.2.
- [Release notes](https://github.com/prettier/prettier/releases)
- [Changelog](https://github.com/prettier/prettier/blob/main/CHANGELOG.md)
- [Commits](https://github.com/prettier/prettier/compare/3.1.1...3.2.2)

---
updated-dependencies:
- dependency-name: prettier
  dependency-type: direct:development
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2024-01-15 14:05:09 -08:00
Matt Wang
da38718d7a Fix incorrect positioning of clickable area for navigation links on Safari (#1403)
Closes #1392.

Unfortunately, this PR has not actually diagnosed the root problem with the `scrollBy` calculation/method and Safari. However, by using the [`scrollIntoView`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView) function (which essentially does what the calculation was meant to do), this problem is "magically" solved! As a side effect, I think this makes the code easier to maintain (I myself was thinking: why is there a magic `3` multiplier?). 

~~I will point out that this does change *how much is scrolled*; following the spec for the method, the sidebar is now scrolled so that the active navigation link is top-aligned with the scroll container (which in this case, is the navigation sidebar's "cutoff"). I personally am fine with this change, but happy to fiddle around (e.g. we could vertically align to the `center` via [`scrollIntoViewOptions`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView#parameters), though I'm not sure if this causes compatability problems).~~

I will point out that this does change *how much is scrolled*; we are now using the `center` option to `scrollBy`, which centers the target link. As Peter has commented in the PR thread, this seems to be the best compromise for maintaining the spirit of the previous calculation.

### testing

Peter did a great job writing a reproducible bug report in #1392. To test this, 

1. first, follow the instructions verbatim on `main`. observe that the bug appears on Safari on macOS, but not Firefox and Chrome
2. then, apply this change (e.g. check out the branch)
3. next, replay the instructions - observing that
    1. the bug is fixed on Safari
    2. there is no change to the behaviour on Firefox and Chrome (other than the "start" of the scroll")

### compatability

On [Can I use](https://caniuse.com/scrollintoview), `scrollIntoView` has 98.15% adoption (the only "major" holdout being Opera Mini); and, the partial support from IE is about an option that we don't use. So, I'm pretty confident that we should be able to roll out this change without our users being locked out by a new-ish method.
2024-01-01 14:19:24 -08:00
dependabot[bot]
0352428017 Bump jekyll-github-metadata from 2.16.0 to 2.16.1 (#1407)
Bumps [jekyll-github-metadata](https://github.com/jekyll/github-metadata) from 2.16.0 to 2.16.1.
- [Release notes](https://github.com/jekyll/github-metadata/releases)
- [Changelog](https://github.com/jekyll/github-metadata/blob/main/History.markdown)
- [Commits](https://github.com/jekyll/github-metadata/compare/v2.16.0...v2.16.1)

---
updated-dependencies:
- dependency-name: jekyll-github-metadata
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2023-12-29 15:09:56 -08:00
dependabot[bot]
69583cb94c Bump jekyll from 4.3.2 to 4.3.3 (#1406)
Bumps [jekyll](https://github.com/jekyll/jekyll) from 4.3.2 to 4.3.3.
- [Release notes](https://github.com/jekyll/jekyll/releases)
- [Changelog](https://github.com/jekyll/jekyll/blob/master/History.markdown)
- [Commits](https://github.com/jekyll/jekyll/compare/v4.3.2...v4.3.3)

---
updated-dependencies:
- dependency-name: jekyll
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2023-12-28 14:24:01 -08:00
Matthew
b12ed38e7b Update CHANGELOG 2023-12-18 10:00:50 -08:00
Mitch Nemirovsky
8f0bcd6875 Add documentation to "Navigation Structure" on collections and grouping pages (#1390)
Added link and short blurb about document collections to the navigation structure page, for quicker reference and suggestion during reading documentation.

Allows easier reference when trying to create page groups / categories without using a blank Parent page. Avoids automatically folded Parent page when Child pages are the necessary ones.
2023-12-18 09:58:09 -08:00
dependabot[bot]
d8a23a0b26 Bump prettier from 3.1.0 to 3.1.1 (#1402)
Bumps [prettier](https://github.com/prettier/prettier) from 3.1.0 to 3.1.1.
- [Release notes](https://github.com/prettier/prettier/releases)
- [Changelog](https://github.com/prettier/prettier/blob/main/CHANGELOG.md)
- [Commits](https://github.com/prettier/prettier/compare/3.1.0...3.1.1)

---
updated-dependencies:
- dependency-name: prettier
  dependency-type: direct:development
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2023-12-12 23:03:43 -08:00
Matt Wang
fd689b47e0 docs: fix misleading docs on code with line numbers (#1349)
Closes #1306.

Co-authored-by: Peter Mosses <18308236+pdmosses@users.noreply.github.com>
2023-11-15 11:45:14 -08:00
dependabot[bot]
4e7f8345b4 Bump prettier from 3.0.3 to 3.1.0 (#1393)
Bumps [prettier](https://github.com/prettier/prettier) from 3.0.3 to 3.1.0.
- [Release notes](https://github.com/prettier/prettier/releases)
- [Changelog](https://github.com/prettier/prettier/blob/main/CHANGELOG.md)
- [Commits](https://github.com/prettier/prettier/compare/3.0.3...3.1.0)

---
updated-dependencies:
- dependency-name: prettier
  dependency-type: direct:development
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2023-11-13 10:23:11 -08:00
dependabot[bot]
a9a336f1b0 Bump stylelint-config-standard-scss from 11.0.0 to 11.1.0 (#1386)
Bumps [stylelint-config-standard-scss](https://github.com/stylelint-scss/stylelint-config-standard-scss) from 11.0.0 to 11.1.0.
- [Release notes](https://github.com/stylelint-scss/stylelint-config-standard-scss/releases)
- [Changelog](https://github.com/stylelint-scss/stylelint-config-standard-scss/blob/main/CHANGELOG.md)
- [Commits](https://github.com/stylelint-scss/stylelint-config-standard-scss/compare/v11.0.0...v11.1.0)

---
updated-dependencies:
- dependency-name: stylelint-config-standard-scss
  dependency-type: direct:development
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2023-11-03 16:00:56 -07:00
dependabot[bot]
1c27df3de6 Bump rake from 13.0.6 to 13.1.0 (#1385)
Bumps [rake](https://github.com/ruby/rake) from 13.0.6 to 13.1.0.
- [Release notes](https://github.com/ruby/rake/releases)
- [Changelog](https://github.com/ruby/rake/blob/master/History.rdoc)
- [Commits](https://github.com/ruby/rake/compare/v13.0.6...v13.1.0)

---
updated-dependencies:
- dependency-name: rake
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2023-11-01 22:41:07 -07:00
Matthew
870a6a4ff6 Fix Gemfile.lock post-release 2023-10-25 12:18:07 -07:00
16 changed files with 600 additions and 283 deletions

View File

@@ -19,6 +19,91 @@ Code changes to `main` that are *not* in the latest release:
- N/A
Docs changes made since the latest release:
- N/A
## Release v0.8.2
Hi everyone! This patch release fixes a bug where a default layout with unrestricted `scope` (`path: ""`) breaks JavaScript functionality. Users who do not use a default layout with unrestricted `scope` should not be affected. This should be a straightforward upgrade for all users. Thank you to [@pdmosses] for triaging and fixing the bug!
### Bugfixes
- Fixed: Protect theme JS file from front matter default for layout by [@pdmosses] in [#1447]
[#1447]: https://github.com/just-the-docs/just-the-docs/pull/1447
## Release v0.8.1
Hi folks! This patch release fixes a bug introduced in `0.8.0` that affects users who build their sites in strict mode. It is a straightforward upgrade that should require no manual migration changes. Thank you to [@Zarthus] for quickly catching and fixing this bug!
### Bugfixes
- Fixed: Liquid filter typo in breadcrumb component (`strip` instead of `trim`) by [@Zarthus] in [#1434]
### Documentation
- Build docs site using strict mode and `strict_filters` by [@Zarthus] in [#1435]
### New Contributors
- [@Zarthus] made their first contribution in [#1434]
[@Zarthus]: https://github.com/Zarthus
[#1434]: https://github.com/just-the-docs/just-the-docs/pull/1434
[#1435]: https://github.com/just-the-docs/just-the-docs/pull/1435
## Release v0.8.0
Hi folks! This first minor release of 2024 has a short number of changes: a large improvement of build times for large sites, a new keyboard shortcut to focus the search bar, and sidebar navigation bugfixes for "pretty" URLs (with `.html` omitted) and the clickable area on Safari. This release has no explicit breaking changes and should be a straightforward upgrade for most (if not all) users.
### Using Release `v0.8.0`
Users who have not pinned the theme version will be **automatically upgraded to `v0.8.0` the next time they build their site**.
To use this release explicitly as a remote theme:
```yml
remote_theme: just-the-docs/just-the-docs@v0.8.0
```
To use this version explicitly as a gem-based theme, pin the version in your `Gemfile` and re-run `bundle install` or `bundle update just-the-docs`:
```ruby
gem "just-the-docs", "0.8.0"
```
To use and pin a previous version of the theme, replace the `0.8.0` with the desired release tag.
### New Features
- Added: configurable keyboard shortcut to focus search input by [@kcromanpl-bajra] in [#1411]
### Bugfixes
- Fixed: quicker build by [@pdmosses] in [#1397]
- Fixed: incorrect navigation when `.html` omitted from URL by [@pdmosses] in [#1374]
- Fixed: incorrect positioning of clickable area for navigation links on Safari by [@mattxwang] in [#1403]
### Documentation
- Add documentation to "Navigation Structure" on grouping pages with collections by [@mitchnemirov] in [#1390]
### New Contributors
- [@mitchnemirov] made their first contribution in [#1390]
- [@kcromanpl-bajra] made their first contribution in [#1411]
[@mitchnemirov]: https://github.com/mitchnemirov
[@kcromanpl-bajra]: https://github.com/kcromanpl-bajra
[#1374]: https://github.com/just-the-docs/just-the-docs/pull/1374
[#1390]: https://github.com/just-the-docs/just-the-docs/pull/1390
[#1397]: https://github.com/just-the-docs/just-the-docs/pull/1397
[#1403]: https://github.com/just-the-docs/just-the-docs/pull/1403
[#1411]: https://github.com/just-the-docs/just-the-docs/pull/1411
## Release v0.7.0
Hi folks! This is a minor release that adds a new configuration option for opening external links in a new tab and provides many bugfixes (in both correctness and performance) for Just the Docs users with large sites. We anticipate that for most users, this is a straightforward upgrade. However, it introduces some potentially-breaking *internal* changes to undocumented features of the theme.

View File

@@ -1,7 +1,7 @@
PATH
remote: .
specs:
just-the-docs (0.6.2)
just-the-docs (0.8.2)
jekyll (>= 3.8.5)
jekyll-include-cache
jekyll-seo-tag (>= 2.0)
@@ -11,7 +11,7 @@ GEM
remote: https://rubygems.org/
specs:
Ascii85 (1.1.0)
addressable (2.8.4)
addressable (2.8.6)
public_suffix (>= 2.0.2, < 6.0)
afm (0.2.2)
async (2.6.3)
@@ -19,6 +19,7 @@ GEM
fiber-annotation
io-event (~> 1.1)
timers (~> 4.1)
base64 (0.2.0)
colorator (1.1.0)
concurrent-ruby (1.2.2)
console (1.23.2)
@@ -30,16 +31,17 @@ GEM
ethon (0.16.0)
ffi (>= 1.15.0)
eventmachine (1.2.7)
faraday (2.7.10)
faraday (2.8.1)
base64
faraday-net_http (>= 2.0, < 3.1)
ruby2_keywords (>= 0.0.4)
faraday-net_http (3.0.2)
ffi (1.15.5)
ffi (1.16.3)
fiber-annotation (0.2.0)
fiber-local (1.0.0)
forwardable-extended (2.6.0)
google-protobuf (3.23.4-arm64-darwin)
google-protobuf (3.23.4-x86_64-linux)
google-protobuf (3.25.1-arm64-darwin)
google-protobuf (3.25.1-x86_64-linux)
hashery (2.1.2)
html-proofer (5.0.8)
addressable (~> 2.3)
@@ -54,7 +56,7 @@ GEM
i18n (1.14.1)
concurrent-ruby (~> 1.0)
io-event (1.2.3)
jekyll (4.3.2)
jekyll (4.3.3)
addressable (~> 2.4)
colorator (~> 1.0)
em-websocket (~> 0.5)
@@ -70,7 +72,7 @@ GEM
safe_yaml (~> 1.0)
terminal-table (>= 1.8, < 4.0)
webrick (~> 1.7)
jekyll-github-metadata (2.16.0)
jekyll-github-metadata (2.16.1)
jekyll (>= 3.4, < 5.0)
octokit (>= 4, < 7, != 4.4.0)
jekyll-include-cache (0.2.1)
@@ -90,9 +92,9 @@ GEM
rb-fsevent (~> 0.10, >= 0.10.3)
rb-inotify (~> 0.9, >= 0.9.10)
mercenary (0.4.0)
nokogiri (1.15.4-arm64-darwin)
nokogiri (1.16.2-arm64-darwin)
racc (~> 1.4)
nokogiri (1.15.4-x86_64-linux)
nokogiri (1.16.2-x86_64-linux)
racc (~> 1.4)
octokit (6.1.1)
faraday (>= 1, < 3)
@@ -105,22 +107,22 @@ GEM
hashery (~> 2.0)
ruby-rc4
ttfunk
public_suffix (5.0.3)
racc (1.7.1)
public_suffix (5.0.4)
racc (1.7.3)
rainbow (3.1.1)
rake (13.0.6)
rake (13.1.0)
rb-fsevent (0.11.2)
rb-inotify (0.10.1)
ffi (~> 1.0)
rexml (3.2.6)
rouge (4.1.2)
rouge (4.2.0)
ruby-rc4 (0.1.5)
ruby2_keywords (0.0.5)
safe_yaml (1.0.5)
sass-embedded (1.64.1-arm64-darwin)
google-protobuf (~> 3.23)
sass-embedded (1.64.1-x86_64-linux-gnu)
google-protobuf (~> 3.23)
sass-embedded (1.69.6-arm64-darwin)
google-protobuf (~> 3.25)
sass-embedded (1.69.6-x86_64-linux-gnu)
google-protobuf (~> 3.25)
sawyer (0.9.2)
addressable (>= 2.3.5)
faraday (>= 0.17.3, < 3)
@@ -130,7 +132,7 @@ GEM
ttfunk (1.7.0)
typhoeus (1.4.0)
ethon (>= 0.9.0)
unicode-display_width (2.4.2)
unicode-display_width (2.5.0)
webrick (1.8.1)
yell (2.2.2)
zeitwerk (2.6.11)

View File

@@ -78,6 +78,8 @@ search:
# Enable or disable the search button that appears in the bottom right corner of every page
# Supports true or false (default)
button: false
# Focus the search input by pressing `ctrl + focus_shortcut_key` (or `cmd + focus_shortcut_key` on macOS)
focus_shortcut_key: 'k'
# For copy button on code
enable_copy_code_button: true
@@ -116,6 +118,10 @@ nav_external_links:
- title: Just the Docs on GitHub
url: https://github.com/just-the-docs/just-the-docs
liquid:
error_mode: strict
strict_filters: true
# Footer content
# appears at the bottom of every page's main content

View File

@@ -8,8 +8,91 @@
{%- if page.url != "/" and page.parent -%}
{%- assign pages_list = site[page.collection] | default: site.html_pages -%}
{%- capture nav_list_link -%}
<a href="{{ page.url | relative_url }}" class="nav-list-link">
{%- endcapture -%}
{%- capture site_nav -%}
{%- include_cached components/site_nav.html -%}
{%- endcapture -%}
{%- if site_nav contains nav_list_link -%}
{%- capture nav_list_simple -%}
<ul class="nav-list">
{%- endcapture -%}
{%- capture nav_list_link_class %} class="nav-list-link">
{%- endcapture -%}
{%- capture nav_category -%}
<div class="nav-category">
{%- endcapture -%}
{%- assign nav_anchor_splits =
site_nav | split: nav_list_link |
first | split: nav_category |
last | split: "</a>" -%}
{%- comment -%}
The ordinary pages (if any) and the collections pages (if any) are separated by
occurrences of nav_category.
Any ancestor nav-links of the page are contained in the last group of pages,
immediately preceding nav-lists. After splitting at "</a>", the anchor that
was split is a potential ancestor link when the following split starts with
a nav-list.
The array nav_breadcrumbs is the stack of current potential ancestors of the
current page. A split that contains one or more "</ul>"s requires that number
of potential ancestors to be popped from the stack.
The number of occurrences of a string in nav_split_next is computed by removing
them all, then dividing the resulting size difference by the length of the string.
{%- endcomment %}
{%- assign nav_breadcrumbs = "" | split: "" -%}
{%- for nav_split in nav_anchor_splits -%}
{%- unless forloop.last -%}
{%- assign nav_split_next = nav_anchor_splits[forloop.index] | strip -%}
{%- assign nav_split_test =
nav_split_next | remove_first: nav_list_simple | prepend: nav_list_simple -%}
{%- if nav_split_test == nav_split_next -%}
{%- assign nav_breadcrumb_link =
nav_split | split: "<a " | last | prepend: "<a " |
replace: nav_list_link_class, ">" | append: "</a>" -%}
{%- assign nav_breadcrumbs = nav_breadcrumbs | push: nav_breadcrumb_link -%}
{%- endif -%}
{%- if nav_split_next contains "</ul>" -%}
{%- assign nav_list_end_less = nav_split_next | remove: "</ul>" -%}
{%- assign nav_list_end_count =
nav_split_next.size | minus: nav_list_end_less.size | divided_by: 5 -%}
{% for nav_end_index in (1..nav_list_end_count) %}
{%- assign nav_breadcrumbs = nav_breadcrumbs | pop -%}
{%- endfor -%}
{%- endif -%}
{%- endunless -%}
{%- endfor -%}
{%- assign nav_parent_link = nav_breadcrumbs[-1] -%}
{%- assign nav_grandparent_link = nav_breadcrumbs[-2] -%}
{%- else -%}
{%- comment -%}
Pages whose links are excluded from the main navigation may still have
breadcrumbs. Determining them appears to require inspecting the front matter
of all the pages in the same group. For sites with 100s of pages, this is too
inefficient in Jekyll 3 (also when the for-loop is replaced by where-filters).
{%- endcomment -%}
{%- assign pages_list = site[page.collection] | default: site.html_pages -%}
{%- assign parent_page = nil -%}
{%- assign grandparent_page = nil -%}
@@ -35,15 +118,25 @@
{%- endif -%}
{%- endfor -%}
{%- capture nav_parent_link -%}
<a href="{{ parent_page.url | relative_url }}">{{ page.parent }}</a>
{%- endcapture -%}
{%- if page.grand_parent %}
{%- capture nav_grandparent_link -%}
<a href="{{ grandparent_page.url | relative_url }}">{{ page.grand_parent }}</a>
{%- endcapture -%}
{%- endif -%}
{%- endif -%}
<nav aria-label="Breadcrumb" class="breadcrumb-nav">
<ol class="breadcrumb-nav-list">
{% if page.parent -%}
{%- if page.grand_parent %}
<li class="breadcrumb-nav-list-item"><a href="{{ grandparent_page.url | relative_url }}">{{ page.grand_parent }}</a></li>
{%- if nav_grandparent_link %}
<li class="breadcrumb-nav-list-item">{{ nav_grandparent_link }}</li>
{%- endif %}
<li class="breadcrumb-nav-list-item"><a href="{{ parent_page.url | relative_url }}">{{ page.parent }}</a></li>
{% endif -%}
<li class="breadcrumb-nav-list-item">{{ nav_parent_link }}</li>
<li class="breadcrumb-nav-list-item"><span>{{ page.title }}</span></li>
</ol>
</nav>

View File

@@ -1,19 +1,17 @@
{%- comment -%}
Include as: {%- include css/activation.scss.liquid -%}
Depends on: page, site.
Results in: page-dependent (non-nested) CSS rules for inclusion in a head style element,
which needs to be suppressed when JS is enabled.
Includes:
sorted_pages.html.
Depends on: page.
Results in: page-dependent CSS rules for inclusion in a style element,
which needs to be disabled when JS is enabled.
Includes: components/site_nav.html.
Overwrites:
activation_no_nav_link, activation_pages, activation_pages_top_size, activation_page, activation_title,
activation_first_level, activation_second_level, activation_third_level,
activation_first_level_reversed, activation_second_level_reversed,
activation_first_level_index, activation_second_level_index, activation_third_level_index,
activation_index, activation_collection_prefix, activation_other_collection_prefix.
activation_no_nav_link, nav_list_link, site_nav,
nav_list, nav_list_end, nav_list_item, nav_category_list,
nav_list_link_prefix, nav_splits, nav_split, nav_levels,
nav_list_less, nav_list_count, nav_end_less, nav_end_count,
nav_index, nav_slice_size,
activation_collection_prefix, activation_other_collection_prefix.
Should not be cached, because it depends on page.
(For a site with only top-level pages, the rendering of this file is always empty.
This property could be detected, and used to reduce the build time for such sites.)
{%- endcomment -%}
{%- comment -%}
@@ -37,89 +35,163 @@
{%- endif %}
{% endcapture -%}
{%- if page.title == nil or page.nav_exclude == true -%}
{%- capture nav_list_link -%}
<a href="{{ page.url | relative_url }}" class="nav-list-link">
{%- endcapture -%}
{{ activation_no_nav_link }}
{%- capture site_nav -%}
{%- include_cached components/site_nav.html -%}
{%- endcapture -%}
{%- else -%}
{%- if site_nav contains nav_list_link -%}
{%- assign activation_pages = site[page.collection]
| default: site.html_pages
| where_exp: "item", "item.title != nil"
| where_exp: "item", "item.nav_exclude != true" -%}
{%- capture nav_list -%}
<ul class="nav-list
{%- endcapture -%}
{%- assign activation_first_level_index = nil -%}
{%- assign activation_second_level_index = nil -%}
{%- assign activation_third_level_index = nil -%}
{%- assign activation_first_level_reversed = nil -%}
{%- assign activation_second_level_reversed = nil -%}
{%- assign nav_list_end = "</ul>" -%}
{%- capture nav_list_item -%}
<li class="nav-list-item
{%- endcapture -%}
{%- capture nav_category_list -%}
<ul class="nav-list nav-category-list">
{%- endcapture -%}
{%- assign nav_list_link_prefix =
site_nav | split: nav_list_link | first | append: nav_list_link -%}
{%- assign nav_splits =
nav_list_link_prefix | split: nav_list_item | pop -%}
{%- assign nav_levels = "" | split: "" | push: 1 -%}
{%- comment -%}
The pattern of occurrences of list and list-item tags in the site_nav string
is included in the language defined by the following context-free grammar:
site_nav = PAGES? EXTERNALS? COLLECTION*
PAGES = nav_list (nav_list_item PAGES?)+ nav_list_end
EXTERNALS = nav_list nav_list_item+ nav_list_end
COLLECTION = nav_list (nav_list_item PAGES?)* nav_list_end
| nav_category_list
nav_list_item nav_list (nav_list_item PAGES?)* nav_list_end
nav_list_end
To determine the path in the site_nav to the nav_list_link for the current page,
the prefix of nav_list_link in site_nav is split at each nav_list_item to give
an array of nav_splits.
In site_nav, occurrences of nav_list must be separated by at least one
nav_list_item or nav_list_end. Moreover, when a nav_list_end is followed by a
nav_list without an intervening nav_list_item, that nav_list must start either
a list of external links or a collection. And when a nav_list is followed by a
nav_list_end without an intervening nav_list_item, they form an empty collection.
nav_levels is the path determined by the previously inspected nav_splits.
How many times nav_list and nav_list_end occur in the current nav_split
determines how to update the path.
A nav_split can contain any number of empty non-foldable collections.
The path element produced by the outer nav_list of a foldable collection is
irrelevant; it is set to zero and subsequently removed.
The number of occurrences of a string in a nav_split is computed by removing
them all, then dividing the resulting size difference by the length of the string.
Case analysis on (nav_list_count, nav_list_end_count):
- when (0, 0), the nav_split was between two nav_list_items at the same level;
- when (0, N+1), all the nav_list_ends in the nav_split are in PAGES or in one
COLLECTION;
- when (M+1, 0), M must be 0 (because two nav_lists in the same nav_split must
be separated by at least one nav_list_end);
- when (M+1, N+1), the nav_split must contain either:
- the end of PAGES followed by the start of EXTERNALS, or
- the end of PAGES followed by the start of a COLLECTION, or
- the end of EXTERNALS followed by the start of a COLLECTION, or
- the end of one COLLECTION followed by the start of another, or
- (in the first nav_split) one or more empty non-foldable COLLECTIONS
followed by the start of a COLLECTION.
In general, nav_levels[0] here needs to be incremented by nav_list_count.
However, a nav_split that contains the end of an empty foldable collection
followed by the just the start of a collection has two occurrences of nav_list,
and the increment needs to be one less; similarly when the first nav_split
starts with an empty non-foldable collection.
{%- endcomment %}
{%- for nav_split in nav_splits -%}
{%- assign nav_list_less = nav_split | remove: nav_list -%}
{%- assign nav_list_count =
nav_split.size | minus: nav_list_less.size |
divided_by: nav_list.size -%}
{%- assign nav_list_end_less = nav_split | remove: nav_list_end -%}
{%- assign nav_list_end_count =
nav_split.size | minus: nav_list_end_less.size |
divided_by: nav_list_end.size -%}
{%- if nav_list_count == 0 and nav_list_end_count == 0 -%}
{%- assign nav_index = nav_levels[-1] | plus: 1 -%}
{%- assign nav_levels = nav_levels | pop | push: nav_index -%}
{%- elsif nav_list_count == 0 and nav_list_end_count >= 1 -%}
{%- assign nav_slice_size = nav_levels.size | minus: nav_list_end_count -%}
{%- assign nav_levels = nav_levels | slice: 0, nav_slice_size -%}
{%- assign nav_index = nav_levels[-1] | plus: 1 -%}
{%- assign nav_levels = nav_levels | pop | push: nav_index -%}
{%- elsif nav_list_count == 1 and nav_list_end_count == 0 -%}
{%- if nav_split contains nav_category_list -%}
{%- assign nav_levels = nav_levels | push: 0 -%}
{%- else -%}
{%- assign nav_levels = nav_levels | push: 1 -%}
{%- endif -%}
{%- elsif nav_list_count >= 1 and nav_list_end_count >= 1 -%}
{%- assign nav_index = nav_levels[0] | plus: nav_list_count -%}
{%- if nav_levels[-1] == 0 or forloop.first -%}
{%- assign nav_index = nav_index | minus: 1 -%}
{%- endif -%}
{%- assign nav_levels = nav_levels | slice: 0, 0 | push: nav_index -%}
{%- if nav_split contains nav_category_list -%}
{%- assign nav_levels = nav_levels | push: 0 -%}
{%- else -%}
{%- assign nav_levels = nav_levels | push: 1 -%}
{%- endif -%}
{%- endif -%}
{%- endfor -%}
{%- assign nav_levels = nav_levels | where_exp: "item", "item >= 1" -%}
{%- endif -%}
{%- comment -%}
The generated CSS depends on the position of the current page in each level in
the navigation.
{%- endcomment -%}
{%- assign activation_title = page.grand_parent | default: page.parent | default: page.title -%}
{%- assign activation_first_level = activation_pages
| where_exp: "item", "item.parent == nil" -%}
{%- include sorted_pages.html pages = activation_first_level -%}
{%- for activation_page in sorted_pages -%}
{%- if activation_page.title == activation_title -%}
{%- assign activation_first_level_index = forloop.index -%}
{%- assign activation_first_level_reversed = activation_page.child_nav_order -%}
{%- break -%}
{%- endif -%}
{%- endfor -%}
{%- if activation_first_level_index == nil -%}
{%- if nav_levels[1] == nil -%}
{{ activation_no_nav_link }}
{%- else -%}
{%- if page.grand_parent -%}
{%- assign activation_title = page.parent -%}
{%- assign activation_second_level = activation_pages
| where_exp: "item", "item.grand_parent == nil"
| where_exp: "item", "item.parent == page.grand_parent" -%}
{%- elsif page.parent -%}
{%- assign activation_title = page.title -%}
{%- assign activation_second_level = activation_pages
| where_exp: "item", "item.grand_parent == nil"
| where_exp: "item", "item.parent == page.parent" -%}
{%- endif -%}
{%- if page.parent -%}
{%- include sorted_pages.html pages = activation_second_level -%}
{%- for activation_page in sorted_pages -%}
{%- if activation_page.title == activation_title -%}
{%- assign activation_second_level_index = forloop.index -%}
{%- assign activation_second_level_reversed = activation_page.child_nav_order -%}
{%- if activation_first_level_reversed -%}
{%- assign activation_second_level_index = sorted_pages | size | plus: 1 | minus: activation_second_level_index -%}
{%- endif -%}
{%- break -%}
{%- endif -%}
{%- endfor -%}
{%- endif -%}
{%- if page.grand_parent -%}
{%- assign activation_third_level = activation_pages
| where_exp: "item", "item.parent == page.parent"
| where_exp: "item", "item.grand_parent == page.grand_parent" -%}
{%- include sorted_pages.html pages = activation_third_level -%}
{%- assign activation_third_level = sorted_pages -%}
{%- for activation_page in sorted_pages -%}
{%- if activation_page.title == page.title -%}
{%- assign activation_third_level_index = forloop.index -%}
{%- if activation_second_level_reversed -%}
{%- assign activation_third_level_index = sorted_pages | size | plus: 1 | minus: activation_third_level_index -%}
{%- endif -%}
{%- break -%}
{%- endif -%}
{%- endfor -%}
{%- endif -%}
{%- if activation_second_level_index == nil and activation_third_level_index -%}
{%- if nav_levels[2] == nil and nav_levels[3] -%}
{{ activation_no_nav_link }}
@@ -158,34 +230,14 @@
{%- else -%}
{%- for activation_collection in site.just_the_docs.collections -%}
{%- if activation_collection[0] == page.collection -%}
{%- assign activation_index = forloop.index -%}
{%- break -%}
{%- endif -%}
{%- endfor -%}
{%- assign activation_pages_top_size = site.html_pages
| where_exp:"item", "item.title != nil"
| where_exp:"item", "item.parent == nil"
| where_exp:"item", "item.nav_exclude != true"
| size -%}
{%- if activation_pages_top_size > 0 -%}
{%- assign activation_index = activation_index | plus: 1 -%}
{%- endif -%}
{%- if site.nav_external_links -%}
{%- assign activation_index = activation_index | plus: 1 -%}
{%- endif -%}
{%- capture activation_collection_prefix -%}
.site-nav > ul:nth-of-type({{ activation_index }})
.site-nav > ul:nth-of-type({{ nav_levels[0] }})
{%- if site.just_the_docs.collections[page.collection].nav_fold %} > li > ul
{%- endif -%}
{%- endcapture -%}
{%- capture activation_other_collection_prefix -%}
.site-nav > ul:not(:nth-of-type({{ activation_index }}))
.site-nav > ul:not(:nth-of-type({{ nav_levels[0] }}))
{%- endcapture -%}
{%- endif -%}
@@ -197,25 +249,25 @@
and children of the current page.
{%- endcomment %}
{% if activation_third_level_index -%}
{% if nav_levels[3] -%}
{{ activation_collection_prefix }} > li > a,
{{ activation_collection_prefix }} > li > ul > li > a,
{{ activation_collection_prefix }} > li > ul > li > ul > li:not(:nth-child({{ activation_third_level_index }})) > a {
{{ activation_collection_prefix }} > li > ul > li > ul > li:not(:nth-child({{ nav_levels[3] }})) > a {
background-image: none;
}
{%- elsif activation_second_level_index -%}
{%- elsif nav_levels[2] -%}
{{ activation_collection_prefix }} > li > a,
{{ activation_collection_prefix }} > li > ul > li:not(:nth-child({{ activation_second_level_index }})) > a,
{{ activation_collection_prefix }} > li > ul > li:not(:nth-child({{ nav_levels[2] }})) > a,
{{ activation_collection_prefix }} > li > ul > li > ul > li > a {
background-image: none;
}
{%- else -%}
{{ activation_collection_prefix }} > li:not(:nth-child({{ activation_first_level_index }})) > a,
{{ activation_collection_prefix }} > li:not(:nth-child({{ nav_levels[1] }})) > a,
{{ activation_collection_prefix }} > li > ul > li > a,
{{ activation_collection_prefix }} > li > ul > li > ul > li > a {
background-image: none;
@@ -236,9 +288,9 @@
The following rule styles the link to the current page.
{%- endcomment %}
{{ activation_collection_prefix }} > li:nth-child({{ activation_first_level_index }})
{%- if activation_second_level_index %} > ul > li:nth-child({{ activation_second_level_index }})
{%- if activation_third_level_index %} > ul > li:nth-child({{ activation_third_level_index }})
{{ activation_collection_prefix }} > li:nth-child({{ nav_levels[1] }})
{%- if nav_levels[2] %} > ul > li:nth-child({{ nav_levels[2] }})
{%- if nav_levels[3] %} > ul > li:nth-child({{ nav_levels[3] }})
{%- endif -%}
{%- endif %} > a {
font-weight: 600;
@@ -259,9 +311,9 @@
{%- if site.just_the_docs.collections %}
.site-nav > ul.nav-category-list > li > button svg,
{% endif -%}
{{ activation_collection_prefix }} > li:nth-child({{ activation_first_level_index }}) > button svg
{%- if activation_second_level_index -%},
{{ activation_collection_prefix }} > li:nth-child({{ activation_first_level_index }}) > ul > li:nth-child({{ activation_second_level_index }}) > button svg
{{ activation_collection_prefix }} > li:nth-child({{ nav_levels[1] }}) > button svg
{%- if nav_levels[2] -%},
{{ activation_collection_prefix }} > li:nth-child({{ nav_levels[1] }}) > ul > li:nth-child({{ nav_levels[2] }}) > button svg
{%- endif %} {
transform: rotate(-90deg);
}
@@ -269,13 +321,12 @@
{%- if site.just_the_docs.collections %}
.site-nav > ul.nav-category-list > li.nav-list-item > ul.nav-list,
{% endif -%}
{{ activation_collection_prefix }} > li.nav-list-item:nth-child({{ activation_first_level_index }}) > ul.nav-list
{%- if activation_second_level_index %},
{{ activation_collection_prefix }} > li.nav-list-item:nth-child({{ activation_first_level_index }}) > ul.nav-list > li.nav-list-item:nth-child({{ activation_second_level_index }}) > ul.nav-list
{{ activation_collection_prefix }} > li.nav-list-item:nth-child({{ nav_levels[1] }}) > ul.nav-list
{%- if nav_levels[2] %},
{{ activation_collection_prefix }} > li.nav-list-item:nth-child({{ nav_levels[1] }}) > ul.nav-list > li.nav-list-item:nth-child({{ nav_levels[2] }}) > ul.nav-list
{%- endif %} {
display: block;
}
{%- endif -%}
{%- endif -%}
{%- endif -%}

View File

@@ -1,29 +1,37 @@
{%- comment -%}
This file can be used to fix the HTML produced by Jekyll for highlighted
code with line numbers.
This file was previously used to "fix" the HTML produced by Jekyll for
highlighted code with line numbers. While it often resolves layout issues
from the missing HTML tags, it still generates invalid HTML (by placing
a `<table>` element within a `<code>` block). As such, we no longer
recommend using this workaround. For more information, see the
"Code snippets with line numbers" docs page:
https://just-the-docs.com/docs/ui-components/code/line-numbers/
(or, docs/ui-components/line-nos.md/)
It works with `{% highlight some_language linenos %}...{% endhighlight %}`
and with the Kramdown option to add line numbers to fenced code.
The next portion of this file, including the comments and the workaround,
are preserved for backwards comptability.
The implementation was derived from the workaround provided by
ACKNOWLEDGEMENTS
The implementation was derived from the workaround provided by
Dmitry Hrabrov (DeXP) at
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901
EXPLANATION
EXPLANATION (OLD)
The HTML produced by Rouge highlighting with lie numbers is of the form
`code table`. Jekyll (<= 4.1.1) always wraps the highlighted HTML
The HTML produced by Rouge highlighting with line numbers is of the form
`code table`. Jekyll always wraps the highlighted HTML
with `pre`. This wrapping is not only unnecessary, but also transforms
the conforming HTML produced by Rouge to non-conforming HTML, which
results in HTML validation error reports.
results in HTML validation error reports.
The fix removes the outer `pre` tags whenever they contain the pattern
`<table class="rouge-table">`.
Apart from avoiding HTML validation errors, the fix allows the use of
the [Jekyll layout for compressing HTML](http://jch.penibelst.de),
which relies on `pre` tags not being nested, according to
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-172069842
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-172069842
USAGE
@@ -48,7 +56,7 @@ Some code
CAVEATS
The above does not work when `Some code` happens to contain the matched string
The above does not work when `Some code` happens to contain the matched string
`<table class="rouge-table">`.
The use of this file overwrites the variable `fix_linenos_code` with `nil`.

View File

@@ -1,4 +1,5 @@
---
layout: null
---
(function (jtd, undefined) {
@@ -145,6 +146,18 @@ function searchLoaded(index, docs) {
var currentInput;
var currentSearchIndex = 0;
{%- if site.search.focus_shortcut_key %}
// add event listener on ctrl + <focus_shortcut_key> for showing the search input
jtd.addEvent(document, 'keydown', function (e) {
if ((e.ctrlKey || e.metaKey) && e.key === '{{ site.search.focus_shortcut_key }}') {
e.preventDefault();
mainHeader.classList.add('nav-open');
searchInput.focus();
}
});
{%- endif %}
function showSearch() {
document.documentElement.classList.add('search-active');
}
@@ -487,11 +500,28 @@ jtd.setTheme = function(theme) {
// and not have the slash on GitHub Pages
function navLink() {
var href = document.location.pathname;
if (href.endsWith('/') && href != '/') {
href = href.slice(0, -1);
var pathname = document.location.pathname;
var navLink = document.getElementById('site-nav').querySelector('a[href="' + pathname + '"]');
if (navLink) {
return navLink;
}
return document.getElementById('site-nav').querySelector('a[href="' + href + '"], a[href="' + href + '/"]');
// The `permalink` setting may produce navigation links whose `href` ends with `/` or `.html`.
// To find these links when `/` is omitted from or added to pathname, or `.html` is omitted:
if (pathname.endsWith('/') && pathname != '/') {
pathname = pathname.slice(0, -1);
}
if (pathname != '/') {
navLink = document.getElementById('site-nav').querySelector('a[href="' + pathname + '"], a[href="' + pathname + '/"], a[href="' + pathname + '.html"]');
if (navLink) {
return navLink;
}
}
return null; // avoids `undefined`
}
// Scroll site-nav to ensure the link to the current page is visible
@@ -499,8 +529,7 @@ function navLink() {
function scrollNav() {
const targetLink = navLink();
if (targetLink) {
const rect = targetLink.getBoundingClientRect();
document.getElementById('site-nav').scrollBy(0, rect.top - 3*rect.height);
targetLink.scrollIntoView({ block: "center" });
targetLink.removeAttribute('href');
}
}

View File

@@ -66,6 +66,8 @@ search:
# Enable or disable the search button that appears in the bottom right corner of every page
# Supports true or false (default)
button: false
# Focus the search input by pressing `ctrl + focus_shortcut_key` (or `cmd + focus_shortcut_key` on macOS)
focus_shortcut_key: 'k'
```
## Mermaid Diagrams

View File

@@ -237,6 +237,40 @@ Currently, the navigation structure is limited to 3 levels: grandchild pages can
---
## Grouping pages with collections
Pages can also be grouped together by using Jekyll's and Just the Docs's [collections]({% link docs/configuration.md %}#document-collections) feature. In contrast to using [pages with children](#pages-with-children), pages grouped by collection are grouped by a shared header (the name of the collection) instead of a page.
The `nav_fold` configuration option works for collection-grouped pages. For more information, please refer to the [collections documentation]({% link docs/configuration.md %}#document-collections).
### Example (grouping by collection)
{: .no_toc }
The following example sets up two collections, `collection-one` and `collection-two`:
- any document placed within `_collection-1/` will be grouped under the `Collection One` header by default. Since `nav_fold` is set to `true`, the pages will be folded by default.
- any document placed within `_collection-2/` will be grouped under the `Collection Two` header by default. Since `nav_fold` is set to `false`, the pages will be expanded by default.
```yaml
_config.yml:
collections:
collection-one:
permalink: "/:collection/:path/"
output: true
collection-two:
permalink: "/:collection/:path/"
output: true
just_the_docs:
collections:
collection-one:
name: Collection One
nav_fold: true
collection-two:
name: Collection Two
nav_fold: false
```
---
## Auxiliary Links
To add auxiliary links to your site (in the upper right on all pages), add it to the `aux_links` [configuration option]({% link docs/configuration.md %}#aux-links) in your site's `_config.yml` file.

View File

@@ -94,6 +94,21 @@ The search button displays in the bottom right corner of the screen and triggers
search.button: true
```
### Focus search bar with a keyboard shortcut
Just the Docs supports focusing the search bar input with a keyboard shortcut. After setting the `search.focus_shortcut_key` config item key, users who press <kbd>Ctrl</kbd> + `search.focus_shortcut_key` (or on macOS, <kbd>Command</kbd> + `search.focus_shortcut_key`) will focus the search bar.
Note that this feature is **disabled by default**. `search.focus_shortcut_key` should be a [valid value from `KeyboardEvent.key`](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key); this involves all ASCII alphanumeric values, as well as modifier keys.
For example,
```yaml
search:
focus_shortcut_key: 'k'
```
Will make <kbd>Ctrl</kbd> + <kbd>K</kbd> focus the search bar for Windows users (and <kbd>Command</kbd> + <kbd>K</kbd> on macOS).
## Hiding pages from search
Sometimes you might have a page that you don't want to be indexed for the search nor to show up in search results, e.g., a 404 page.

View File

@@ -58,6 +58,8 @@ var fun = function lang(l) {
```
{% endhighlight %}
Syntax highlighting, line numbers, and HTML compression do not work together; **the combination of these features generates invalid HTML that renders incorrectly**. To learn more, see ["Code with line numbers"]({% link docs/ui-components/line-nos.md %}).
---
## Code blocks with rendered examples

View File

@@ -8,8 +8,12 @@ permalink: /docs/ui-components/code/line-numbers/
# Code snippets with line numbers
{: .warning }
In prior versions of the docs, we provided "workarounds" to rendering issues arising from code snippets with line numbers. While these seemed to resolve visual layout issues, they did not resolve core issues with Jekyll generating invalid HTML. See [the detailed explanation](#detailed-error-explanation) for more information.
The default settings for HTML compression are incompatible with the HTML
produced by Jekyll (4.1.1 or earlier) for line numbers from highlighted code
produced by Jekyll for line numbers from highlighted code
-- both when using Kramdown code fences and when using Liquid highlight tags.
To avoid non-conforming HTML and unsatisfactory layout, HTML compression
@@ -40,90 +44,62 @@ Some code
{% endhighlight %}{% endraw %}
{% endhighlight %}
## Workarounds
## Detailed Error Explanation
To use HTML compression together with line numbers, all highlighted code
needs to be wrapped using one of the following workarounds.
(The variable name `some_var` can be changed to avoid clashes; it can also
be replaced by `code` -- but note that `code=code` cannot be removed).
Consider this following code snippet, intended to highlight a simple Ruby program:
### Code fences (three backticks)
{% highlight default %}
{% raw %}{% capture some_var %}
```some_language
Some code
```
{% endcapture %}
{% assign some_var = some_var | markdownify %}
{% include fix_linenos.html code=some_var %}{% endraw %}
{% endhighlight %}
### Liquid highlighting
{% highlight default %}
{% raw %}{% capture some_var %}
{% highlight some_language linenos %}
Some code
{% endhighlight %}
{% endcapture %}
{% include fix_linenos.html code=some_var %}{% endraw %}
{% endhighlight %}
_Credit:_ The original version of the above workaround was suggested by
Dmitry Hrabrov at
<https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901>.
## Examples
✅ Using code fences + workaround (will only show line numbers if enabled globally in `_config.yml`):
{% capture code_fence %}
```js
// Javascript code with syntax highlighting in fences
var fun = function lang(l) {
dateformat.i18n = require('./lang/' + l)
return true;
}
```
{% endcapture %}
{% assign code_fence = code_fence | markdownify %}
{% include fix_linenos.html code=code_fence %}
✅ Using liquid highlighting + workaround:
{% capture code %}
{% highlight ruby linenos %}
# Ruby code with syntax highlighting and fixed line numbers using Liquid
GitHubPages::Dependencies.gems.each do |gem, version|
s.add_dependency(gem, "= #{version}")
end
{% endhighlight %}
{% endcapture %}
{% include fix_linenos.html code=code %}
{% assign code = nil %}
Narrow code stays close to the line numbers:
{% capture code %}
{% highlight ruby linenos %}
{% raw %}{% highlight ruby linenos %}
def foo
puts 'foo'
end
{% endhighlight %}
{% endcapture %}
{% include fix_linenos.html code=code %}
{% assign code = nil %}
{% endhighlight %}{% endraw %}
```
{: .warning }
The following generates **incorrect** and **invalid** HTML. It should not be used as a positive example; the improper layout (with the broken HTML tags) is intentional.
If this is directly placed within a file processed by Jekyll (via Just the Docs, with HTML compression enabled), the following markup will be generated:
❌ With the compression options used for the theme docs, the following example illustrates
the **incorrect** formatting arising from the incompatibility of HTML compression
and the non-conforming HTML produced by Jekyll for line numbers:
```html
<figure class="highlight">><code class="language-ruby" data-lang="ruby"><div class="table-wrapper"><table class="rouge-table"><tbody><tr><td class="gutter gl"><pre class="lineno">1
2
3
</pre><td class="code"><pre><span class="k">def</span> <span class="nf">foo</span>
<span class="nb">puts</span> <span class="s1">'foo'</span>
<span class="k">end</span>
</pre></figure>
```
{% highlight ruby linenos %}
def foo
puts 'foo'
end
{% endhighlight %}
This HTML is invalid; in particular, there are two issues:
1. there are many missing closing tags, and a superfluous `>`, which produce visually garbled output
2. a `<table>` is placed within a `<code>` element, which is syntactically invalid HTML (but is often allowed by browsers)
To emphasize this first difference, here is the same markup output, indented by tag:
```html
<figure class="highlight">
>
<code class="language-ruby" data-lang="ruby">
<div class="table-wrapper">
<table class="rouge-table">
<tbody>
<tr>
<td class="gutter gl">
<pre class="lineno">
1
2
3
</pre>
<td class="code">
<pre>
<span class="k">def</span>
<span class="nf">foo</span>
<span class="nb">puts</span>
<span class="s1">'foo'</span>
<span class="k">end</span>
</pre>
</figure>
```
In order, there are missing `</td>`, `</td>`, `</tr>`, `</tbody>`, `</table>`, `</div>`, and `</code>` tags. As a result, the following elements of the page - including the site footer - become visually garbled as browsers attempt to recover gracefully.
Prior workarounds we suggested (such as [Dmitry Hrabrov's in `jekyll-compress-html`#71](https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901)) resolve the missing tag problem. However, they still place a `<table>` within a `<code>` element. The HTML spec normatively states that `<code>` elements should only contain "[phrasing content](https://html.spec.whatwg.org/multipage/dom.html#phrasing-content-2)", which does not include `<table>` ([spec ref](https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-code-element)). To avoid incorrectly rendered HTML, the previously-suggested workaround using the current version of `_includes/fix_linenos.html` should _not_ be used!

View File

@@ -1,3 +1 @@
root: _site
blacklist:
- "line-numbers"

View File

@@ -2,7 +2,7 @@
Gem::Specification.new do |spec|
spec.name = "just-the-docs"
spec.version = "0.7.0"
spec.version = "0.8.2"
spec.authors = ["Patrick Marsceill", "Matthew Wang"]
spec.email = ["patrick.marsceill@gmail.com", "matt@matthewwang.me"]

94
package-lock.json generated
View File

@@ -10,9 +10,9 @@
"license": "MIT",
"devDependencies": {
"npm-run-all": "^4.1.5",
"prettier": "^3.0.3",
"prettier": "^3.2.5",
"stylelint": "^15.11.0",
"stylelint-config-standard-scss": "^11.0.0"
"stylelint-config-standard-scss": "^11.1.0"
}
},
"node_modules/@babel/code-frame": {
@@ -2065,9 +2065,9 @@
}
},
"node_modules/postcss-scss": {
"version": "4.0.7",
"resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.7.tgz",
"integrity": "sha512-xPv2GseoyXPa58Nro7M73ZntttusuCmZdeOojUFR5PZDz2BR62vfYx1w9TyOnp1+nYFowgOMipsCBhxzVkAEPw==",
"version": "4.0.9",
"resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.9.tgz",
"integrity": "sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A==",
"dev": true,
"funding": [
{
@@ -2087,7 +2087,7 @@
"node": ">=12.0"
},
"peerDependencies": {
"postcss": "^8.4.19"
"postcss": "^8.4.29"
}
},
"node_modules/postcss-selector-parser": {
@@ -2110,9 +2110,9 @@
"dev": true
},
"node_modules/prettier": {
"version": "3.0.3",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.0.3.tgz",
"integrity": "sha512-L/4pUDMxcNa8R/EthV08Zt42WBO4h1rarVtK0K+QJG0X187OLo7l699jWw0GKuwzkPQ//jMFA/8Xm6Fh3J/DAg==",
"version": "3.2.5",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.2.5.tgz",
"integrity": "sha512-3/GWa9aOC0YeD7LUfvOG2NiDyhOWRvt1k+rcKhOuYnMY24iiCphgneUfJDyFXd6rZCAnuLBv6UeAULtrhT/F4A==",
"dev": true,
"bin": {
"prettier": "bin/prettier.cjs"
@@ -2673,14 +2673,14 @@
}
},
"node_modules/stylelint-config-recommended-scss": {
"version": "13.0.0",
"resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-13.0.0.tgz",
"integrity": "sha512-7AmMIsHTsuwUQm7I+DD5BGeIgCvqYZ4BpeYJJpb1cUXQwrJAKjA+GBotFZgUEGP8lAM+wmd91ovzOi8xfAyWEw==",
"version": "13.1.0",
"resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-13.1.0.tgz",
"integrity": "sha512-8L5nDfd+YH6AOoBGKmhH8pLWF1dpfY816JtGMePcBqqSsLU+Ysawx44fQSlMOJ2xTfI9yTGpup5JU77c17w1Ww==",
"dev": true,
"dependencies": {
"postcss-scss": "^4.0.7",
"postcss-scss": "^4.0.9",
"stylelint-config-recommended": "^13.0.0",
"stylelint-scss": "^5.1.0"
"stylelint-scss": "^5.3.0"
},
"peerDependencies": {
"postcss": "^8.3.3",
@@ -2708,12 +2708,12 @@
}
},
"node_modules/stylelint-config-standard-scss": {
"version": "11.0.0",
"resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-11.0.0.tgz",
"integrity": "sha512-fGE79NBOLg09a9afqGH/guJulRULCaQWWv4cv1v2bMX92B+fGb0y56WqIguwvFcliPmmUXiAhKrrnXilIeXoHA==",
"version": "11.1.0",
"resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-11.1.0.tgz",
"integrity": "sha512-5gnBgeNTgRVdchMwiFQPuBOtj9QefYtfXiddrOMJA2pI22zxt6ddI2s+e5Oh7/6QYl7QLJujGnaUR5YyGq72ow==",
"dev": true,
"dependencies": {
"stylelint-config-recommended-scss": "^13.0.0",
"stylelint-config-recommended-scss": "^13.1.0",
"stylelint-config-standard": "^34.0.0"
},
"peerDependencies": {
@@ -2727,11 +2727,12 @@
}
},
"node_modules/stylelint-scss": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-5.1.0.tgz",
"integrity": "sha512-E+KlQFXv1Euha43qw3q+wKBSli557wxbbo6/39DWhRNXlUa9Cz+FYrcgz+PT6ag0l6UisCYjAGCNhoSl4FcwlA==",
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-5.3.0.tgz",
"integrity": "sha512-Sc7S1uWqStMc99NREsHNxpxHHFRvjo2pWILNl/UCwWO8PxhODK8qbJH0GHWIALxl6BD5rwJL4cSm4jk36hi6fg==",
"dev": true,
"dependencies": {
"known-css-properties": "^0.28.0",
"postcss-media-query-parser": "^0.2.3",
"postcss-resolve-nested-selector": "^0.1.1",
"postcss-selector-parser": "^6.0.13",
@@ -2741,6 +2742,12 @@
"stylelint": "^14.5.1 || ^15.0.0"
}
},
"node_modules/stylelint-scss/node_modules/known-css-properties": {
"version": "0.28.0",
"resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.28.0.tgz",
"integrity": "sha512-9pSL5XB4J+ifHP0e0jmmC98OGC1nL8/JjS+fi6mnTlIf//yt/MfVLtKg7S6nCtj/8KTcWX7nRlY0XywoYY1ISQ==",
"dev": true
},
"node_modules/supports-color": {
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
@@ -4465,9 +4472,9 @@
"requires": {}
},
"postcss-scss": {
"version": "4.0.7",
"resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.7.tgz",
"integrity": "sha512-xPv2GseoyXPa58Nro7M73ZntttusuCmZdeOojUFR5PZDz2BR62vfYx1w9TyOnp1+nYFowgOMipsCBhxzVkAEPw==",
"version": "4.0.9",
"resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.9.tgz",
"integrity": "sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A==",
"dev": true,
"requires": {}
},
@@ -4488,9 +4495,9 @@
"dev": true
},
"prettier": {
"version": "3.0.3",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.0.3.tgz",
"integrity": "sha512-L/4pUDMxcNa8R/EthV08Zt42WBO4h1rarVtK0K+QJG0X187OLo7l699jWw0GKuwzkPQ//jMFA/8Xm6Fh3J/DAg==",
"version": "3.2.5",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.2.5.tgz",
"integrity": "sha512-3/GWa9aOC0YeD7LUfvOG2NiDyhOWRvt1k+rcKhOuYnMY24iiCphgneUfJDyFXd6rZCAnuLBv6UeAULtrhT/F4A==",
"dev": true
},
"punycode": {
@@ -4871,14 +4878,14 @@
"requires": {}
},
"stylelint-config-recommended-scss": {
"version": "13.0.0",
"resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-13.0.0.tgz",
"integrity": "sha512-7AmMIsHTsuwUQm7I+DD5BGeIgCvqYZ4BpeYJJpb1cUXQwrJAKjA+GBotFZgUEGP8lAM+wmd91ovzOi8xfAyWEw==",
"version": "13.1.0",
"resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-13.1.0.tgz",
"integrity": "sha512-8L5nDfd+YH6AOoBGKmhH8pLWF1dpfY816JtGMePcBqqSsLU+Ysawx44fQSlMOJ2xTfI9yTGpup5JU77c17w1Ww==",
"dev": true,
"requires": {
"postcss-scss": "^4.0.7",
"postcss-scss": "^4.0.9",
"stylelint-config-recommended": "^13.0.0",
"stylelint-scss": "^5.1.0"
"stylelint-scss": "^5.3.0"
}
},
"stylelint-config-standard": {
@@ -4891,25 +4898,34 @@
}
},
"stylelint-config-standard-scss": {
"version": "11.0.0",
"resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-11.0.0.tgz",
"integrity": "sha512-fGE79NBOLg09a9afqGH/guJulRULCaQWWv4cv1v2bMX92B+fGb0y56WqIguwvFcliPmmUXiAhKrrnXilIeXoHA==",
"version": "11.1.0",
"resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-11.1.0.tgz",
"integrity": "sha512-5gnBgeNTgRVdchMwiFQPuBOtj9QefYtfXiddrOMJA2pI22zxt6ddI2s+e5Oh7/6QYl7QLJujGnaUR5YyGq72ow==",
"dev": true,
"requires": {
"stylelint-config-recommended-scss": "^13.0.0",
"stylelint-config-recommended-scss": "^13.1.0",
"stylelint-config-standard": "^34.0.0"
}
},
"stylelint-scss": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-5.1.0.tgz",
"integrity": "sha512-E+KlQFXv1Euha43qw3q+wKBSli557wxbbo6/39DWhRNXlUa9Cz+FYrcgz+PT6ag0l6UisCYjAGCNhoSl4FcwlA==",
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-5.3.0.tgz",
"integrity": "sha512-Sc7S1uWqStMc99NREsHNxpxHHFRvjo2pWILNl/UCwWO8PxhODK8qbJH0GHWIALxl6BD5rwJL4cSm4jk36hi6fg==",
"dev": true,
"requires": {
"known-css-properties": "^0.28.0",
"postcss-media-query-parser": "^0.2.3",
"postcss-resolve-nested-selector": "^0.1.1",
"postcss-selector-parser": "^6.0.13",
"postcss-value-parser": "^4.2.0"
},
"dependencies": {
"known-css-properties": {
"version": "0.28.0",
"resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.28.0.tgz",
"integrity": "sha512-9pSL5XB4J+ifHP0e0jmmC98OGC1nL8/JjS+fi6mnTlIf//yt/MfVLtKg7S6nCtj/8KTcWX7nRlY0XywoYY1ISQ==",
"dev": true
}
}
},
"supports-color": {

View File

@@ -7,9 +7,9 @@
"bugs": "https://github.com/just-the-docs/just-the-docs/issues",
"devDependencies": {
"npm-run-all": "^4.1.5",
"prettier": "^3.0.3",
"prettier": "^3.2.5",
"stylelint": "^15.11.0",
"stylelint-config-standard-scss": "^11.0.0"
"stylelint-config-standard-scss": "^11.1.0"
},
"scripts": {
"lint": "npm-run-all --parallel --continue-on-error lint:*",