owasp-td-jekyll 2.0.2 → 2.1.0
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/README.md +37 -4
- data/_config.yaml +22 -3
- data/_includes/head.html +4 -3
- data/_includes/home_links.html +3 -3
- data/_includes/navbar.html +139 -19
- data/_includes/scripts.html +3 -0
- data/_includes/sidebar.html +41 -21
- data/_layouts/default.html +39 -3
- data/_layouts/home.html +1 -1
- data/assets/css/style.css +340 -10
- data/assets/js/mobile-nav.js +49 -0
- data/assets/js/search.js +343 -0
- data/assets/js/sidebar.js +76 -1
- data/assets/js/theme.js +13 -10
- data/assets/js/tooltips.js +9 -0
- data/assets/search.json +18 -0
- metadata +6 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 8a2b21b43f586bb1d428b0f70f9800ebaee2a28acd286be0bdda077233f521cb
|
|
4
|
+
data.tar.gz: 66054e1dce6e9b848eae76b9452ff8d59dd4e4858d5cb9009332e8af35f1d813
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 4d3976fb33f8f48019ba57745d43912280213922ab073fbb054595d62a8478b6998c1c05ee3d5ac0fdb5ac30f4a726fc48879d6c0de6b3ae5180bf2b694d6558
|
|
7
|
+
data.tar.gz: 77ac1c8e7fdb76a536a4b48f242c8a2e46d91c106220463211c4e9b5ff4364c09047f62f559616c810c0fb07f7437d65d1637411d5f50e4049ff03587df76119
|
data/README.md
CHANGED
|
@@ -59,17 +59,26 @@ theme: owasp-td-jekyll
|
|
|
59
59
|
brand: OWASP Threat Dragon
|
|
60
60
|
faviconUrl: /assets/images/favicon.ico
|
|
61
61
|
|
|
62
|
+
search:
|
|
63
|
+
text:
|
|
64
|
+
tooltip: Search documentation
|
|
65
|
+
|
|
66
|
+
theme_toggle:
|
|
67
|
+
text:
|
|
68
|
+
dark_tooltip: Switch to dark mode
|
|
69
|
+
light_tooltip: Switch to light mode
|
|
70
|
+
|
|
62
71
|
header_links:
|
|
63
|
-
-
|
|
72
|
+
- tooltip: Try the web app
|
|
64
73
|
fa_class: fa fa-flask
|
|
65
74
|
url: https://www.threatdragon.com/#/
|
|
66
75
|
|
|
67
|
-
-
|
|
76
|
+
- tooltip: Download the desktop app
|
|
68
77
|
fa_class: fa fa-cloud-download-alt
|
|
69
78
|
target: _blank
|
|
70
79
|
url: https://github.com/OWASP/threat-dragon/releases
|
|
71
80
|
|
|
72
|
-
-
|
|
81
|
+
- tooltip: Visit us on GitHub
|
|
73
82
|
fa_class: fab fa-github
|
|
74
83
|
target: _blank
|
|
75
84
|
url: https://github.com/OWASP/threat-dragon
|
|
@@ -107,10 +116,17 @@ homeLinks:
|
|
|
107
116
|
|`brand`|string|The brand name to be used as the home link in the navbar|
|
|
108
117
|
|`faviconUrl`|string|The relative path to the favicon|
|
|
109
118
|
|`header_links`|array<object>|Additional links to be added to the navbar (top, not sidebar)
|
|
110
|
-
|`header_links[0].text`|string|
|
|
119
|
+
|`header_links[0].text`|string|Optional visible text for the link. If omitted or blank, the link renders as icon-only|
|
|
120
|
+
|`header_links[0].tooltip`|string|Optional tooltip/accessible label for the link. Recommended when `text` is omitted|
|
|
111
121
|
|`header_links[0].fa_class`|string|The font-awesome class to use for the dropdown. Use the full class, eg `fab fa-github`|
|
|
112
122
|
|`header_links[0].url`|string|The url to be used as the href preoprty on the anchor.|
|
|
113
123
|
|`header_links[0].target`|string|The `target` property for the anchor. Optional|
|
|
124
|
+
|`search.text`|string|Optional visible text for the navbar search trigger. If omitted or blank, the trigger renders as icon-only|
|
|
125
|
+
|`search.placeholder`|string|Optional placeholder text for the navbar search field. Defaults to `Search docs`|
|
|
126
|
+
|`search.tooltip`|string|Optional tooltip/accessible label for the navbar search trigger|
|
|
127
|
+
|`theme_toggle.text`|string|Optional visible text for the theme toggle. If omitted or blank, the toggle renders as icon-only|
|
|
128
|
+
|`theme_toggle.dark_tooltip`|string|Tooltip/accessible label shown when the next action is switching to dark mode. Defaults to `Switch to dark mode`|
|
|
129
|
+
|`theme_toggle.light_tooltip`|string|Tooltip/accessible label shown when the next action is switching to light mode. Defaults to `Switch to light mode`|
|
|
114
130
|
|
|
115
131
|
### Sidebar
|
|
116
132
|
The sidebar is used as the primary navigation for the site, unless it is on a smaller device. The navigation is built from a combination of properties provided in your `_config.yaml` as well as having the `group` and `nav_order` properties set in your (front matter)[https://jekyllrb.com/docs/front-matter/]
|
|
@@ -197,6 +213,14 @@ ____
|
|
|
197
213
|
## Breadcrumbs
|
|
198
214
|
Breadcrumbs rely on the file structure of your documentation to be as follows: `category/group/page.md`. Please see the top of the readme for a full example tree.
|
|
199
215
|
|
|
216
|
+
## Search
|
|
217
|
+
The theme includes a built-in documentation search field in the top navigation. It uses a Jekyll-generated JSON index at `/assets/search.json` and a small native JavaScript controller, so there are no additional third-party frontend dependencies to install or update.
|
|
218
|
+
|
|
219
|
+
Pages are indexed automatically when they have a `title`. To exclude a page from search, set this in its front matter:
|
|
220
|
+
```
|
|
221
|
+
search: false
|
|
222
|
+
```
|
|
223
|
+
|
|
200
224
|
## Contributing
|
|
201
225
|
|
|
202
226
|
Bug reports and pull requests are welcome on GitHub at https://github.com/lreading/owasp-td-jekyll. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.
|
|
@@ -205,6 +229,15 @@ Bug reports and pull requests are welcome on GitHub at https://github.com/lreadi
|
|
|
205
229
|
|
|
206
230
|
To set up your environment to develop this theme, run `bundle install`.
|
|
207
231
|
|
|
232
|
+
To run the same accessibility baseline locally that CI uses, also install the Node dev dependency and run:
|
|
233
|
+
|
|
234
|
+
```bash
|
|
235
|
+
npm install
|
|
236
|
+
npm run check:accessibility
|
|
237
|
+
```
|
|
238
|
+
|
|
239
|
+
That command rebuilds the Jekyll site and validates the generated HTML in `_site` with `html-validate`, giving a lightweight accessibility-focused baseline on pull requests and release builds. The check runs through plain `npm` scripts rather than a Bash wrapper, so it is friendlier to Windows contributors as well.
|
|
240
|
+
|
|
208
241
|
Your theme is setup just like a normal Jekyll site! To test your theme, run `bundle exec jekyll serve` and open your browser at `http://localhost:4000`. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.
|
|
209
242
|
|
|
210
243
|
When your theme is released, only the files in `_layouts`, `_includes`, and `assets` tracked with Git will be bundled.
|
data/_config.yaml
CHANGED
|
@@ -1,19 +1,38 @@
|
|
|
1
1
|
title: OWASP Threat Dragon
|
|
2
2
|
|
|
3
|
+
exclude:
|
|
4
|
+
- README.md
|
|
5
|
+
- RELEASE.md
|
|
6
|
+
- Rakefile
|
|
7
|
+
- package.json
|
|
8
|
+
- package-lock.json
|
|
9
|
+
- owasp-td-jekyll.gemspec
|
|
10
|
+
- "*.gem"
|
|
11
|
+
|
|
3
12
|
brand: OWASP Threat Dragon
|
|
4
13
|
faviconUrl: /assets/images/favicon.ico
|
|
5
14
|
|
|
15
|
+
search:
|
|
16
|
+
text:
|
|
17
|
+
tooltip: Search documentation
|
|
18
|
+
|
|
19
|
+
theme_toggle:
|
|
20
|
+
text:
|
|
21
|
+
dark_tooltip: Switch to dark mode
|
|
22
|
+
light_tooltip: Switch to light mode
|
|
23
|
+
|
|
6
24
|
header_links:
|
|
7
|
-
-
|
|
25
|
+
- tooltip: Try the web app
|
|
26
|
+
text:
|
|
8
27
|
fa_class: fa fa-flask
|
|
9
28
|
url: https://www.threatdragon.com/#/
|
|
10
29
|
|
|
11
|
-
-
|
|
30
|
+
- tooltip: Download the desktop app
|
|
12
31
|
fa_class: fa fa-cloud-download-alt
|
|
13
32
|
target: _blank
|
|
14
33
|
url: https://github.com/OWASP/threat-dragon/releases
|
|
15
34
|
|
|
16
|
-
-
|
|
35
|
+
- tooltip: Visit us on GitHub
|
|
17
36
|
fa_class: fab fa-github
|
|
18
37
|
target: _blank
|
|
19
38
|
url: https://github.com/OWASP/threat-dragon
|
data/_includes/head.html
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
|
|
2
2
|
<head>
|
|
3
|
-
<title>{{ page.title }}</title>
|
|
3
|
+
<title>{{ page.title }}{% if site.title %} | {{ site.title }}{% endif %}</title>
|
|
4
4
|
|
|
5
|
-
<meta charset="utf-8"
|
|
6
|
-
<meta name="
|
|
5
|
+
<meta charset="utf-8">
|
|
6
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
7
|
+
<meta name="color-scheme" content="light dark">
|
|
7
8
|
<link rel="shortcut icon" href="{{ site.faviconUrl | relative_url }}" type="image/x-icon">
|
|
8
9
|
<link rel="icon" href="{{ site.faviconUrl | relative_url }}" type="image/x-icon">
|
|
9
10
|
<script src="{{ '/assets/js/theme.js' | relative_url }}"></script>
|
data/_includes/home_links.html
CHANGED
|
@@ -3,12 +3,12 @@
|
|
|
3
3
|
<div class="col">
|
|
4
4
|
<div class="jumbotron">
|
|
5
5
|
<div class="text-center">
|
|
6
|
-
<a href="{{ link.relative_url | relative_url }}">
|
|
7
|
-
<i class="{{ link.fa_class }} fa-4x"></i>
|
|
6
|
+
<a href="{{ link.relative_url | relative_url }}" aria-label="{{ link.description | default: link.relative_url }}">
|
|
7
|
+
<i class="{{ link.fa_class }} fa-4x" aria-hidden="true"></i>
|
|
8
8
|
</a>
|
|
9
9
|
<p class="mt-4">{{ link.description }}</p>
|
|
10
10
|
</div>
|
|
11
11
|
</div>
|
|
12
12
|
</div>
|
|
13
13
|
{%- endfor -%}
|
|
14
|
-
</div>
|
|
14
|
+
</div>
|
data/_includes/navbar.html
CHANGED
|
@@ -1,40 +1,160 @@
|
|
|
1
1
|
<nav class="navbar navbar-expand-md navbar-dark bg-primary">
|
|
2
|
-
|
|
2
|
+
{%- assign search_text = site.search.text -%}
|
|
3
|
+
{%- assign search_tooltip = site.search.tooltip -%}
|
|
4
|
+
{%- assign search_label = search_tooltip | default: search_text | default: 'Search documentation' -%}
|
|
5
|
+
<button class="navbar-toggler d-md-none" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
|
3
6
|
<span class="navbar-toggler-icon"></span>
|
|
4
7
|
</button>
|
|
5
8
|
<a class="navbar-brand" href="{{ '/' | relative_url }}">
|
|
6
9
|
{{ site.brand }}
|
|
7
10
|
</a>
|
|
11
|
+
<button
|
|
12
|
+
class="nav-link theme-toggle td-mobile-theme-toggle d-md-none ms-auto"
|
|
13
|
+
type="button"
|
|
14
|
+
data-theme-toggle
|
|
15
|
+
data-theme-tooltip-dark="{{ site.theme_toggle.dark_tooltip | default: 'Switch to dark mode' }}"
|
|
16
|
+
data-theme-tooltip-light="{{ site.theme_toggle.light_tooltip | default: 'Switch to light mode' }}"
|
|
17
|
+
aria-label="Switch to dark mode"
|
|
18
|
+
title="Switch to dark mode">
|
|
19
|
+
<i class="fas fa-moon theme-toggle-icon" aria-hidden="true"></i>
|
|
20
|
+
<span class="visually-hidden" data-theme-toggle-label>Switch to dark mode</span>
|
|
21
|
+
</button>
|
|
8
22
|
<div class="collapse navbar-collapse" id="navbarNavDropdown">
|
|
9
|
-
<ul class="navbar-nav ms-auto">
|
|
23
|
+
<ul class="navbar-nav ms-auto d-none d-md-flex">
|
|
24
|
+
<li class="nav-item">
|
|
25
|
+
<button
|
|
26
|
+
class="nav-link active"
|
|
27
|
+
type="button"
|
|
28
|
+
data-bs-toggle="modal"
|
|
29
|
+
data-bs-target="#tdSearchModal"
|
|
30
|
+
aria-label="{{ search_label }}"
|
|
31
|
+
{% if search_tooltip %}title="{{ search_tooltip }}" data-bs-toggle-tooltip="tooltip" data-bs-placement="bottom"{% endif %}>
|
|
32
|
+
<i class="fas fa-search fa-lg" aria-hidden="true"></i>
|
|
33
|
+
{%- if search_text and search_text != '' -%} {{ search_text }}{%- else -%}<span class="visually-hidden">Search</span>{%- endif -%}
|
|
34
|
+
</button>
|
|
35
|
+
</li>
|
|
10
36
|
{%- for navlink in site.header_links -%}
|
|
11
37
|
<li class="nav-item">
|
|
12
38
|
<a href="{{ navlink.url }}"
|
|
13
|
-
{% if navlink.target %} target="{{ navlink.target }}" rel="noopener noreferrer"{
|
|
14
|
-
class="nav-link active"
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
39
|
+
{% if navlink.target %} target="{{ navlink.target }}" rel="noopener noreferrer"{% endif %}
|
|
40
|
+
class="nav-link active"
|
|
41
|
+
{% if navlink.tooltip or navlink.text %}aria-label="{{ navlink.tooltip | default: navlink.text }}"{% endif %}
|
|
42
|
+
{% if navlink.tooltip %}title="{{ navlink.tooltip }}" data-bs-toggle-tooltip="tooltip" data-bs-placement="bottom"{% endif %}>
|
|
43
|
+
{%- if navlink.fa_class -%}
|
|
44
|
+
<i class="{{ navlink.fa_class }} fa-lg" aria-hidden="true"></i>
|
|
45
|
+
{%- endif -%}
|
|
46
|
+
{%- if navlink.text and navlink.text != '' -%} {{ navlink.text }}{%- endif -%}
|
|
18
47
|
</a>
|
|
19
48
|
</li>
|
|
20
49
|
{%- endfor -%}
|
|
21
|
-
|
|
22
|
-
<!-- Sidebars do not work well on smaller devices. We want to fall back to a more traditional expanding button navigation -->
|
|
23
|
-
<li class="nav-item dropdown d-sm-block d-md-none">
|
|
24
|
-
<a class="nav-link dropdown-toggle" href="#" id="smallerscreenmenu" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Menu </a>
|
|
25
|
-
<div class="dropdown-menu" aria-labelledby="smallerscreenmenu">
|
|
26
|
-
{%- for navPage in site.pages | where: "path" -%}
|
|
27
|
-
<a class="dropdown-item" href="{{ navPage.url || relative_url }}">{{ navPage.title }}</a>
|
|
28
|
-
{%- endfor -%}
|
|
29
|
-
</div>
|
|
30
|
-
</li>
|
|
31
50
|
<li class="nav-item">
|
|
32
|
-
|
|
51
|
+
{%- assign theme_toggle_text = site.theme_toggle.text -%}
|
|
52
|
+
<button
|
|
53
|
+
class="nav-link theme-toggle"
|
|
54
|
+
type="button"
|
|
55
|
+
data-theme-toggle
|
|
56
|
+
data-theme-tooltip-dark="{{ site.theme_toggle.dark_tooltip | default: 'Switch to dark mode' }}"
|
|
57
|
+
data-theme-tooltip-light="{{ site.theme_toggle.light_tooltip | default: 'Switch to light mode' }}"
|
|
58
|
+
aria-label="Switch to dark mode"
|
|
59
|
+
title="Switch to dark mode"
|
|
60
|
+
{% if site.theme_toggle.dark_tooltip or site.theme_toggle.light_tooltip %}data-bs-toggle-tooltip="tooltip" data-bs-placement="bottom"{% endif %}>
|
|
33
61
|
<i class="fas fa-moon theme-toggle-icon" aria-hidden="true"></i>
|
|
34
|
-
|
|
62
|
+
{%- if theme_toggle_text and theme_toggle_text != '' -%}
|
|
63
|
+
<span class="theme-toggle-text">{{ theme_toggle_text }}</span>
|
|
64
|
+
{%- endif -%}
|
|
35
65
|
<span class="visually-hidden" data-theme-toggle-label>Switch to dark mode</span>
|
|
36
66
|
</button>
|
|
37
67
|
</li>
|
|
38
68
|
</ul>
|
|
69
|
+
<div class="td-mobile-menu d-md-none">
|
|
70
|
+
<div class="td-mobile-menu-panel">
|
|
71
|
+
<a class="td-mobile-menu-link{% if page.url == '/' %} active{%- endif -%}" href="{{ '/' | relative_url }}">
|
|
72
|
+
<span class="td-mobile-menu-icon"><i class="fas fa-home" aria-hidden="true"></i></span>
|
|
73
|
+
<span class="td-mobile-menu-text">Home</span>
|
|
74
|
+
</a>
|
|
75
|
+
<button
|
|
76
|
+
class="td-mobile-menu-link td-mobile-menu-button"
|
|
77
|
+
type="button"
|
|
78
|
+
data-bs-toggle="modal"
|
|
79
|
+
data-bs-target="#tdSearchModal"
|
|
80
|
+
aria-label="{{ search_label }}">
|
|
81
|
+
<span class="td-mobile-menu-icon"><i class="fas fa-search" aria-hidden="true"></i></span>
|
|
82
|
+
<span class="td-mobile-menu-text">{{ search_text | default: 'Search' }}</span>
|
|
83
|
+
</button>
|
|
84
|
+
{%- if site.header_links and site.header_links.size > 0 -%}
|
|
85
|
+
<button
|
|
86
|
+
class="td-mobile-menu-link td-mobile-menu-button td-mobile-menu-toggle"
|
|
87
|
+
type="button"
|
|
88
|
+
data-bs-toggle="collapse"
|
|
89
|
+
data-bs-target="#mobile-project-links"
|
|
90
|
+
aria-expanded="false"
|
|
91
|
+
aria-controls="mobile-project-links">
|
|
92
|
+
<span class="td-mobile-menu-icon"><i class="fas fa-link" aria-hidden="true"></i></span>
|
|
93
|
+
<span class="td-mobile-menu-text">Project Links</span>
|
|
94
|
+
<span class="td-mobile-menu-caret fa fa-caret-down" aria-hidden="true"></span>
|
|
95
|
+
</button>
|
|
96
|
+
<div id="mobile-project-links" class="collapse td-mobile-menu-section">
|
|
97
|
+
{%- for navlink in site.header_links -%}
|
|
98
|
+
<a href="{{ navlink.url }}"
|
|
99
|
+
{% if navlink.target %} target="{{ navlink.target }}" rel="noopener noreferrer"{% endif %}
|
|
100
|
+
class="td-mobile-menu-link td-mobile-menu-sublink"
|
|
101
|
+
aria-label="{{ navlink.tooltip | default: navlink.text | default: navlink.url }}{% if navlink.target %} (opens in new tab){% endif %}">
|
|
102
|
+
<span class="td-mobile-menu-icon">
|
|
103
|
+
{%- if navlink.fa_class -%}
|
|
104
|
+
<i class="{{ navlink.fa_class }}" aria-hidden="true"></i>
|
|
105
|
+
{%- endif -%}
|
|
106
|
+
</span>
|
|
107
|
+
<span class="td-mobile-menu-text">{{ navlink.text | default: navlink.tooltip | default: navlink.url }}</span>
|
|
108
|
+
<span class="td-mobile-menu-meta" aria-hidden="true">
|
|
109
|
+
<i class="fas fa-external-link-alt"></i>
|
|
110
|
+
</span>
|
|
111
|
+
</a>
|
|
112
|
+
{%- endfor -%}
|
|
113
|
+
</div>
|
|
114
|
+
{%- endif -%}
|
|
115
|
+
{%- for category in site.nav.categories -%}
|
|
116
|
+
{%- assign categoryActive = false -%}
|
|
117
|
+
{%- for group in category.groups -%}
|
|
118
|
+
{%- assign categoryPages = site.pages | where_exp: "navPage", "navPage.group == group.name" -%}
|
|
119
|
+
{%- assign categoryActiveCount = categoryPages | where_exp: "groupPage", "groupPage.url == page.url" | size -%}
|
|
120
|
+
{%- if categoryActiveCount > 0 -%}
|
|
121
|
+
{%- assign categoryActive = true -%}
|
|
122
|
+
{%- endif -%}
|
|
123
|
+
{%- endfor -%}
|
|
124
|
+
{%- capture mobileCategoryId -%}mobile-category-{{ forloop.index }}{%- endcapture -%}
|
|
125
|
+
<button
|
|
126
|
+
class="td-mobile-menu-link td-mobile-menu-button td-mobile-menu-toggle{% if categoryActive %} active{%- endif -%}"
|
|
127
|
+
type="button"
|
|
128
|
+
data-bs-toggle="collapse"
|
|
129
|
+
data-bs-target="#{{ mobileCategoryId }}"
|
|
130
|
+
aria-expanded="false"
|
|
131
|
+
aria-controls="{{ mobileCategoryId }}">
|
|
132
|
+
<span class="td-mobile-menu-icon"><i class="fas fa-folder" aria-hidden="true"></i></span>
|
|
133
|
+
<span class="td-mobile-menu-text">{{ category.name }}</span>
|
|
134
|
+
<span class="td-mobile-menu-caret fa fa-caret-down" aria-hidden="true"></span>
|
|
135
|
+
</button>
|
|
136
|
+
<div id="{{ mobileCategoryId }}" class="collapse td-mobile-menu-section">
|
|
137
|
+
{%- for group in category.groups -%}
|
|
138
|
+
{%- assign pages = site.pages | where_exp: "navPage", "navPage.group == group.name" | sort: "nav_order" -%}
|
|
139
|
+
{%- assign activeCount = pages | where_exp: "groupPage", "groupPage.url == page.url" | size -%}
|
|
140
|
+
{%- if pages.size == 1 -%}
|
|
141
|
+
<a class="td-mobile-menu-link td-mobile-menu-sublink{% if activeCount > 0 %} active{%- endif -%}" href="{{ pages.first.url | relative_url }}">
|
|
142
|
+
<span class="td-mobile-menu-icon"><i class="{{ group.fa_class }}" aria-hidden="true"></i></span>
|
|
143
|
+
<span class="td-mobile-menu-text">{{ group.name }}</span>
|
|
144
|
+
</a>
|
|
145
|
+
{%- elsif pages.size > 1 -%}
|
|
146
|
+
<div class="td-mobile-menu-group-label{% if activeCount > 0 %} active{%- endif -%}">
|
|
147
|
+
<span class="td-mobile-menu-icon"><i class="{{ group.fa_class }}" aria-hidden="true"></i></span>
|
|
148
|
+
<span class="td-mobile-menu-text">{{ group.name }}</span>
|
|
149
|
+
</div>
|
|
150
|
+
{%- for navPage in pages -%}
|
|
151
|
+
<a class="td-mobile-menu-link td-mobile-menu-sublink td-mobile-menu-childlink{% if page.url == navPage.url %} active{%- endif -%}" href="{{ navPage.url | relative_url }}">{{ navPage.title }}</a>
|
|
152
|
+
{%- endfor -%}
|
|
153
|
+
{%- endif -%}
|
|
154
|
+
{%- endfor -%}
|
|
155
|
+
</div>
|
|
156
|
+
{%- endfor -%}
|
|
157
|
+
</div>
|
|
158
|
+
</div>
|
|
39
159
|
</div>
|
|
40
160
|
</nav>
|
data/_includes/scripts.html
CHANGED
|
@@ -1,2 +1,5 @@
|
|
|
1
1
|
<script src="{{ '/assets/js/bootstrap.bundle.min.js' | relative_url }}"></script>
|
|
2
|
+
<script src="{{ '/assets/js/mobile-nav.js' | relative_url }}"></script>
|
|
2
3
|
<script src="{{ '/assets/js/sidebar.js' | relative_url }}"></script>
|
|
4
|
+
<script src="{{ '/assets/js/search.js' | relative_url }}"></script>
|
|
5
|
+
<script src="{{ '/assets/js/tooltips.js' | relative_url }}"></script>
|
data/_includes/sidebar.html
CHANGED
|
@@ -14,42 +14,62 @@
|
|
|
14
14
|
|
|
15
15
|
<!-- TODO: Catpure groupActive and linkActive to apply classes and data props -->
|
|
16
16
|
{%- if pages.size == 1 -%}
|
|
17
|
+
<li class="sidebar-nav-item">
|
|
17
18
|
<a href="{{ pages | map: 'url' | first | relative_url }}"
|
|
18
|
-
class="bg-dark list-group-item list-group-item-action {% if activeCount > 0 %} active{%- endif -%}"
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
19
|
+
class="bg-dark list-group-item list-group-item-action {% if activeCount > 0 %} active{%- endif -%}"
|
|
20
|
+
data-sidebar-item="true"
|
|
21
|
+
data-bs-toggle-tooltip="tooltip"
|
|
22
|
+
data-bs-placement="right"
|
|
23
|
+
title="{{ group.name }}"
|
|
24
|
+
aria-label="{{ group.name }}">
|
|
25
|
+
<span class="d-flex w-100 justify-content-start align-items-center">
|
|
26
|
+
<span class="{{ group.fa_class }} fa-fw me-3" aria-hidden="true"></span>
|
|
27
|
+
<span class="menu-collapsed sidebar-link-label">{{ group.name }}</span>
|
|
28
|
+
</span>
|
|
23
29
|
</a>
|
|
30
|
+
</li>
|
|
24
31
|
{%- else -%}
|
|
25
|
-
|
|
32
|
+
<li class="sidebar-nav-item">
|
|
33
|
+
<button
|
|
34
|
+
type="button"
|
|
26
35
|
data-bs-toggle="collapse"
|
|
36
|
+
data-bs-target="#{{ submenuId }}"
|
|
37
|
+
aria-controls="{{ submenuId }}"
|
|
27
38
|
aria-expanded="{%- if activeCount > 0 -%}true{%- else -%}false{%- endif -%}"
|
|
28
|
-
class="bg-dark list-group-item list-group-item-action grou-nav flex-column align-items-start {% if activeCount > 0 %} active{%- endif -%}"
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
39
|
+
class="bg-dark list-group-item list-group-item-action grou-nav flex-column align-items-start w-100 {% if activeCount > 0 %} active{%- endif -%}"
|
|
40
|
+
data-sidebar-item="true"
|
|
41
|
+
data-sidebar-submenu="{{ submenuId }}"
|
|
42
|
+
data-bs-toggle-tooltip="tooltip"
|
|
43
|
+
data-bs-placement="right"
|
|
44
|
+
title="{{ group.name }}"
|
|
45
|
+
aria-label="{{ group.name }}">
|
|
46
|
+
<span class="d-flex w-100 justify-content-start align-items-center">
|
|
47
|
+
<span class="{{ group.fa_class }} fa-fw me-3" aria-hidden="true"></span>
|
|
48
|
+
<span class="menu-collapsed sidebar-link-label">{{ group.name }}</span>
|
|
49
|
+
<span class="submenu-icon ms-auto submenu-expand fa fa-caret-down" aria-hidden="true"></span>
|
|
50
|
+
<span class="submenu-icon ms-auto submenu-collapse fa fa-caret-up" aria-hidden="true"></span>
|
|
51
|
+
</span>
|
|
52
|
+
</button>
|
|
53
|
+
<div id="{{ submenuId }}" class="{%- if activeCount == 0 -%}collapse{%- endif %} sidebar-submenu">
|
|
37
54
|
{%- for navPage in pages -%}
|
|
38
55
|
<a href="{{ navPage.url | relative_url }}"
|
|
39
56
|
class="list-group-item list-group-item-action bg-dark text-white {% if page.url == navPage.url %} active{%- endif -%}">
|
|
40
|
-
<span class="menu-collapsed">{{ navPage.title }}</span>
|
|
57
|
+
<span class="menu-collapsed sidebar-link-label">{{ navPage.title }}</span>
|
|
41
58
|
</a>
|
|
42
59
|
{%- endfor -%}
|
|
43
60
|
</div>
|
|
61
|
+
</li>
|
|
44
62
|
{%- endif -%}
|
|
45
63
|
{%- endfor -%}
|
|
46
64
|
{%- endfor -%}
|
|
47
65
|
|
|
48
|
-
<
|
|
49
|
-
|
|
50
|
-
|
|
66
|
+
<li class="sidebar-nav-item">
|
|
67
|
+
<button type="button" data-sidebar-toggle="collapse" class="bg-dark list-group-item list-group-item-action d-flex align-items-center w-100" data-bs-toggle-tooltip="tooltip" data-bs-placement="right" title="Toggle sidebar" aria-label="Toggle sidebar">
|
|
68
|
+
<span class="d-flex w-100 justify-content-start align-items-center">
|
|
69
|
+
<span id="collapse-icon" class="fa fa-angle-left fa-2x me-3" aria-hidden="true"></span>
|
|
51
70
|
<span id="collapse-text" class="menu-collapsed">Collapse</span>
|
|
52
|
-
</
|
|
53
|
-
</
|
|
71
|
+
</span>
|
|
72
|
+
</button>
|
|
73
|
+
</li>
|
|
54
74
|
</ul>
|
|
55
75
|
</div>
|
data/_layouts/default.html
CHANGED
|
@@ -1,15 +1,51 @@
|
|
|
1
|
-
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="{{ site.lang | default: 'en' }}" data-baseurl="{{ '' | relative_url }}">
|
|
2
3
|
{% include head.html %}
|
|
3
4
|
<body>
|
|
5
|
+
<a class="visually-hidden-focusable" href="#main-content">Skip to main content</a>
|
|
4
6
|
{% include navbar.html %}
|
|
5
7
|
<div id="body-row" class="row">
|
|
6
8
|
{% include sidebar.html %}
|
|
7
|
-
<
|
|
9
|
+
<main id="main-content" class="col">
|
|
8
10
|
<div class="container-fluid mt-2">
|
|
9
11
|
{{ content }}
|
|
10
12
|
</div>
|
|
13
|
+
</main>
|
|
14
|
+
</div>
|
|
15
|
+
<div class="modal fade td-search-modal" id="tdSearchModal" tabindex="-1" aria-labelledby="tdSearchModalLabel" data-search>
|
|
16
|
+
<div class="modal-dialog modal-dialog-centered modal-lg modal-dialog-scrollable">
|
|
17
|
+
<div class="modal-content">
|
|
18
|
+
<div class="modal-header">
|
|
19
|
+
<h2 class="modal-title fs-5" id="tdSearchModalLabel">Search documentation</h2>
|
|
20
|
+
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
21
|
+
</div>
|
|
22
|
+
<div class="modal-body">
|
|
23
|
+
<label class="visually-hidden" for="td-doc-search">Search documentation</label>
|
|
24
|
+
<div class="td-search-input-wrap">
|
|
25
|
+
<i class="fas fa-search td-search-input-icon" aria-hidden="true"></i>
|
|
26
|
+
<input
|
|
27
|
+
id="td-doc-search"
|
|
28
|
+
class="form-control td-search-input"
|
|
29
|
+
type="search"
|
|
30
|
+
placeholder="{{ site.search.placeholder | default: 'Search docs' }}"
|
|
31
|
+
autocomplete="off"
|
|
32
|
+
spellcheck="false"
|
|
33
|
+
data-search-input
|
|
34
|
+
aria-describedby="td-doc-search-help"
|
|
35
|
+
aria-expanded="false"
|
|
36
|
+
aria-controls="td-doc-search-results">
|
|
37
|
+
</div>
|
|
38
|
+
<div id="td-doc-search-help" class="form-text">Type at least two characters to search documentation pages.</div>
|
|
39
|
+
<div
|
|
40
|
+
id="td-doc-search-results"
|
|
41
|
+
class="td-search-results"
|
|
42
|
+
data-search-results
|
|
43
|
+
hidden>
|
|
44
|
+
</div>
|
|
45
|
+
</div>
|
|
46
|
+
</div>
|
|
11
47
|
</div>
|
|
12
|
-
{% include scripts.html %}
|
|
13
48
|
</div>
|
|
49
|
+
{% include scripts.html %}
|
|
14
50
|
</body>
|
|
15
51
|
</html>
|
data/_layouts/home.html
CHANGED
|
@@ -7,7 +7,7 @@ layout: default
|
|
|
7
7
|
<div class="row">
|
|
8
8
|
{%- if site.logo_src -%}
|
|
9
9
|
<div class="col col-md-3 text-end">
|
|
10
|
-
<img class="home-logo" src="{{ site.logo_src }}"
|
|
10
|
+
<img class="home-logo" src="{{ site.logo_src }}" alt="{{ site.brand | default: site.title | default: 'Site logo' }}">
|
|
11
11
|
</div>
|
|
12
12
|
{%- endif -%}
|
|
13
13
|
<div class="col col-md-9 text-start">
|