just-the-docs 0.2.9 → 0.3.0

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 1dadb070c0e24c8e955bf5f3de0268adbfe088d6f989ef47924f32b832e67b4e
4
- data.tar.gz: b066f2a83fc772dbf2fac349944cd1a701ea154187dd11c3ace04801a5aac91d
3
+ metadata.gz: e2844428b424cfc181383ae6082de0b423671060a6d1dbda09e6109a4fd84606
4
+ data.tar.gz: add4d5ded3df2fd68ccd217bb016a1a59a3565353cdced79e26348cd8ae573b1
5
5
  SHA512:
6
- metadata.gz: 19ca0f3d71d801855eb77b51391f7636949d2f359283acda07663f222e227cfe51516b9773352160b44487e18bc0c7ce0821b54ea7efae3b403b0562ee343fd7
7
- data.tar.gz: cd1240ad2cc18b33b9797b87a103a8d05e159ff67c4c9b8072add4feb49f450c877b55d53189b498f96d54b180352bb5ec73edc95035b40c44b72d5530e1b289
6
+ metadata.gz: c070b6335d791caa5ab2553dda3e36af8e1bbf17a1bf7808fe4794e8acbc89328c577b104096a0e8eca59e02084e023c72685378450c7a85c0d6ce9d4f6313a7
7
+ data.tar.gz: d7028baf344ede0a68e9f7274fdb4a99fca6d9485b997145a3d915a2eda001565530d8711abc25a7d3db1c71065d932d685e118b3d66218477804c972189ab6b
@@ -1,51 +1,55 @@
1
- <nav role="navigation" aria-label="Main navigation">
2
- <ul class="navigation-list">
3
- {%- assign ordered_pages_list = site.html_pages | where_exp:"item", "item.nav_order != nil" -%}
4
- {%- assign unordered_pages_list = site.html_pages | where_exp:"item", "item.nav_order == nil" -%}
5
- {%- if site.nav_sort == 'case_insensitive' -%}
6
- {%- assign sorted_ordered_pages_list = ordered_pages_list | sort_natural:"nav_order" -%}
7
- {%- assign sorted_unordered_pages_list = unordered_pages_list | sort_natural:"title" -%}
8
- {%- else -%}
9
- {%- assign sorted_ordered_pages_list = ordered_pages_list | sort:"nav_order" -%}
10
- {%- assign sorted_unordered_pages_list = unordered_pages_list | sort:"title" -%}
11
- {%- endif -%}
12
- {%- assign pages_list = sorted_ordered_pages_list | concat: sorted_unordered_pages_list -%}
13
- {%- for node in pages_list -%}
14
- {%- unless node.nav_exclude -%}
15
- {%- if node.parent == nil and node.title -%}
16
- <li class="navigation-list-item{% if page.url == node.url or page.parent == node.title or page.grand_parent == node.title %} active{% endif %}">
17
- {%- if page.parent == node.title or page.grand_parent == node.title -%}
18
- {%- assign first_level_url = node.url | absolute_url -%}
19
- {%- endif -%}
20
- <a href="{{ node.url | absolute_url }}" class="navigation-list-link{% if page.url == node.url %} active{% endif %}">{{ node.title }}</a>
21
- {%- if node.has_children -%}
22
- {%- assign children_list = pages_list | where: "parent", node.title -%}
23
- <ul class="navigation-list-child-list ">
24
- {%- for child in children_list -%}
25
- {%- unless child.nav_exclude -%}
26
- <li class="navigation-list-item {% if page.url == child.url or page.parent == child.title %} active{% endif %}">
27
- {%- if page.url == child.url or page.parent == child.title -%}
28
- {%- assign second_level_url = child.url | absolute_url -%}
29
- {%- endif -%}
30
- <a href="{{ child.url | absolute_url }}" class="navigation-list-link{% if page.url == child.url %} active{% endif %}">{{ child.title }}</a>
31
- {%- if child.has_children -%}
32
- {%- assign grand_children_list = pages_list | where: "parent", child.title | where: "grand_parent", node.title -%}
33
- <ul class="navigation-list-child-list">
34
- {%- for grand_child in grand_children_list -%}
35
- <li class="navigation-list-item {% if page.url == grand_child.url %} active{% endif %}">
36
- <a href="{{ grand_child.url | absolute_url }}" class="navigation-list-link{% if page.url == grand_child.url %} active{% endif %}">{{ grand_child.title }}</a>
37
- </li>
38
- {%- endfor -%}
39
- </ul>
40
- {%- endif -%}
41
- </li>
42
- {%- endunless -%}
43
- {%- endfor -%}
44
- </ul>
45
- {%- endif -%}
46
- </li>
47
- {%- endif -%}
48
- {%- endunless -%}
49
- {%- endfor -%}
50
- </ul>
51
- </nav>
1
+ <ul class="nav-list">
2
+ {%- assign ordered_pages_list = site.html_pages | where_exp:"item", "item.nav_order != nil" -%}
3
+ {%- assign unordered_pages_list = site.html_pages | where_exp:"item", "item.nav_order == nil" -%}
4
+ {%- if site.nav_sort == 'case_insensitive' -%}
5
+ {%- assign sorted_ordered_pages_list = ordered_pages_list | sort_natural:"nav_order" -%}
6
+ {%- assign sorted_unordered_pages_list = unordered_pages_list | sort_natural:"title" -%}
7
+ {%- else -%}
8
+ {%- assign sorted_ordered_pages_list = ordered_pages_list | sort:"nav_order" -%}
9
+ {%- assign sorted_unordered_pages_list = unordered_pages_list | sort:"title" -%}
10
+ {%- endif -%}
11
+ {%- assign pages_list = sorted_ordered_pages_list | concat: sorted_unordered_pages_list -%}
12
+ {%- for node in pages_list -%}
13
+ {%- unless node.nav_exclude -%}
14
+ {%- if node.parent == nil and node.title -%}
15
+ <li class="nav-list-item{% if page.url == node.url or page.parent == node.title or page.grand_parent == node.title %} active{% endif %}">
16
+ {%- if page.parent == node.title or page.grand_parent == node.title -%}
17
+ {%- assign first_level_url = node.url | absolute_url -%}
18
+ {%- endif -%}
19
+ {%- if node.has_children -%}
20
+ <a href="#" class="nav-list-expander"><svg viewBox="0 0 24 24"><use xlink:href="#svg-arrow-right"></use></svg></a>
21
+ {%- endif -%}
22
+ <a href="{{ node.url | absolute_url }}" class="nav-list-link{% if page.url == node.url %} active{% endif %}">{{ node.title }}</a>
23
+ {%- if node.has_children -%}
24
+ {%- assign children_list = pages_list | where: "parent", node.title -%}
25
+ <ul class="nav-list ">
26
+ {%- for child in children_list -%}
27
+ {%- unless child.nav_exclude -%}
28
+ <li class="nav-list-item {% if page.url == child.url or page.parent == child.title %} active{% endif %}">
29
+ {%- if page.url == child.url or page.parent == child.title -%}
30
+ {%- assign second_level_url = child.url | absolute_url -%}
31
+ {%- endif -%}
32
+ {%- if child.has_children -%}
33
+ <a href="#" class="nav-list-expander"><svg viewBox="0 0 24 24"><use xlink:href="#svg-arrow-right"></use></svg></a>
34
+ {%- endif -%}
35
+ <a href="{{ child.url | absolute_url }}" class="nav-list-link{% if page.url == child.url %} active{% endif %}">{{ child.title }}</a>
36
+ {%- if child.has_children -%}
37
+ {%- assign grand_children_list = pages_list | where: "parent", child.title | where: "grand_parent", node.title -%}
38
+ <ul class="nav-list">
39
+ {%- for grand_child in grand_children_list -%}
40
+ <li class="nav-list-item {% if page.url == grand_child.url %} active{% endif %}">
41
+ <a href="{{ grand_child.url | absolute_url }}" class="nav-list-link{% if page.url == grand_child.url %} active{% endif %}">{{ grand_child.title }}</a>
42
+ </li>
43
+ {%- endfor -%}
44
+ </ul>
45
+ {%- endif -%}
46
+ </li>
47
+ {%- endunless -%}
48
+ {%- endfor -%}
49
+ </ul>
50
+ {%- endif -%}
51
+ </li>
52
+ {%- endif -%}
53
+ {%- endunless -%}
54
+ {%- endfor -%}
55
+ </ul>
@@ -4,136 +4,166 @@ layout: table_wrappers
4
4
 
