just-the-docs 0.4.0.rc2 → 0.4.0.rc4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CHANGELOG.md +461 -113
- data/README.md +36 -13
- data/_includes/components/aux_nav.html +15 -0
- data/_includes/components/breadcrumbs.html +15 -0
- data/_includes/components/children_nav.html +9 -0
- data/_includes/components/footer.html +34 -0
- data/_includes/components/header.html +11 -0
- data/_includes/components/mermaid.html +5 -0
- data/_includes/components/search_footer.html +7 -0
- data/_includes/components/search_header.html +9 -0
- data/_includes/components/sidebar.html +69 -0
- data/_includes/css/just-the-docs.scss.liquid +2 -1
- data/_includes/head.html +16 -15
- data/_includes/icons/code_copy.html +15 -0
- data/_includes/icons/document.html +6 -0
- data/_includes/icons/expand.html +6 -0
- data/_includes/icons/icons.html +13 -0
- data/_includes/icons/link.html +6 -0
- data/_includes/icons/menu.html +6 -0
- data/_includes/icons/search.html +6 -0
- data/_includes/nav.html +174 -110
- data/_includes/toc_heading_custom.html +1 -0
- data/_includes/vendor/anchor_headings.html +46 -18
- data/_layouts/default.html +11 -196
- data/_layouts/minimal.html +60 -0
- data/_sass/base.scss +15 -10
- data/_sass/buttons.scss +1 -4
- data/_sass/code.scss +85 -26
- data/_sass/labels.scss +1 -4
- data/_sass/layout.scss +1 -2
- data/_sass/navigation.scss +4 -14
- data/_sass/search.scss +9 -20
- data/_sass/tables.scss +1 -4
- data/assets/js/just-the-docs.js +44 -1
- data/assets/js/vendor/lunr.min.js +58 -3
- metadata +21 -4
- data/_includes/favicon.html +0 -1
data/_layouts/default.html
CHANGED
|
@@ -8,146 +8,12 @@ layout: table_wrappers
|
|
|
8
8
|
{% include head.html %}
|
|
9
9
|
<body>
|
|
10
10
|
<a class="skip-to-main" href="#main-content">Skip to main content</a>
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
<title>Link</title>
|
|
14
|
-
<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">
|
|
15
|
-
<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>
|
|
16
|
-
</svg>
|
|
17
|
-
</symbol>
|
|
18
|
-
<symbol id="svg-search" viewBox="0 0 24 24">
|
|
19
|
-
<title>Search</title>
|
|
20
|
-
<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">
|
|
21
|
-
<circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line>
|
|
22
|
-
</svg>
|
|
23
|
-
</symbol>
|
|
24
|
-
<symbol id="svg-menu" viewBox="0 0 24 24">
|
|
25
|
-
<title>Menu</title>
|
|
26
|
-
<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">
|
|
27
|
-
<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>
|
|
28
|
-
</svg>
|
|
29
|
-
</symbol>
|
|
30
|
-
<symbol id="svg-arrow-right" viewBox="0 0 24 24">
|
|
31
|
-
<title>Expand</title>
|
|
32
|
-
<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">
|
|
33
|
-
<polyline points="9 18 15 12 9 6"></polyline>
|
|
34
|
-
</svg>
|
|
35
|
-
</symbol>
|
|
36
|
-
<symbol id="svg-doc" viewBox="0 0 24 24">
|
|
37
|
-
<title>Document</title>
|
|
38
|
-
<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">
|
|
39
|
-
<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>
|
|
40
|
-
</svg>
|
|
41
|
-
</symbol>
|
|
42
|
-
{% include icons/external_link.html %}
|
|
43
|
-
</svg>
|
|
44
|
-
|
|
45
|
-
<div class="side-bar">
|
|
46
|
-
<div class="site-header">
|
|
47
|
-
<a href="{{ '/' | relative_url }}" class="site-title lh-tight">{% include title.html %}</a>
|
|
48
|
-
<a href="#" id="menu-button" class="site-button">
|
|
49
|
-
<svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-menu"></use></svg>
|
|
50
|
-
</a>
|
|
51
|
-
</div>
|
|
52
|
-
<nav role="navigation" aria-label="Main" id="site-nav" class="site-nav">
|
|
53
|
-
{% assign pages_top_size = site.html_pages
|
|
54
|
-
| where_exp:"item", "item.title != nil"
|
|
55
|
-
| where_exp:"item", "item.parent == nil"
|
|
56
|
-
| where_exp:"item", "item.nav_exclude != true"
|
|
57
|
-
| size %}
|
|
58
|
-
{% if pages_top_size > 0 %}
|
|
59
|
-
{% include nav.html pages=site.html_pages key=nil %}
|
|
60
|
-
{% endif %}
|
|
61
|
-
{% if site.just_the_docs.collections %}
|
|
62
|
-
{% assign collections_size = site.just_the_docs.collections | size %}
|
|
63
|
-
{% for collection_entry in site.just_the_docs.collections %}
|
|
64
|
-
{% assign collection_key = collection_entry[0] %}
|
|
65
|
-
{% assign collection_value = collection_entry[1] %}
|
|
66
|
-
{% assign collection = site[collection_key] %}
|
|
67
|
-
{% if collection_value.nav_exclude != true %}
|
|
68
|
-
{% if collections_size > 1 or pages_top_size > 0 %}
|
|
69
|
-
{% if collection_value.nav_fold == true %}
|
|
70
|
-
<ul class="nav-list nav-category-list">
|
|
71
|
-
<li class="nav-list-item{% if page.collection == collection_key %} active{% endif %}">
|
|
72
|
-
{%- if collection.size > 0 -%}
|
|
73
|
-
<a href="#" class="nav-list-expander"><svg viewBox="0 0 24 24"><use xlink:href="#svg-arrow-right"></use></svg></a>
|
|
74
|
-
{%- endif -%}
|
|
75
|
-
<div class="nav-category">{{ collection_value.name }}</div>
|
|
76
|
-
{% include nav.html pages=collection key=collection_key %}
|
|
77
|
-
</li>
|
|
78
|
-
</ul>
|
|
79
|
-
{% else %}
|
|
80
|
-
<div class="nav-category">{{ collection_value.name }}</div>
|
|
81
|
-
{% include nav.html pages=collection key=collection_key %}
|
|
82
|
-
{% endif %}
|
|
83
|
-
{% else %}
|
|
84
|
-
{% include nav.html pages=collection key=collection_key %}
|
|
85
|
-
{% endif %}
|
|
86
|
-
{% endif %}
|
|
87
|
-
{% endfor %}
|
|
88
|
-
{% endif %}
|
|
89
|
-
</nav>
|
|
90
|
-
|
|
91
|
-
{% capture nav_footer_custom %}
|
|
92
|
-
{%- include nav_footer_custom.html -%}
|
|
93
|
-
{% endcapture %}
|
|
94
|
-
{% if nav_footer_custom != "" %}
|
|
95
|
-
{{ nav_footer_custom }}
|
|
96
|
-
{% else %}
|
|
97
|
-
<footer class="site-footer">
|
|
98
|
-
This site uses <a href="https://github.com/just-the-docs/just-the-docs">Just the Docs</a>, a documentation theme for Jekyll.
|
|
99
|
-
</footer>
|
|
100
|
-
{% endif %}
|
|
101
|
-
</div>
|
|
11
|
+
{% include icons/icons.html %}
|
|
12
|
+
{% include components/sidebar.html %}
|
|
102
13
|
<div class="main" id="top">
|
|
103
|
-
|
|
104
|
-
{% if site.search_enabled != false %}
|
|
105
|
-
|
|
106
|
-
{% capture search_placeholder %}{% include search_placeholder_custom.html %}{% endcapture %}
|
|
107
|
-
|
|
108
|
-
<div class="search">
|
|
109
|
-
<div class="search-input-wrap">
|
|
110
|
-
<input type="text" id="search-input" class="search-input" tabindex="0" placeholder="{{ search_placeholder | strip_html | strip }}" aria-label="{{ search_placeholder | strip_html| strip }}" autocomplete="off">
|
|
111
|
-
<label for="search-input" class="search-label"><svg viewBox="0 0 24 24" class="search-icon"><use xlink:href="#svg-search"></use></svg></label>
|
|
112
|
-
</div>
|
|
113
|
-
<div id="search-results" class="search-results"></div>
|
|
114
|
-
</div>
|
|
115
|
-
{% endif %}
|
|
116
|
-
{% include header_custom.html %}
|
|
117
|
-
{% if site.aux_links %}
|
|
118
|
-
<nav aria-label="Auxiliary" class="aux-nav">
|
|
119
|
-
<ul class="aux-nav-list">
|
|
120
|
-
{% for link in site.aux_links %}
|
|
121
|
-
<li class="aux-nav-list-item">
|
|
122
|
-
<a href="{{ link.last }}" class="site-button"
|
|
123
|
-
{% if site.aux_links_new_tab %}
|
|
124
|
-
target="_blank" rel="noopener noreferrer"
|
|
125
|
-
{% endif %}
|
|
126
|
-
>
|
|
127
|
-
{{ link.first }}
|
|
128
|
-
</a>
|
|
129
|
-
</li>
|
|
130
|
-
{% endfor %}
|
|
131
|
-
</ul>
|
|
132
|
-
</nav>
|
|
133
|
-
{% endif %}
|
|
134
|
-
</div>
|
|
14
|
+
{% include components/header.html %}
|
|
135
15
|
<div id="main-content-wrap" class="main-content-wrap">
|
|
136
|
-
{%
|
|
137
|
-
{% if page.parent %}
|
|
138
|
-
<nav aria-label="Breadcrumb" class="breadcrumb-nav">
|
|
139
|
-
<ol class="breadcrumb-nav-list">
|
|
140
|
-
{% if page.grand_parent %}
|
|
141
|
-
<li class="breadcrumb-nav-list-item"><a href="{{ first_level_url }}">{{ page.grand_parent }}</a></li>
|
|
142
|
-
<li class="breadcrumb-nav-list-item"><a href="{{ second_level_url }}">{{ page.parent }}</a></li>
|
|
143
|
-
{% else %}
|
|
144
|
-
<li class="breadcrumb-nav-list-item"><a href="{{ first_level_url }}">{{ page.parent }}</a></li>
|
|
145
|
-
{% endif %}
|
|
146
|
-
<li class="breadcrumb-nav-list-item"><span>{{ page.title }}</span></li>
|
|
147
|
-
</ol>
|
|
148
|
-
</nav>
|
|
149
|
-
{% endif %}
|
|
150
|
-
{% endunless %}
|
|
16
|
+
{% include components/breadcrumbs.html %}
|
|
151
17
|
<div id="main-content" class="main-content" role="main">
|
|
152
18
|
{% if site.heading_anchors != false %}
|
|
153
19
|
{% 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" anchorAttrs="aria-labelledby=\"%html_id%\"" %}
|
|
@@ -156,71 +22,20 @@ layout: table_wrappers
|
|
|
156
22
|
{% endif %}
|
|
157
23
|
|
|
158
24
|
{% if page.has_children == true and page.has_toc != false %}
|
|
159
|
-
|
|
160
|
-
<h2 class="text-delta">Table of contents</h2>
|
|
161
|
-
<ul>
|
|
162
|
-
{% for child in toc_list %}
|
|
163
|
-
<li>
|
|
164
|
-
<a href="{{ child.url | relative_url }}">{{ child.title }}</a>{% if child.summary %} - {{ child.summary }}{% endif %}
|
|
165
|
-
</li>
|
|
166
|
-
{% endfor %}
|
|
167
|
-
</ul>
|
|
25
|
+
{% include components/children_nav.html toc_list=toc_list %}
|
|
168
26
|
{% endif %}
|
|
169
27
|
|
|
170
|
-
{%
|
|
171
|
-
{%- include footer_custom.html -%}
|
|
172
|
-
{% endcapture %}
|
|
173
|
-
{% if footer_custom != "" or site.last_edit_timestamp or site.gh_edit_link %}
|
|
174
|
-
<hr>
|
|
175
|
-
<footer>
|
|
176
|
-
{% if site.back_to_top %}
|
|
177
|
-
<p><a href="#top" id="back-to-top">{{ site.back_to_top_text }}</a></p>
|
|
178
|
-
{% endif %}
|
|
179
|
-
|
|
180
|
-
{{ footer_custom }}
|
|
181
|
-
|
|
182
|
-
{% if site.last_edit_timestamp or site.gh_edit_link %}
|
|
183
|
-
<div class="d-flex mt-2">
|
|
184
|
-
{% if site.last_edit_timestamp and site.last_edit_time_format and page.last_modified_date %}
|
|
185
|
-
<p class="text-small text-grey-dk-000 mb-0 mr-2">
|
|
186
|
-
Page last modified: <span class="d-inline-block">{{ page.last_modified_date | date: site.last_edit_time_format }}</span>.
|
|
187
|
-
</p>
|
|
188
|
-
{% endif %}
|
|
189
|
-
{% if
|
|
190
|
-
site.gh_edit_link and
|
|
191
|
-
site.gh_edit_link_text and
|
|
192
|
-
site.gh_edit_repository and
|
|
193
|
-
site.gh_edit_branch and
|
|
194
|
-
site.gh_edit_view_mode
|
|
195
|
-
%}
|
|
196
|
-
<p class="text-small text-grey-dk-000 mb-0">
|
|
197
|
-
<a href="{{ site.gh_edit_repository }}/{{ site.gh_edit_view_mode }}/{{ site.gh_edit_branch }}{% if site.gh_edit_source %}/{{ site.gh_edit_source }}{% endif %}{% if page.collection and site.collections_dir %}/{{ site.collections_dir }}{% endif %}/{{ page.path }}" id="edit-this-page">{{ site.gh_edit_link_text }}</a>
|
|
198
|
-
</p>
|
|
199
|
-
{% endif %}
|
|
200
|
-
</div>
|
|
201
|
-
{% endif %}
|
|
202
|
-
</footer>
|
|
203
|
-
{% endif %}
|
|
28
|
+
{% include components/footer.html %}
|
|
204
29
|
|
|
205
30
|
</div>
|
|
206
31
|
</div>
|
|
207
|
-
|
|
208
32
|
{% if site.search_enabled != false %}
|
|
209
|
-
{%
|
|
210
|
-
<a href="#" id="search-button" class="search-button">
|
|
211
|
-
<svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-search"></use></svg>
|
|
212
|
-
</a>
|
|
213
|
-
{% endif %}
|
|
214
|
-
|
|
215
|
-
<div class="search-overlay"></div>
|
|
33
|
+
{% include components/search_footer.html %}
|
|
216
34
|
{% endif %}
|
|
217
35
|
</div>
|
|
36
|
+
|
|
37
|
+
{% if site.mermaid %}
|
|
38
|
+
{% include components/mermaid.html %}
|
|
39
|
+
{% endif %}
|
|
218
40
|
</body>
|
|
219
|
-
{% if site.mermaid %}
|
|
220
|
-
<script>
|
|
221
|
-
var config = {% include mermaid_config.js %};
|
|
222
|
-
mermaid.initialize(config);
|
|
223
|
-
window.mermaid.init(undefined, document.querySelectorAll('.language-mermaid'));
|
|
224
|
-
</script>
|
|
225
|
-
{% endif %}
|
|
226
41
|
</html>
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
---
|
|
2
|
+
layout: table_wrappers
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
<!DOCTYPE html>
|
|
6
|
+
|
|
7
|
+
<html lang="{{ site.lang | default: 'en-US' }}">
|
|
8
|
+
{% include head.html %}
|
|
9
|
+
<body>
|
|
10
|
+
<a class="skip-to-main" href="#main-content">Skip to main content</a>
|
|
11
|
+
{% include icons/icons.html %}
|
|
12
|
+
{% comment %}
|
|
13
|
+
This is a bandaid fix to properly render breadcrumbs; as of now, there is some variable leakage between the sidebar component (which computes parents, grandparents) and the breadcrumbs component. We plan to remove this in a future release to deduplicate code.
|
|
14
|
+
|
|
15
|
+
For more context, see https://github.com/just-the-docs/just-the-docs/pull/1058#discussion_r1057014053
|
|
16
|
+
{% endcomment %}
|
|
17
|
+
{% capture nav %}
|
|
18
|
+
{% assign pages_top_size = site.html_pages
|
|
19
|
+
| where_exp:"item", "item.title != nil"
|
|
20
|
+
| where_exp:"item", "item.parent == nil"
|
|
21
|
+
| where_exp:"item", "item.nav_exclude != true"
|
|
22
|
+
| size %}
|
|
23
|
+
{% if pages_top_size > 0 %}
|
|
24
|
+
{% include nav.html pages=site.html_pages key=nil %}
|
|
25
|
+
{% endif %}
|
|
26
|
+
{% if site.just_the_docs.collections %}
|
|
27
|
+
{% assign collections_size = site.just_the_docs.collections | size %}
|
|
28
|
+
{% for collection_entry in site.just_the_docs.collections %}
|
|
29
|
+
{% assign collection_key = collection_entry[0] %}
|
|
30
|
+
{% assign collection_value = collection_entry[1] %}
|
|
31
|
+
{% assign collection = site[collection_key] %}
|
|
32
|
+
{% if collection_value.nav_exclude != true %}
|
|
33
|
+
{% include nav.html pages=collection key=collection_key %}
|
|
34
|
+
{% endif %}
|
|
35
|
+
{% endfor %}
|
|
36
|
+
{% endif %}
|
|
37
|
+
{% endcapture %}
|
|
38
|
+
<div id="main-content-wrap" class="main-content-wrap" id="top">
|
|
39
|
+
{% include components/breadcrumbs.html %}
|
|
40
|
+
<div id="main-content" class="main-content" role="main">
|
|
41
|
+
{% if site.heading_anchors != false %}
|
|
42
|
+
{% 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" anchorAttrs="aria-labelledby=\"%html_id%\"" %}
|
|
43
|
+
{% else %}
|
|
44
|
+
{{ content }}
|
|
45
|
+
{% endif %}
|
|
46
|
+
|
|
47
|
+
{% if page.has_children == true and page.has_toc != false %}
|
|
48
|
+
{% include components/children_nav.html toc_list=toc_list %}
|
|
49
|
+
{% endif %}
|
|
50
|
+
|
|
51
|
+
{% include components/footer.html %}
|
|
52
|
+
|
|
53
|
+
</div>
|
|
54
|
+
</div>
|
|
55
|
+
|
|
56
|
+
{% if site.mermaid %}
|
|
57
|
+
{% include components/mermaid.html %}
|
|
58
|
+
{% endif %}
|
|
59
|
+
</body>
|
|
60
|
+
</html>
|
data/_sass/base.scss
CHANGED
|
@@ -65,18 +65,12 @@ a {
|
|
|
65
65
|
}
|
|
66
66
|
|
|
67
67
|
a:not([class]) {
|
|
68
|
-
text-decoration:
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
background-position: 0 100%;
|
|
72
|
-
background-size: 1px 1px;
|
|
68
|
+
text-decoration: underline;
|
|
69
|
+
text-decoration-color: $border-color;
|
|
70
|
+
text-underline-offset: 2px;
|
|
73
71
|
|
|
74
72
|
&:hover {
|
|
75
|
-
|
|
76
|
-
rgba($link-color, 0.45) 0%,
|
|
77
|
-
rgba($link-color, 0.45) 100%
|
|
78
|
-
);
|
|
79
|
-
background-size: 1px 1px;
|
|
73
|
+
text-decoration-color: rgba($link-color, 0.45);
|
|
80
74
|
}
|
|
81
75
|
}
|
|
82
76
|
|
|
@@ -107,3 +101,14 @@ hr {
|
|
|
107
101
|
background-color: $border-color;
|
|
108
102
|
border: 0;
|
|
109
103
|
}
|
|
104
|
+
|
|
105
|
+
// adds a GitHub-style sidebar to blockquotes
|
|
106
|
+
blockquote {
|
|
107
|
+
margin: 10px 0;
|
|
108
|
+
|
|
109
|
+
// resets user-agent stylesheets for blockquotes
|
|
110
|
+
margin-block-start: 0;
|
|
111
|
+
margin-inline-start: 0;
|
|
112
|
+
padding-left: 15px;
|
|
113
|
+
border-left: 3px solid $border-color;
|
|
114
|
+
}
|
data/_sass/buttons.scss
CHANGED
data/_sass/code.scss
CHANGED
|
@@ -3,12 +3,15 @@
|
|
|
3
3
|
|
|
4
4
|
// {% raw %}
|
|
5
5
|
|
|
6
|
-
code
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
6
|
+
// This instruction applies to all queues not within 'pre' or 'figure', avoiding 'code' generated by the highlight.
|
|
7
|
+
:not(pre, figure) {
|
|
8
|
+
& > code {
|
|
9
|
+
padding: 0.2em 0.15em;
|
|
10
|
+
font-weight: 400;
|
|
11
|
+
background-color: $code-background-color;
|
|
12
|
+
border: $border $border-color;
|
|
13
|
+
border-radius: $border-radius;
|
|
14
|
+
}
|
|
12
15
|
}
|
|
13
16
|
|
|
14
17
|
// Avoid appearance of dark border around visited code links in Safari
|
|
@@ -47,18 +50,77 @@ a:visited code {
|
|
|
47
50
|
// Kramdown line_numbers = true: fences have a wider gutter than with Liquid?
|
|
48
51
|
|
|
49
52
|
// ```[LANG]...```
|
|
53
|
+
|
|
54
|
+
// the code may appear with 3 different types:
|
|
55
|
+
// container \ case: default case, code with line number, code with html rendering
|
|
56
|
+
// top level: div.highlighter-rouge, figure.highlight, figure.highlight
|
|
57
|
+
// second level: div.highlight, div.table-wrapper, pre.highlight
|
|
58
|
+
// third level: pre.highlight, td.code, absent
|
|
59
|
+
// last level: code, pre, code (optionality)
|
|
60
|
+
// highlighter level: span, span, span
|
|
61
|
+
// the spacing are only in the second level for case 1, 3 and in the third level for case 2
|
|
62
|
+
|
|
63
|
+
// select top level container
|
|
50
64
|
div.highlighter-rouge,
|
|
51
|
-
div.listingblock > div.content
|
|
52
|
-
|
|
65
|
+
div.listingblock > div.content,
|
|
66
|
+
figure.highlight {
|
|
53
67
|
margin-top: 0;
|
|
54
68
|
margin-bottom: $sp-3;
|
|
55
|
-
overflow-x: auto;
|
|
56
69
|
background-color: $code-background-color;
|
|
57
70
|
border-radius: $border-radius;
|
|
58
71
|
box-shadow: none;
|
|
59
72
|
-webkit-overflow-scrolling: touch;
|
|
73
|
+
position: relative;
|
|
74
|
+
padding: 0;
|
|
75
|
+
|
|
76
|
+
// copy button (or other button)
|
|
77
|
+
// the button appear only when there is a hover on the code or focus on button
|
|
78
|
+
> button {
|
|
79
|
+
width: $sp-3;
|
|
80
|
+
opacity: 0;
|
|
81
|
+
position: absolute;
|
|
82
|
+
top: 0;
|
|
83
|
+
right: 0;
|
|
84
|
+
border: $sp-3 solid $code-background-color;
|
|
85
|
+
background-color: $code-background-color;
|
|
86
|
+
color: $body-text-color;
|
|
87
|
+
box-sizing: content-box;
|
|
88
|
+
|
|
89
|
+
svg {
|
|
90
|
+
fill: $body-text-color;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
&:active {
|
|
94
|
+
text-decoration: none;
|
|
95
|
+
outline: none;
|
|
96
|
+
opacity: 1;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
&:focus {
|
|
100
|
+
opacity: 1;
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
// the button can be seen by doing a simple hover in the code, there is no need to go over the location of the button
|
|
105
|
+
&:hover {
|
|
106
|
+
> button {
|
|
107
|
+
cursor: copy;
|
|
108
|
+
opacity: 1;
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
// setting the spacing and scrollbar on the second level for the first case
|
|
114
|
+
// remove all space on the second and thirt level
|
|
115
|
+
div.highlighter-rouge,
|
|
116
|
+
div.listingblock {
|
|
117
|
+
div.highlight {
|
|
118
|
+
overflow-x: auto;
|
|
119
|
+
padding: $sp-3;
|
|
120
|
+
margin: 0;
|
|
121
|
+
border: 0;
|
|
122
|
+
}
|
|
60
123
|
|
|
61
|
-
div.highlight,
|
|
62
124
|
pre.highlight,
|
|
63
125
|
code {
|
|
64
126
|
padding: 0;
|
|
@@ -69,19 +131,15 @@ div.listingblock > div.content {
|
|
|
69
131
|
|
|
70
132
|
// {% highlight LANG %}...{% endhighlight %},
|
|
71
133
|
// {% highlight LANG linenos %}...{% endhighlight %}:
|
|
72
|
-
figure.highlight {
|
|
73
|
-
padding: $sp-3;
|
|
74
|
-
margin-top: 0;
|
|
75
|
-
margin-bottom: $sp-3;
|
|
76
|
-
overflow-x: auto;
|
|
77
|
-
background-color: $code-background-color;
|
|
78
|
-
border-radius: $border-radius;
|
|
79
|
-
box-shadow: none;
|
|
80
|
-
-webkit-overflow-scrolling: touch;
|
|
81
134
|
|
|
135
|
+
// setting the spacing and scrollbar on the second level for the thirt case
|
|
136
|
+
// the css rule are apply only to the last code enviroment
|
|
137
|
+
// setting the scroolbar
|
|
138
|
+
figure.highlight {
|
|
82
139
|
pre,
|
|
83
|
-
code {
|
|
84
|
-
|
|
140
|
+
:not(pre) > code {
|
|
141
|
+
overflow-x: auto;
|
|
142
|
+
padding: $sp-3;
|
|
85
143
|
margin: 0;
|
|
86
144
|
border: 0;
|
|
87
145
|
}
|
|
@@ -89,8 +147,10 @@ figure.highlight {
|
|
|
89
147
|
|
|
90
148
|
// ```[LANG]...```, kramdown line_numbers = true,
|
|
91
149
|
// {% highlight LANG linenos %}...{% endhighlight %}:
|
|
150
|
+
|
|
151
|
+
// setting the spacing and scrollbar on the thirt level for the second case
|
|
92
152
|
.highlight .table-wrapper {
|
|
93
|
-
padding: 0;
|
|
153
|
+
padding: $sp-3 0;
|
|
94
154
|
margin: 0;
|
|
95
155
|
border: 0;
|
|
96
156
|
box-shadow: none;
|
|
@@ -106,7 +166,9 @@ figure.highlight {
|
|
|
106
166
|
}
|
|
107
167
|
|
|
108
168
|
td.gl {
|
|
169
|
+
width: 1em;
|
|
109
170
|
padding-right: $sp-3;
|
|
171
|
+
padding-left: $sp-3;
|
|
110
172
|
}
|
|
111
173
|
|
|
112
174
|
pre {
|
|
@@ -115,10 +177,7 @@ figure.highlight {
|
|
|
115
177
|
}
|
|
116
178
|
}
|
|
117
179
|
|
|
118
|
-
//
|
|
119
|
-
// Code examples (rendered)
|
|
120
|
-
//
|
|
121
|
-
|
|
180
|
+
// Code examples: html render of a code
|
|
122
181
|
.code-example,
|
|
123
182
|
.listingblock > .title {
|
|
124
183
|
padding: $sp-3;
|
data/_sass/labels.scss
CHANGED
data/_sass/layout.scss
CHANGED
|
@@ -7,11 +7,10 @@
|
|
|
7
7
|
background-color: $sidebar-color;
|
|
8
8
|
|
|
9
9
|
@include mq(md) {
|
|
10
|
-
flex-
|
|
10
|
+
flex-flow: column nowrap;
|
|
11
11
|
position: fixed;
|
|
12
12
|
width: $nav-width-md;
|
|
13
13
|
height: 100%;
|
|
14
|
-
flex-direction: column;
|
|
15
14
|
border-right: $border $border-color;
|
|
16
15
|
align-items: flex-end;
|
|
17
16
|
}
|
data/_sass/navigation.scss
CHANGED
|
@@ -73,19 +73,13 @@
|
|
|
73
73
|
|
|
74
74
|
width: $nav-list-item-height-sm;
|
|
75
75
|
height: $nav-list-item-height-sm;
|
|
76
|
-
padding
|
|
77
|
-
padding-right: #{$nav-list-item-height-sm / 4};
|
|
78
|
-
padding-bottom: #{$nav-list-item-height-sm / 4};
|
|
79
|
-
padding-left: #{$nav-list-item-height-sm / 4};
|
|
76
|
+
padding: #{$nav-list-item-height-sm * 0.25};
|
|
80
77
|
color: $link-color;
|
|
81
78
|
|
|
82
79
|
@include mq(md) {
|
|
83
80
|
width: $nav-list-item-height;
|
|
84
81
|
height: $nav-list-item-height;
|
|
85
|
-
padding
|
|
86
|
-
padding-right: #{$nav-list-item-height / 4};
|
|
87
|
-
padding-bottom: #{$nav-list-item-height / 4};
|
|
88
|
-
padding-left: #{$nav-list-item-height / 4};
|
|
82
|
+
padding: #{$nav-list-item-height * 0.25};
|
|
89
83
|
}
|
|
90
84
|
|
|
91
85
|
&:hover {
|
|
@@ -138,10 +132,7 @@
|
|
|
138
132
|
}
|
|
139
133
|
|
|
140
134
|
.nav-category {
|
|
141
|
-
padding
|
|
142
|
-
padding-right: $gutter-spacing-sm;
|
|
143
|
-
padding-bottom: $sp-2;
|
|
144
|
-
padding-left: $gutter-spacing-sm;
|
|
135
|
+
padding: $sp-2 $gutter-spacing-sm;
|
|
145
136
|
font-weight: 600;
|
|
146
137
|
text-align: start;
|
|
147
138
|
text-transform: uppercase;
|
|
@@ -149,8 +140,7 @@
|
|
|
149
140
|
@include fs-2;
|
|
150
141
|
|
|
151
142
|
@include mq(md) {
|
|
152
|
-
padding
|
|
153
|
-
padding-left: $gutter-spacing;
|
|
143
|
+
padding: $sp-2 $gutter-spacing;
|
|
154
144
|
margin-top: $gutter-spacing-sm;
|
|
155
145
|
text-align: start;
|
|
156
146
|
|
data/_sass/search.scss
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
flex-grow: 1;
|
|
7
7
|
height: $sp-10;
|
|
8
8
|
padding: $sp-2;
|
|
9
|
-
transition: padding linear #{$transition-duration
|
|
9
|
+
transition: padding linear #{$transition-duration * 0.5};
|
|
10
10
|
|
|
11
11
|
@include mq(md) {
|
|
12
12
|
position: relative !important;
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
overflow: hidden;
|
|
25
25
|
border-radius: $border-radius;
|
|
26
26
|
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08);
|
|
27
|
-
transition: height linear #{$transition-duration
|
|
27
|
+
transition: height linear #{$transition-duration * 0.5};
|
|
28
28
|
|
|
29
29
|
@include mq(md) {
|
|
30
30
|
position: absolute;
|
|
@@ -41,10 +41,7 @@
|
|
|
41
41
|
position: absolute;
|
|
42
42
|
width: 100%;
|
|
43
43
|
height: 100%;
|
|
44
|
-
padding
|
|
45
|
-
padding-right: $gutter-spacing-sm;
|
|
46
|
-
padding-bottom: $sp-2;
|
|
47
|
-
padding-left: #{$gutter-spacing-sm + $sp-5};
|
|
44
|
+
padding: $sp-2 $gutter-spacing-sm $sp-2 #{$gutter-spacing-sm + $sp-5};
|
|
48
45
|
font-size: 16px;
|
|
49
46
|
color: $body-text-color;
|
|
50
47
|
background-color: $search-background-color;
|
|
@@ -55,12 +52,10 @@
|
|
|
55
52
|
border-radius: 0;
|
|
56
53
|
|
|
57
54
|
@include mq(md) {
|
|
58
|
-
padding
|
|
59
|
-
padding-bottom: $gutter-spacing-sm;
|
|
60
|
-
padding-left: #{$gutter-spacing + $sp-5};
|
|
55
|
+
padding: $sp-2 $gutter-spacing-sm $sp-2 #{$gutter-spacing + $sp-5};
|
|
61
56
|
font-size: 14px;
|
|
62
57
|
background-color: $body-background-color;
|
|
63
|
-
transition: padding-left linear #{$transition-duration
|
|
58
|
+
transition: padding-left linear #{$transition-duration * 0.5};
|
|
64
59
|
}
|
|
65
60
|
|
|
66
61
|
&:focus {
|
|
@@ -80,7 +75,7 @@
|
|
|
80
75
|
|
|
81
76
|
@include mq(md) {
|
|
82
77
|
padding-left: $gutter-spacing;
|
|
83
|
-
transition: padding-left linear #{$transition-duration
|
|
78
|
+
transition: padding-left linear #{$transition-duration * 0.5};
|
|
84
79
|
}
|
|
85
80
|
|
|
86
81
|
.search-icon {
|
|
@@ -128,10 +123,7 @@
|
|
|
128
123
|
|
|
129
124
|
.search-result {
|
|
130
125
|
display: block;
|
|
131
|
-
padding-top: $sp-1;
|
|
132
|
-
padding-right: $sp-3;
|
|
133
|
-
padding-bottom: $sp-1;
|
|
134
|
-
padding-left: $sp-3;
|
|
126
|
+
padding-top: $sp-1 $sp-3;
|
|
135
127
|
|
|
136
128
|
&:hover,
|
|
137
129
|
&.active {
|
|
@@ -224,10 +216,7 @@
|
|
|
224
216
|
}
|
|
225
217
|
|
|
226
218
|
.search-no-result {
|
|
227
|
-
padding
|
|
228
|
-
padding-right: $sp-3;
|
|
229
|
-
padding-bottom: $sp-2;
|
|
230
|
-
padding-left: $sp-3;
|
|
219
|
+
padding: $sp-2 $sp-3;
|
|
231
220
|
@include fs-3;
|
|
232
221
|
}
|
|
233
222
|
|
|
@@ -240,7 +229,7 @@
|
|
|
240
229
|
height: $sp-9;
|
|
241
230
|
background-color: $search-background-color;
|
|
242
231
|
border: 1px solid rgba($link-color, 0.3);
|
|
243
|
-
border-radius: #{$sp-9
|
|
232
|
+
border-radius: #{$sp-9 * 0.5};
|
|
244
233
|
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08);
|
|
245
234
|
align-items: center;
|
|
246
235
|
justify-content: center;
|
data/_sass/tables.scss
CHANGED
|
@@ -22,10 +22,7 @@ td {
|
|
|
22
22
|
@include fs-3;
|
|
23
23
|
|
|
24
24
|
min-width: 120px;
|
|
25
|
-
padding
|
|
26
|
-
padding-right: $sp-3;
|
|
27
|
-
padding-bottom: $sp-2;
|
|
28
|
-
padding-left: $sp-3;
|
|
25
|
+
padding: $sp-2 $sp-3;
|
|
29
26
|
background-color: $table-background-color;
|
|
30
27
|
border-bottom: $border rgba($border-color, 0.5);
|
|
31
28
|
border-left: $border $border-color;
|