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

Combination (#578)

Browse Source 
This PR combines (and resolves conflicts between) #448, #463, #466, #494, #495, #496, #498, and #572. 

The main aim is to facilitate use of several of the implemented features _together_, when using the fork as a remote theme. It should also simplify merging the included PRs into a future release.

The branch [combination-rec-nav](https://github.com/pdmosses/just-the-docs/tree/combination-rec-nav) adds [multi-level navigation](https://github.com/pmarsceill/just-the-docs/pull/462) and (NEW:) [sibling links](https://github.com/pmarsceill/just-the-docs/pull/394) to the branch used for this PR. It includes updated [documentation for the navigation structure](https://pdmosses.github.io/just-the-docs/docs/navigation-structure/), and reorganised and extended [navigation tests](https://pdmosses.github.io/just-the-docs/tests/navigation/). The documentation and the tests can be browsed at the (temporary) [website published from the combination-rec-nav branch](https://pdmosses.github.io/just-the-docs/).

_Caveat:_ The changes to v0.3.3 in this PR and #462 have not yet been reviewed or approved, and may need updating before merging into a release of the theme. If you use a branch from a PR as a remote theme, there is a risk of such updates affecting your website. Moreover, these branches are likely to be deleted after they have been merged. To avoid  such problems, you could copy the branch that you want to use to your own fork of the theme.

Co-authored-by: Matt Wang <matt@matthewwang.me>
This commit is contained in:
Peter Mosses
2022-07-04 21:15:10 +02:00
committed by GitHub
parent 2b4f399336
commit 70b34f01f7
96 changed files with 1137 additions and 1451 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
_includes/css/callouts.scss.liquid Normal file
View File

@@ -0,0 +1,93 @@
{%- comment -%}
{% include css/callouts.scss.liquid color_scheme = string %}
produces SCSS for all the callouts in site.callouts. For the "dark"
color scheme, the levels of the text and background colors are reversed.
{%- endcomment -%}
{%- assign callout_background_hue = "000" -%}
{%- assign callout_color_hue = "300" -%}
{%- if site.callouts_level == "loud" or include.color_scheme == "dark" and site.callouts_level != "quiet" -%}
{%- assign callout_background_hue = "300" -%}
{%- assign callout_color_hue = "000" -%}
{%- endif -%}
div.opaque {
background-color: $body-background-color;
}
{%- for callout in site.callouts %}
{%- assign callout_opacity = callout[1].opacity | default: site.callouts_opacity | default: 0.2 -%}
p.{{ callout[0] }}, blockquote.{{ callout[0] }} {
background: rgba(${{ callout[1].color }}-{{ callout_background_hue }}, {{ callout_opacity }});
border-left: $border-radius solid ${{ callout[1].color }}-{{ callout_color_hue }};
border-radius: $border-radius;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08);
padding: .8rem;
{% if callout[1].title %}
&::before {
color: ${{ callout[1].color }}-{{ callout_color_hue }};
content: "{{ callout[1].title }}";
display: block;
font-weight: bold;
text-transform: uppercase;
font-size: .75em;
padding-bottom: .125rem;
}
{% endif %}
> .{{ callout[0] }}-title {
color: ${{ callout[1].color }}-{{ callout_color_hue }};
display: block;
font-weight: bold;
text-transform: uppercase;
font-size: .75em;
padding-bottom: .125rem;
}
}
p.{{ callout[0] }}-title, blockquote.{{ callout[0] }}-title {
background: rgba(${{ callout[1].color }}-{{ callout_background_hue }}, {{ callout_opacity }});
border-left: $border-radius solid ${{ callout[1].color }}-{{ callout_color_hue }};
border-radius: $border-radius;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08);
padding: .8rem;
> p:first-child {
margin-top: 0;
margin-bottom: 0;
color: ${{ callout[1].color }}-{{ callout_color_hue }};
display: block;
font-weight: bold;
text-transform: uppercase;
font-size: .75em;
padding-bottom: .125rem;
}
}
blockquote.{{ callout[0] }} {
margin-left: 0;
margin-right: 0;
> p:first-child {
margin-top: 0;
}
> p:last-child {
margin-bottom: 0;
}
}
blockquote.{{ callout[0] }}-title {
margin-left: 0;
margin-right: 0;
> p:nth-child(2) {
margin-top: 0;
}
> p:last-child {
margin-bottom: 0;
}
}
{% endfor -%}