5
5
  <!DOCTYPE html>
6
6
 
7
- <html lang="{{ site.lang | default: "en-US" }}">
7
+ <html lang="{{ site.lang | default: 'en-US' }}">
8
8
  {% include head.html %}
9
9
  <body>
10
10
  <svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
11
- <symbol id="link" viewBox="0 0 16 16">
11
+ <symbol id="svg-link" viewBox="0 0 24 24">
12
12
  <title>Link</title>
13
- <path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path>
13
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-link">
14
+ <path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path>
15
+ </svg>
16
+ </symbol>
17
+ <symbol id="svg-search" viewBox="0 0 24 24">
18
+ <title>Search</title>
19
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search">
20
+ <circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line>
21
+ </svg>
22
+ </symbol>
23
+ <symbol id="svg-menu" viewBox="0 0 24 24">
24
+ <title>Menu</title>
25
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-menu">
26
+ <line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line>
27
+ </svg>
28
+ </symbol>
29
+ <symbol id="svg-arrow-right" viewBox="0 0 24 24">
30
+ <title>Expand</title>
31
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-right">
32
+ <polyline points="9 18 15 12 9 6"></polyline>
33
+ </svg>
34
+ </symbol>
35
+ <symbol id="svg-doc" viewBox="0 0 24 24">
36
+ <title>Document</title>
37
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file">
38
+ <path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path><polyline points="13 2 13 9 20 9"></polyline>
39
+ </svg>
14
40
  </symbol>
15
41
  </svg>
16
42
 
17
- <div class="page-wrap">
18
- <div class="side-bar">
19
- <div class="site-header">
20
- <a href="{{ site.url }}{{ site.baseurl }}" class="site-title lh-tight">{% include title.html %}</a>
21
- <button class="menu-button fs-3 js-main-nav-trigger" data-text-toggle="Hide" type="button">Menu</button>
22
- </div>
23
-
24
- <div class="navigation main-nav js-main-nav">
25
- {% include nav.html %}
26
- </div>
27
- <footer class="site-footer">
28
- <p class="text-small text-grey-dk-000 mb-4">This site uses <a href="https://github.com/pmarsceill/just-the-docs">Just the Docs</a>, a documentation theme for Jekyll.</p>
29
- </footer>
43
+ <div class="side-bar">
44
+ <div class="site-header">
45
+ <a href="{{ '/' | absolute_url }}" class="site-title lh-tight">{% include title.html %}</a>
46
+ <a href="#" id="menu-button" class="site-button">
47
+ <svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-menu"></use></svg>
48
+ </a>
30
49
  </div>
31
- <div class="main-content-wrap js-main-content" tabindex="0">
32
- <div class="main-content" id="top">
33
- <div class="page-header js-page-header">
34
- {% if site.search_enabled != false %}
35
- <div class="search">
36
- <div class="search-input-wrap">
37
- <input type="text" class="js-search-input search-input" tabindex="0" placeholder="Search {{ site.title }}" aria-label="Search {{ site.title }}" autocomplete="off">
38
- <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>
39
- </div>
40
- <div class="js-search-results search-results-wrap"></div>
50
+ <nav role="navigation" aria-label="Main" id="site-nav" class="site-nav">
51
+ {% include nav.html %}
52
+ </nav>
53
+ <footer class="site-footer">
54
+ This site uses <a href="https://github.com/pmarsceill/just-the-docs">Just the Docs</a>, a documentation theme for Jekyll.
55
+ </footer>
56
+ </div>
57
+ <div class="main" id="top">
58
+ <div id="main-header" class="main-header">
59
+ {% if site.search_enabled != false %}
60
+ <div class="search">
61
+ <div class="search-input-wrap">
62
+ <input type="text" id="search-input" class="search-input" tabindex="0" placeholder="Search {{ site.title }}" aria-label="Search {{ site.title }}" autocomplete="off">
63
+ <label for="search-input" class="search-label"><svg viewBox="0 0 24 24" class="search-icon"><use xlink:href="#svg-search"></use></svg></label>
41
64
  </div>