3
_includes/css/just-the-docs.scss.liquid
View File

@@ -1,7 +1,8 @@
{% if site.logo %}
$logo: "{{ site.logo | absolute_url }}";
$logo: "{{ site.logo | relative_url }}";
{% endif %}
@import "./support/support";
@import "./color_schemes/{{ include.color_scheme }}";
@import "./modules";
{% include css/custom.scss.liquid %}
{% include css/callouts.scss.liquid color_scheme = include.color_scheme %}

34
_includes/nav.html
View File

@@ -60,11 +60,11 @@
{%- for node in pages_list -%}
{%- if node.parent == nil -%}
{%- unless node.nav_exclude -%}
<li class="nav-list-item{% if page.url == node.url or page.parent == node.title or page.grand_parent == node.title %} active{% endif %}">
<li class="nav-list-item{% if page.collection == include.key and page.url == node.url or page.parent == node.title or page.grand_parent == node.title %} active{% endif %}">
{%- if node.has_children -%}
<a href="#" class="nav-list-expander"><svg viewBox="0 0 24 24"><use xlink:href="#svg-arrow-right"></use></svg></a>
{%- endif -%}
<a href="{{ node.url | absolute_url }}" class="nav-list-link{% if page.url == node.url %} active{% endif %}">{{ node.title }}</a>
<a href="{{ node.url | relative_url }}" class="nav-list-link{% if page.url == node.url %} active{% endif %}">{{ node.title }}</a>
{%- if node.has_children -%}
{%- assign children_list = pages_list | where: "parent", node.title -%}
<ul class="nav-list ">
@@ -74,14 +74,14 @@
{%- if child.has_children -%}
<a href="#" class="nav-list-expander"><svg viewBox="0 0 24 24"><use xlink:href="#svg-arrow-right"></use></svg></a>
{%- endif -%}
<a href="{{ child.url | absolute_url }}" class="nav-list-link{% if page.url == child.url %} active{% endif %}">{{ child.title }}</a>
<a href="{{ child.url | relative_url }}" class="nav-list-link{% if page.url == child.url %} active{% endif %}">{{ child.title }}</a>
{%- if child.has_children -%}
{%- assign grand_children_list = pages_list | where: "parent", child.title | where: "grand_parent", node.title -%}
<ul class="nav-list">
{%- for grand_child in grand_children_list -%}
{%- unless grand_child.nav_exclude -%}
<li class="nav-list-item {% if page.url == grand_child.url %} active{% endif %}">
<a href="{{ grand_child.url | absolute_url }}" class="nav-list-link{% if page.url == grand_child.url %} active{% endif %}">{{ grand_child.title }}</a>
<a href="{{ grand_child.url | relative_url }}" class="nav-list-link{% if page.url == grand_child.url %} active{% endif %}">{{ grand_child.title }}</a>
</li>
{%- endunless -%}
{%- endfor -%}
@@ -97,3 +97,29 @@
{%- endif -%}
{%- endfor -%}
</ul>
{%- if page.collection == include.key -%}
{%- for node in pages_list -%}
{%- if node.parent == nil -%}
{%- if page.parent == node.title or page.grand_parent == node.title -%}
{%- assign first_level_url = node.url | relative_url -%}
{%- endif -%}
{%- if node.has_children -%}
{%- assign children_list = pages_list | where: "parent", node.title -%}
{%- for child in children_list -%}
{%- if child.has_children -%}
{%- if page.url == child.url or page.parent == child.title and page.grand_parent == child.parent -%}
{%- assign second_level_url = child.url | relative_url -%}
{%- endif -%}
{%- endif -%}
{%- endfor -%}
{%- endif -%}
{%- endif -%}
{%- endfor -%}
{% if page.has_children == true and page.has_toc != false %}
{%- assign toc_list = pages_list | where: "parent", page.title | where: "grand_parent", page.parent -%}
{%- endif -%}
{%- endif -%}