42
- {% endif %}
43
- {% if site.aux_links != nil %}
44
- <ul class="list-style-none text-small aux-nav">
45
- {% for link in site.aux_links %}
46
- <li class="d-inline-block my-0{% unless forloop.last %} mr-2{% endunless %}">
47
- <a href="{{ link.last }}"
48
- {% if site.aux_links_new_tab %}
49
- target="_blank" rel="noopener noreferrer"
50
- {% endif %}
51
- >
52
- {{ link.first }}
53
- </a>
54
- </li>
55
- {% endfor %}
56
- </ul>
57
- {% endif %}
65
+ <div id="search-results" class="search-results"></div>
58
66
  </div>
59
- <div class="page">
60
- {% unless page.url == "/" %}
61
- {% if page.parent %}
62
- <nav class="breadcrumb-nav">
63
- <ol class="breadcrumb-nav-list">
64
- {% if page.grand_parent %}
65
- <li class="breadcrumb-nav-list-item"><a href="{{ first_level_url }}">{{ page.grand_parent }}</a></li>
66
- <li class="breadcrumb-nav-list-item"><a href="{{ second_level_url }}">{{ page.parent }}</a></li>
67
- {% else %}
68
- <li class="breadcrumb-nav-list-item"><a href="{{ first_level_url }}">{{ page.parent }}</a></li>
67
+ {% endif %}
68
+ {% if site.aux_links %}
69
+ <nav aria-label="Auxiliary" class="aux-nav">
70
+ <ul class="aux-nav-list">
71
+ {% for link in site.aux_links %}
72
+ <li class="aux-nav-list-item">
73
+ <a href="{{ link.last }}" class="site-button"
74
+ {% if site.aux_links_new_tab %}
75
+ target="_blank" rel="noopener noreferrer"
69
76
  {% endif %}
70
- <li class="breadcrumb-nav-list-item"><span>{{ page.title }}</span></li>
71
- </ol>
72
- </nav>
73
- {% endif %}
74
- {% endunless %}
75
- <div id="main-content" class="page-content" role="main">
76
- {% if site.heading_anchors != false %}
77
- {% include vendor/anchor_headings.html html=content beforeHeading="true" anchorBody="<svg viewBox=\"0 0 16 16\" aria-hidden=\"true\"><use xlink:href=\"#link\"></use></svg>" anchorClass="anchor-heading" %}
78
- {% else %}
79
- {{ content }}
80
- {% endif %}
77
+ >
78
+ {{ link.first }}
79
+ </a>
80
+ </li>
81
+ {% endfor %}
82
+ </ul>
83
+ </nav>
84
+ {% endif %}
85
+ </div>
86
+ <div id="main-content-wrap" class="main-content-wrap">
87
+ {% unless page.url == "/" %}
88
+ {% if page.parent %}
89
+ <nav aria-label="Breadcrumb" class="breadcrumb-nav">
90
+ <ol class="breadcrumb-nav-list">
91
+ {% if page.grand_parent %}
92
+ <li class="breadcrumb-nav-list-item"><a href="{{ first_level_url }}">{{ page.grand_parent }}</a></li>
93
+ <li class="breadcrumb-nav-list-item"><a href="{{ second_level_url }}">{{ page.parent }}</a></li>
94
+ {% else %}
95
+ <li class="breadcrumb-nav-list-item"><a href="{{ first_level_url }}">{{ page.parent }}</a></li>
96
+ {% endif %}
97
+ <li class="breadcrumb-nav-list-item"><span>{{ page.title }}</span></li>
98
+ </ol>
99
+ </nav>
100
+ {% endif %}
101
+ {% endunless %}
102
+ <div id="main-content" class="main-content" role="main">
103
+ {% if site.heading_anchors != false %}
104
+ {% include vendor/anchor_headings.html html=content beforeHeading="true" anchorBody="<svg viewBox=\"0 0 16 16\" aria-hidden=\"true\"><use xlink:href=\"#svg-link\"></use></svg>" anchorClass="anchor-heading" %}
105
+ {% else %}
106
+ {{ content }}
107
+ {% endif %}
81
108
 
82
- {% if page.has_children == true and page.has_toc != false %}
83
- <hr>
84
- <h2 class="text-delta">Table of contents</h2>
85
- <ul>
86
- {%- assign children_list = pages_list | where: "parent", node.title -%}
87
- {% for child in children_list %}
88
- {% if child.parent == page.title and child.title != page.title and child.grand_parent == page.parent %}
89
- <li>
90
- <a href="{{ child.url | absolute_url }}">{{ child.title }}</a>{% if child.summary %} - {{ child.summary }}{% endif %}
91
- </li>
92
- {% endif %}
93
- {% endfor %}
94
- </ul>
95
- {% endif %}
109
+ {% if page.has_children == true and page.has_toc != false %}
110
+ <hr>
111
+ <h2 class="text-delta">Table of contents</h2>
112
+ <ul>
113
+ {%- assign children_list = pages_list | where: "parent", page.title | where: "grand_parent", page.parent -%}
114
+ {% for child in children_list %}
115
+ <li>
116
+ <a href="{{ child.url | absolute_url }}">{{ child.title }}</a>{% if child.summary %} - {{ child.summary }}{% endif %}
117
+ </li>
118
+ {% endfor %}
119
+ </ul>
120
+ {% endif %}
96
121
 
97
- {% if site.footer_content != nil or site.last_edit_timestamp or site.gh_edit_link %}
98
- <hr>
99
- <footer>
100
- {% if site.back_to_top %}
101
- <p><a href="#top">{{ site.back_to_top_text }}</a></p>
102
- {% endif %}
103
- {% if site.footer_content != nil %}
122
+ {% if site.footer_content != nil or site.last_edit_timestamp or site.gh_edit_link %}
123
+ <hr>
124
+ <footer>
125
+ {% if site.back_to_top %}
126
+ <p><a href="#top" id="back-to-top">{{ site.back_to_top_text }}</a></p>
127
+ {% endif %}
128
+ {% if site.footer_content != nil %}
104
129
  <p class="text-small text-grey-dk-000 mb-0">{{ site.footer_content }}</p>
105
- {% endif %}
130
+ {% endif %}
106
131
 
107
- {% if site.last_edit_timestamp or site.gh_edit_link %}
108
- <div class="d-flex mt-2">
109
- {% if site.last_edit_timestamp and site.last_edit_time_format and page.last_modified_date %}
132
+ {% if site.last_edit_timestamp or site.gh_edit_link %}
133
+ <div class="d-flex mt-2">
134
+ {% if site.last_edit_timestamp and site.last_edit_time_format and page.last_modified_date %}
110
135
  <p class="text-small text-grey-dk-000 mb-0 mr-2">
111
- Page last modified: <span class="d-inline-block">{{ page.last_modified_date | date: site.last_edit_time_format }}</span>.
136
+ Page last modified: <span class="d-inline-block">{{ page.last_modified_date | date: site.last_edit_time_format }}</span>.
112
137
  </p>
113
- {% endif %}
114
- {%
115
- if
138
+ {% endif %}
139
+ {% if
116
140
  site.gh_edit_link and
117
141
  site.gh_edit_link_text and
118
142
  site.gh_edit_repository and
119
143
  site.gh_edit_branch and
120
144
  site.gh_edit_view_mode
121
-
122
- %}
145
+ %}
123
146
  <p class="text-small text-grey-dk-000 mb-0">
124
- <a href="{{ site.gh_edit_repository }}/{{ site.gh_edit_view_mode }}/{{ site.gh_edit_branch }}/{{ page.path }}">{{ site.gh_edit_link_text }}</a>
147
+ <a href="{{ site.gh_edit_repository }}/{{ site.gh_edit_view_mode }}/{{ site.gh_edit_branch }}/{{ page.path }}" id="edit-this-page">{{ site.gh_edit_link_text }}</a>
125
148
  </p>
126
- {% endif %}
127
- </div>
128
- {% endif %}
129
-
130
- </footer>
131
- {% endif %}
149
+ {% endif %}
150
+ </div>
151
+ {% endif %}
152
+ </footer>
153
+ {% endif %}
132
154
 
133
- </div>
134
155
  </div>
135
156
  </div>
136
- </div>
137
157
 
158
+ {% if site.search_enabled != false %}
159
+ {% if site.search.button %}
160
+ <a href="#" id="search-button" class="search-button">
161
+ <svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-search"></use></svg>
162
+ </a>
163
+ {% endif %}
164
+
165
+ <div class="search-overlay"></div>
166
+ {% endif %}
167
+ </div>
138
168
  </body>
139
169
  </html>
@@ -16,8 +16,9 @@ figure.highlight {
16
16
  padding: $sp-3;
17
17
  margin-top: 0;
18
18
  margin-bottom: 0;
19
- -webkit-overflow-scrolling: touch;
20
19
  background-color: $code-background-color;
20
+ border-radius: $border-radius;
21
+ -webkit-overflow-scrolling: touch;
21
22
 
22
23
  code {
23
24
  padding: 0;
@@ -27,8 +28,6 @@ figure.highlight {
27
28
 
28
29
  .highlighter-rouge {
29
30
  margin-bottom: $sp-3;
30
- overflow: hidden;
31
- border-radius: $border-radius;
32
31
  }
33
32
 
34
33
  .highlight .c {
@@ -14,3 +14,4 @@ $base-button-color: $grey-dk-250;
14
14
  $code-background-color: $grey-dk-250;
15
15
  $search-background-color: $grey-dk-250;
16
16
  $table-background-color: $grey-dk-250;
17
+ $feedback-color: darken($sidebar-color, 3%);
@@ -5,7 +5,7 @@
5
5
  //
6
6
  // stylelint-disable selector-no-type, max-nesting-depth, selector-max-compound-selectors, selector-max-type
7
7
 
8
- .page-content {
8
+ .main-content {
9
9
  line-height: $content-line-height;
10
10
 
11
11
  ol,
@@ -148,7 +148,7 @@
148
148
  display: inline-block;
149
149
  width: 100%;
150
150
  height: 100%;
151
- fill: $link-color;
151
+ color: $link-color;
152
152
  visibility: hidden;
153
153
  }
154
154
  }
@@ -2,28 +2,15 @@
2
2
  // The basic two column layout
3
3
  //
4
4
 
5
- .page-wrap {
6
- @include mq(md) {
7
- position: absolute;
8
- top: 0;
9
- left: 0;
10
- display: flex;
11
- width: 100%;
12
- height: 100%;
13
- overflow-x: hidden;
14
- overflow-y: hidden;
15
- }
16
- }
17
-
18
5
  .side-bar {
19
- z-index: 100;
6
+ z-index: 0;
20
7
  display: flex;
21
8
  flex-wrap: wrap;
22
9
  background-color: $sidebar-color;
23
10
 
24
11
  @include mq(md) {
25
12
  flex-wrap: nowrap;
26
- position: absolute;
13
+ position: fixed;
27
14
  width: $nav-width-md;
28
15
  height: 100%;
29
16
  flex-direction: column;
@@ -37,20 +24,7 @@
37
24
  }
38
25
  }
39
26
 
40
- .main-content-wrap {
41
- @include mq(md) {
42
- position: absolute;
43
- top: 0;
44
- left: 0;
45
- width: 100%;
46
- height: 100%;
47
- -webkit-overflow-scrolling: touch;
48
- overflow-x: hidden;
49
- overflow-y: scroll;
50
- }
51
- }
52
-
53
- .main-content {
27
+ .main {
54
28
  @include mq(md) {
55
29
  position: relative;
56
30
  max-width: $content-width;
@@ -64,11 +38,7 @@
64
38
  }
65
39
  }
66
40
 
67
- .js-main-content:focus {
68
- outline: none;
69
- }
70
-
71
- .page {
41
+ .main-content-wrap {
72
42
  @include container;
73
43
  padding-top: $gutter-spacing-sm;
74
44
  padding-bottom: $gutter-spacing-sm;
@@ -79,16 +49,14 @@
79
49
  }
80
50
  }
81
51
 
82
- .page-header {
83
- @include container;
52
+ .main-header {
53
+ z-index: 0;
84
54
  display: none;
85
- padding-top: $gutter-spacing-sm;
86
- padding-bottom: $gutter-spacing-sm;
87
55
  background-color: $sidebar-color;
88
56
 
89
57
  @include mq(md) {
90
58
  display: flex;
91
- justify-content: flex-end;
59
+ justify-content: space-between;
92
60
  height: $header-height;
93
61
  background-color: $body-background-color;
94
62
  border-bottom: $border $border-color;
@@ -103,7 +71,7 @@
103
71
  }
104
72
  }
105
73
 
106
- .navigation,
74
+ .site-nav,
107
75
  .site-header,
108
76
  .site-footer {
109
77
  width: 100%;
@@ -113,10 +81,15 @@
113
81
  }
114
82
  }
115
83
 
116
- .navigation {
117
- @include container;
84
+ .site-nav {
85
+ display: none;
86
+
87
+ &.nav-open {
88
+ display: block;
89
+ }
118
90
 
119
91
  @include mq(md) {
92
+ display: block;
120
93
  padding-top: $sp-8;
121
94
  padding-bottom: $gutter-spacing-sm;
122
95
  overflow-y: auto;
@@ -130,7 +103,6 @@
130
103
  align-items: center;
131
104
 
132
105
  @include mq(md) {
133
- z-index: 101;
134
106
  height: $header-height;
135
107
  max-height: $header-height;
136
108
  border-bottom: $border $border-color;
@@ -165,27 +137,42 @@
165
137
  }
166
138
  }
167
139
 
168
- .menu-button {
169
- appearance: none;
140
+ .site-button {
170
141
  display: flex;
171
142
  height: 100%;
172
143
  padding: $gutter-spacing-sm;
173
144
  align-items: center;
174
- color: $link-color;
175
- text-transform: uppercase;
176
- background: transparent;
177
- border: 0;
145
+ }
178
146
 
179
- @include mq(md) {
147
+ @include mq(md) {
148
+ .site-header .site-button {
180
149
  display: none;
181
150
  }
182
151
  }
183
152
 
153
+ .site-title:hover {
154
+ background-image: linear-gradient(
155
+ -90deg,
156
+ rgba($feedback-color, 1) 0%,
157
+ rgba($feedback-color, 0.8) 80%,
158
+ rgba($feedback-color, 0) 100%
159
+ );
160
+ }
161
+
162
+ .site-button:hover {
163
+ background-image: linear-gradient(
164
+ -90deg,
165
+ rgba($feedback-color, 1) 0%,
166
+ rgba($feedback-color, 0.8) 100%
167
+ );
168
+ }
169
+
184
170
  // stylelint-disable selector-max-type
185
171
 
186
172
  body {
187
173
  position: relative;
188
174
  padding-bottom: $sp-10;
175
+ overflow-y: scroll;
189
176
 
190
177
  @include mq(md) {
191
178
  position: static;
@@ -202,9 +189,17 @@ body {
202
189
  left: 0;
203
190
  padding-top: $sp-4;
204
191
  padding-bottom: $sp-4;
192
+ color: $grey-dk-000;
193
+ @include fs-2;
205
194
 
206
195
  @include mq(md) {
207
196
  position: static;
208
197
  justify-self: end;
209
198
  }
210
199
  }
200
+
201
+ .icon {
202
+ width: $sp-5;
203
+ height: $sp-5;
204
+ color: $link-color;
205
+ }