fni-docs-theme 0.6.2 → 0.6.4
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/_layouts/default.html +14 -0
- data/_sass/content.scss +11 -3
- data/_sass/custom/custom.scss +206 -0
- data/_sass/layout.scss +134 -2
- data/_sass/navigation.scss +18 -0
- data/_sass/support/mixins/_buttons.scss +1 -1
- data/_sass/vendor/normalize.scss/normalize.scss +4 -2
- data/assets/js/jtd-nav.js +24 -22
- data/assets/js/just-the-docs.js +108 -9
- data/assets/js/links.js +6 -7
- data/assets/js/plantuml.js +19 -19
- metadata +3 -7
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 5da153deee1782c2f6ea5f63ef757b28dfc09efa7e0f4e6f8dfb72915a838d21
|
4
|
+
data.tar.gz: 94097ecbd14efbfdb0f6aa2f158ab69a7f5fb1950ba4b98c8397d424d1d32895
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 968ac6ee68c5b97311e7632abb2802194cdc879be641e22f8833a115328237e6ff5b3c1b7c542cc2034d9f0b7114c012a51de54891faef89761d1248209adf50
|
7
|
+
data.tar.gz: af9906fdec4ae17b3e12de632541a6c5082929631ca825d406adc05b9322e35fbdc1fcf558d29eaacc18ab575b90c80941b8ae08aaacbba3fed7ce4e7c5988c1
|
data/_layouts/default.html
CHANGED
@@ -38,14 +38,28 @@ layout: table_wrappers
|
|
38
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
39
|
</svg>
|
40
40
|
</symbol>
|
41
|
+
<symbol id="svg-close" viewBox="0 0 24 24">
|
42
|
+
<title>Close</title>
|
43
|
+
<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-x">
|
44
|
+
<line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line>
|
45
|
+
</svg>
|
46
|
+
</symbol>
|
41
47
|
</svg>
|
42
48
|
|
43
49
|
<div class="side-bar">
|
44
50
|
<div class="site-header">
|
45
51
|
<a href="{{ '/' | absolute_url }}" class="site-title lh-tight">{% include_cached title.html %}</a>
|
52
|
+
{% if site.search_enabled != false %}
|
53
|
+
<a href="#" id="mobile-search-button" class="site-button mobile-search-button">
|
54
|
+
<svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-search"></use></svg>
|
55
|
+
</a>
|
56
|
+
{% endif %}
|
46
57
|
<a href="#" id="menu-button" class="site-button">
|
47
58
|
<svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-menu"></use></svg>
|
48
59
|
</a>
|
60
|
+
<a href="#" id="close-button" class="site-button close-button">
|
61
|
+
<svg viewBox="0 0 24 24" class="icon"><use xlink:href="#svg-close"></use></svg>
|
62
|
+
</a>
|
49
63
|
</div>
|
50
64
|
<nav role="navigation" aria-label="Main" id="site-nav" class="site-nav" data-page-url="{{ page.url }}" data-page-parent="{{ page.parent }}" data-page-grand-parent="{{ page.grand_parent }}">
|
51
65
|
{% if site.just_the_docs.collections %}
|
data/_sass/content.scss
CHANGED
@@ -19,9 +19,17 @@
|
|
19
19
|
}
|
20
20
|
|
21
21
|
a {
|
22
|
-
overflow:
|
23
|
-
text-overflow:
|
24
|
-
|
22
|
+
overflow: visible;
|
23
|
+
text-overflow: unset;
|
24
|
+
word-wrap: break-word;
|
25
|
+
white-space: normal;
|
26
|
+
vertical-align: baseline;
|
27
|
+
}
|
28
|
+
|
29
|
+
// Better readability on mobile
|
30
|
+
@media (max-width: #{$content-width - 1}) {
|
31
|
+
font-size: 16px;
|
32
|
+
line-height: 1.6;
|
25
33
|
}
|
26
34
|
|
27
35
|
ul,
|
data/_sass/custom/custom.scss
CHANGED
@@ -0,0 +1,206 @@
|
|
1
|
+
// Custom styles for FNI Docs Theme
|
2
|
+
|
3
|
+
// Mobile Navigation Fixes
|
4
|
+
@media (max-width: #{$content-width - 1}) {
|
5
|
+
// Fix mobile header
|
6
|
+
.site-header {
|
7
|
+
position: relative;
|
8
|
+
height: 3.5rem;
|
9
|
+
min-height: 3.5rem;
|
10
|
+
}
|
11
|
+
|
12
|
+
// Fix site title on mobile
|
13
|
+
.site-title {
|
14
|
+
padding-right: $sp-8; // Make room for buttons
|
15
|
+
font-size: 1.125rem;
|
16
|
+
}
|
17
|
+
|
18
|
+
// Mobile navigation button styles
|
19
|
+
.site-button {
|
20
|
+
position: absolute;
|
21
|
+
top: 0;
|
22
|
+
right: 0;
|
23
|
+
z-index: 101;
|
24
|
+
display: flex !important;
|
25
|
+
align-items: center;
|
26
|
+
justify-content: center;
|
27
|
+
width: 3.5rem;
|
28
|
+
height: 3.5rem;
|
29
|
+
padding: 0;
|
30
|
+
background: transparent;
|
31
|
+
border: 0;
|
32
|
+
}
|
33
|
+
|
34
|
+
// Hide close button by default
|
35
|
+
.close-button {
|
36
|
+
display: none !important;
|
37
|
+
}
|
38
|
+
|
39
|
+
// When nav is open
|
40
|
+
.nav-open {
|
41
|
+
.site-button {
|
42
|
+
display: none !important;
|
43
|
+
}
|
44
|
+
|
45
|
+
.close-button {
|
46
|
+
position: absolute;
|
47
|
+
top: 50%;
|
48
|
+
right: $gutter-spacing-sm;
|
49
|
+
z-index: 1001;
|
50
|
+
display: flex !important;
|
51
|
+
align-items: center;
|
52
|
+
justify-content: center;
|
53
|
+
width: 2.5rem;
|
54
|
+
height: 2.5rem;
|
55
|
+
padding: 0;
|
56
|
+
background: transparent;
|
57
|
+
border: 0;
|
58
|
+
transform: translateY(-50%);
|
59
|
+
|
60
|
+
&:hover {
|
61
|
+
background: rgba($body-text-color, 0.1);
|
62
|
+
border-radius: $border-radius;
|
63
|
+
}
|
64
|
+
}
|
65
|
+
}
|
66
|
+
|
67
|
+
// Fix navigation padding and spacing
|
68
|
+
.site-nav {
|
69
|
+
padding: $sp-3 0;
|
70
|
+
}
|
71
|
+
|
72
|
+
// Ensure navigation items don't overlap
|
73
|
+
.nav-list-link {
|
74
|
+
display: flex;
|
75
|
+
align-items: center;
|
76
|
+
width: 100%;
|
77
|
+
min-height: 44px;
|
78
|
+
padding: $sp-3 $gutter-spacing-sm;
|
79
|
+
text-decoration: none;
|
80
|
+
word-wrap: break-word;
|
81
|
+
white-space: normal;
|
82
|
+
transition: background-color 0.2s ease;
|
83
|
+
|
84
|
+
&:hover,
|
85
|
+
&.active {
|
86
|
+
background-color: rgba($feedback-color, 0.1);
|
87
|
+
background-image: none;
|
88
|
+
}
|
89
|
+
}
|
90
|
+
|
91
|
+
// Fix child navigation items
|
92
|
+
.nav-list-item > .nav-list .nav-list-link {
|
93
|
+
padding-left: $sp-6;
|
94
|
+
}
|
95
|
+
|
96
|
+
// Fix expander positioning and styling
|
97
|
+
.nav-list-expander {
|
98
|
+
position: absolute;
|
99
|
+
top: 0;
|
100
|
+
right: 0;
|
101
|
+
display: flex;
|
102
|
+
align-items: center;
|
103
|
+
justify-content: center;
|
104
|
+
width: 44px;
|
105
|
+
height: 44px;
|
106
|
+
padding: 0;
|
107
|
+
cursor: pointer;
|
108
|
+
background: transparent;
|
109
|
+
border: 0;
|
110
|
+
|
111
|
+
&:hover {
|
112
|
+
background-color: rgba($feedback-color, 0.1);
|
113
|
+
background-image: none;
|
114
|
+
}
|
115
|
+
}
|
116
|
+
|
117
|
+
// Clean up active state
|
118
|
+
.nav-list-item.active > .nav-list-expander .icon {
|
119
|
+
transform: rotate(90deg);
|
120
|
+
}
|
121
|
+
|
122
|
+
// Ensure proper contrast in dark mode
|
123
|
+
.nav-list-item {
|
124
|
+
.nav-list-link {
|
125
|
+
color: $body-text-color;
|
126
|
+
}
|
127
|
+
|
128
|
+
.nav-list-link:hover,
|
129
|
+
.nav-list-link.active {
|
130
|
+
color: $body-heading-color;
|
131
|
+
}
|
132
|
+
}
|
133
|
+
|
134
|
+
// Better spacing for footer
|
135
|
+
.site-footer {
|
136
|
+
padding: $sp-3;
|
137
|
+
font-size: 0.75rem;
|
138
|
+
text-align: center;
|
139
|
+
}
|
140
|
+
|
141
|
+
// Remove gradient backgrounds
|
142
|
+
.nav-list-link,
|
143
|
+
.nav-list-expander,
|
144
|
+
.site-button {
|
145
|
+
background-image: none !important;
|
146
|
+
}
|
147
|
+
|
148
|
+
// Fix table spacing on mobile
|
149
|
+
.table-wrapper {
|
150
|
+
margin-right: 0;
|
151
|
+
margin-left: 0;
|
152
|
+
}
|
153
|
+
|
154
|
+
// Ensure proper content padding on mobile
|
155
|
+
.main-content {
|
156
|
+
padding-right: $gutter-spacing-sm;
|
157
|
+
padding-left: $gutter-spacing-sm;
|
158
|
+
}
|
159
|
+
}
|
160
|
+
|
161
|
+
// Fix button text cutoff globally
|
162
|
+
.btn {
|
163
|
+
display: inline-flex !important;
|
164
|
+
align-items: center !important;
|
165
|
+
justify-content: center !important;
|
166
|
+
min-height: 2.5em !important;
|
167
|
+
box-sizing: border-box !important;
|
168
|
+
padding: 0.5em 1em !important;
|
169
|
+
margin: 0.25em !important;
|
170
|
+
overflow: visible !important;
|
171
|
+
font-size: inherit !important;
|
172
|
+
line-height: 1.5 !important;
|
173
|
+
text-align: center !important;
|
174
|
+
text-overflow: clip !important;
|
175
|
+
white-space: nowrap !important;
|
176
|
+
vertical-align: middle !important;
|
177
|
+
|
178
|
+
// Override any conflicting styles
|
179
|
+
&:not(.btn-sm):not(.btn-xs):not(.btn-lg) {
|
180
|
+
padding-top: 0.5em !important;
|
181
|
+
padding-bottom: 0.5em !important;
|
182
|
+
}
|
183
|
+
}
|
184
|
+
|
185
|
+
// Fix main content text cutoff
|
186
|
+
.main-content {
|
187
|
+
overflow-wrap: break-word;
|
188
|
+
word-wrap: break-word;
|
189
|
+
|
190
|
+
// Fix inline links display - removed due to stylelint restrictions
|
191
|
+
}
|
192
|
+
|
193
|
+
// Ensure sidebar is visible on desktop
|
194
|
+
@include mq(md) {
|
195
|
+
.side-bar {
|
196
|
+
position: fixed !important;
|
197
|
+
display: flex !important;
|
198
|
+
transform: translateX(0) !important;
|
199
|
+
}
|
200
|
+
|
201
|
+
// Hide mobile nav buttons on desktop
|
202
|
+
.site-button,
|
203
|
+
.close-button {
|
204
|
+
display: none !important;
|
205
|
+
}
|
206
|
+
}
|
data/_sass/layout.scss
CHANGED
@@ -3,7 +3,7 @@
|
|
3
3
|
//
|
4
4
|
|
5
5
|
.side-bar {
|
6
|
-
z-index:
|
6
|
+
z-index: 100;
|
7
7
|
display: flex;
|
8
8
|
flex-wrap: wrap;
|
9
9
|
background-color: $sidebar-color;
|
@@ -138,8 +138,87 @@
|
|
138
138
|
align-items: center;
|
139
139
|
}
|
140
140
|
|
141
|
+
// COMPLETE MOBILE BUTTON OVERHAUL - Force visual separation
|
142
|
+
@media (max-width: 50rem) {
|
143
|
+
.site-header {
|
144
|
+
position: relative !important;
|
145
|
+
display: flex !important;
|
146
|
+
min-height: 60px !important;
|
147
|
+
padding-right: 0 !important;
|
148
|
+
align-items: center !important;
|
149
|
+
justify-content: space-between !important;
|
150
|
+
}
|
151
|
+
|
152
|
+
.mobile-search-button {
|
153
|
+
position: absolute !important;
|
154
|
+
top: 50% !important;
|
155
|
+
right: 60px !important; // Closer to hamburger (was 80px)
|
156
|
+
z-index: 999 !important;
|
157
|
+
display: flex !important;
|
158
|
+
width: 44px !important; // Slightly smaller
|
159
|
+
height: 44px !important;
|
160
|
+
margin: 0 !important;
|
161
|
+
align-items: center !important;
|
162
|
+
justify-content: center !important;
|
163
|
+
transform: translateY(-50%) !important;
|
164
|
+
}
|
165
|
+
|
166
|
+
// Hide search button when search is active to prevent duplicate icons
|
167
|
+
.search-active .mobile-search-button {
|
168
|
+
display: none !important;
|
169
|
+
}
|
170
|
+
|
171
|
+
.site-button[id="menu-button"] {
|
172
|
+
position: absolute !important;
|
173
|
+
top: 50% !important;
|
174
|
+
right: 8px !important;
|
175
|
+
z-index: 998 !important;
|
176
|
+
display: flex !important;
|
177
|
+
width: 44px !important; // Match search button size
|
178
|
+
height: 44px !important;
|
179
|
+
margin: 0 !important;
|
180
|
+
align-items: center !important;
|
181
|
+
justify-content: center !important;
|
182
|
+
transform: translateY(-50%) !important;
|
183
|
+
}
|
184
|
+
|
185
|
+
// Hide menu button when nav is open to prevent overlap with close button
|
186
|
+
.nav-open .site-button[id="menu-button"] {
|
187
|
+
display: none !important;
|
188
|
+
}
|
189
|
+
|
190
|
+
// Close button positioning - ensure it doesn't overlap
|
191
|
+
.site-button[id="close-button"] {
|
192
|
+
position: absolute !important;
|
193
|
+
top: 50% !important;
|
194
|
+
right: 8px !important;
|
195
|
+
z-index: 1000 !important;
|
196
|
+
display: none !important; // Hidden by default
|
197
|
+
width: 44px !important;
|
198
|
+
height: 44px !important;
|
199
|
+
margin: 0 !important;
|
200
|
+
align-items: center !important;
|
201
|
+
justify-content: center !important;
|
202
|
+
transform: translateY(-50%) !important;
|
203
|
+
}
|
204
|
+
|
205
|
+
// Show close button only when nav is open
|
206
|
+
.nav-open .site-button[id="close-button"] {
|
207
|
+
display: flex !important;
|
208
|
+
}
|
209
|
+
}
|
210
|
+
|
211
|
+
// Close button positioning
|
212
|
+
.site-button[id="close-button"] {
|
213
|
+
z-index: 200 !important; // Highest for close button
|
214
|
+
order: 3;
|
215
|
+
flex-shrink: 0 !important; // Prevent shrinking
|
216
|
+
}
|
217
|
+
|
218
|
+
// This section is now handled by the media query above
|
219
|
+
|
141
220
|
@include mq(md) {
|
142
|
-
.site-header .site-button {
|
221
|
+
.site-header .site-button:not(.mobile-search-button) {
|
143
222
|
display: none;
|
144
223
|
}
|
145
224
|
}
|
@@ -197,3 +276,56 @@ body {
|
|
197
276
|
height: $sp-5;
|
198
277
|
color: $link-color;
|
199
278
|
}
|
279
|
+
|
280
|
+
// Mobile navigation with smooth animation
|
281
|
+
@media (max-width: #{$content-width - 1}) {
|
282
|
+
.site-nav {
|
283
|
+
position: fixed;
|
284
|
+
top: 0;
|
285
|
+
left: -100%;
|
286
|
+
z-index: 1000;
|
287
|
+
width: 80%;
|
288
|
+
max-width: 320px;
|
289
|
+
height: 100vh;
|
290
|
+
padding-top: $header-height;
|
291
|
+
overflow-y: auto;
|
292
|
+
background-color: $sidebar-color;
|
293
|
+
box-shadow: 2px 0 10px rgba(0, 0, 0, 0.3);
|
294
|
+
transition: left 0.3s ease-in-out;
|
295
|
+
}
|
296
|
+
}
|
297
|
+
|
298
|
+
@media (max-width: #{$content-width - 1}) {
|
299
|
+
.nav-open .site-nav {
|
300
|
+
left: 0;
|
301
|
+
}
|
302
|
+
}
|
303
|
+
|
304
|
+
// Mobile overlay
|
305
|
+
.mobile-overlay {
|
306
|
+
position: fixed;
|
307
|
+
top: 0;
|
308
|
+
right: 0;
|
309
|
+
bottom: 0;
|
310
|
+
left: 0;
|
311
|
+
z-index: 999;
|
312
|
+
display: none;
|
313
|
+
background: rgba(0, 0, 0, 0.3);
|
314
|
+
|
315
|
+
@media (max-width: #{$content-width - 1}) {
|
316
|
+
.nav-open & {
|
317
|
+
display: block;
|
318
|
+
}
|
319
|
+
}
|
320
|
+
}
|
321
|
+
|
322
|
+
// Site button hover states
|
323
|
+
@media (min-width: #{$content-width}) {
|
324
|
+
.site-button:hover {
|
325
|
+
background-image: linear-gradient(
|
326
|
+
-90deg,
|
327
|
+
rgba($feedback-color, 1) 0%,
|
328
|
+
rgba($feedback-color, 0.8) 100%
|
329
|
+
);
|
330
|
+
}
|
331
|
+
}
|
data/_sass/navigation.scss
CHANGED
@@ -9,6 +9,11 @@
|
|
9
9
|
margin-bottom: 0;
|
10
10
|
list-style: none;
|
11
11
|
|
12
|
+
// Add padding on mobile for better touch targets
|
13
|
+
@media (max-width: #{$content-width - 1}) {
|
14
|
+
padding: $sp-2 0;
|
15
|
+
}
|
16
|
+
|
12
17
|
.nav-list-item {
|
13
18
|
@include fs-4;
|
14
19
|
position: relative;
|
@@ -32,6 +37,12 @@
|
|
32
37
|
padding-left: $nav-list-item-height-sm;
|
33
38
|
}
|
34
39
|
|
40
|
+
// Fix mobile navigation padding
|
41
|
+
@media (max-width: #{$content-width - 1}) {
|
42
|
+
padding-right: $gutter-spacing-sm;
|
43
|
+
padding-left: $gutter-spacing-sm;
|
44
|
+
}
|
45
|
+
|
35
46
|
@include mq(md) {
|
36
47
|
min-height: $nav-list-item-height;
|
37
48
|
line-height: #{$nav-list-item-height - 2 * $sp-1};
|
@@ -72,6 +83,7 @@
|
|
72
83
|
padding-bottom: calc($nav-list-item-height-sm / 4);
|
73
84
|
padding-left: calc($nav-list-item-height-sm / 4);
|
74
85
|
color: $link-color;
|
86
|
+
cursor: pointer;
|
75
87
|
|
76
88
|
@include mq(md) {
|
77
89
|
width: $nav-list-item-height;
|
@@ -193,6 +205,12 @@
|
|
193
205
|
padding-left: 0;
|
194
206
|
margin-bottom: $sp-3;
|
195
207
|
list-style: none;
|
208
|
+
|
209
|
+
// Better mobile breadcrumbs
|
210
|
+
@media (max-width: #{$content-width - 1}) {
|
211
|
+
display: flex;
|
212
|
+
flex-wrap: wrap;
|
213
|
+
}
|
196
214
|
}
|
197
215
|
|
198
216
|
.breadcrumb-nav-list-item {
|
@@ -174,7 +174,8 @@ textarea {
|
|
174
174
|
*/
|
175
175
|
|
176
176
|
button,
|
177
|
-
input {
|
177
|
+
input {
|
178
|
+
/* 1 */
|
178
179
|
overflow: visible;
|
179
180
|
}
|
180
181
|
|
@@ -184,7 +185,8 @@ input { /* 1 */
|
|
184
185
|
*/
|
185
186
|
|
186
187
|
button,
|
187
|
-
select {
|
188
|
+
select {
|
189
|
+
/* 1 */
|
188
190
|
text-transform: none;
|
189
191
|
}
|
190
192
|
|
data/assets/js/jtd-nav.js
CHANGED
@@ -1,35 +1,37 @@
|
|
1
1
|
// Rather than generating a new left-nav for every page, generate a single nav and use JS to expand the current page
|
2
2
|
|
3
|
-
(function (jtd) {
|
3
|
+
;(function (jtd) {
|
4
|
+
function initNavControls() {
|
5
|
+
const siteNav = document.getElementById("site-nav")
|
4
6
|
|
5
|
-
|
6
|
-
|
7
|
+
const pageUrl = siteNav.dataset.pageUrl
|
8
|
+
const pageParent = siteNav.dataset.pageParent
|
9
|
+
const pageGrandParent = siteNav.dataset.pageGrandParent
|
7
10
|
|
8
|
-
|
9
|
-
const pageParent = siteNav.dataset.pageParent
|
10
|
-
const pageGrandParent = siteNav.dataset.pageGrandParent
|
11
|
+
console.log({ pageUrl, pageParent, pageGrandParent })
|
11
12
|
|
12
|
-
|
13
|
+
const navItems = siteNav.getElementsByClassName("nav-list-item")
|
13
14
|
|
14
|
-
|
15
|
+
for (const navItem of navItems) {
|
16
|
+
const itemUrl = navItem.dataset.url
|
17
|
+
const itemTitle = navItem.dataset.title
|
15
18
|
|
16
|
-
|
17
|
-
const itemUrl = navItem.dataset.url
|
18
|
-
const itemTitle = navItem.dataset.title
|
19
|
+
console.log({ itemUrl, itemTitle })
|
19
20
|
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
21
|
+
if (
|
22
|
+
itemUrl === pageUrl ||
|
23
|
+
itemTitle === pageParent ||
|
24
|
+
itemTitle == pageGrandParent
|
25
|
+
) {
|
26
|
+
navItem.classList.add("active")
|
27
|
+
navItem.querySelector(".nav-list-link").classList.add("active")
|
25
28
|
|
26
|
-
|
29
|
+
navItem.scrollIntoView()
|
30
|
+
}
|
27
31
|
}
|
28
32
|
}
|
29
|
-
}
|
30
|
-
|
31
|
-
jtd.onReady(function(){
|
32
|
-
initNavControls()
|
33
|
-
})
|
34
33
|
|
34
|
+
jtd.onReady(function () {
|
35
|
+
initNavControls()
|
36
|
+
})
|
35
37
|
})(window.jtd)
|
data/assets/js/just-the-docs.js
CHANGED
@@ -38,29 +38,128 @@ function initNav() {
|
|
38
38
|
const siteNav = document.getElementById('site-nav');
|
39
39
|
const mainHeader = document.getElementById('main-header');
|
40
40
|
const menuButton = document.getElementById('menu-button');
|
41
|
+
const closeButton = document.getElementById('close-button');
|
42
|
+
|
43
|
+
// Create mobile overlay
|
44
|
+
let mobileOverlay = document.querySelector('.mobile-overlay');
|
45
|
+
if (!mobileOverlay) {
|
46
|
+
mobileOverlay = document.createElement('div');
|
47
|
+
mobileOverlay.className = 'mobile-overlay';
|
48
|
+
document.body.appendChild(mobileOverlay);
|
49
|
+
}
|
41
50
|
|
42
|
-
|
43
|
-
e.preventDefault();
|
44
|
-
|
51
|
+
function toggleNav() {
|
45
52
|
if (menuButton.classList.toggle('nav-open')) {
|
46
53
|
siteNav.classList.add('nav-open');
|
47
54
|
mainHeader.classList.add('nav-open');
|
55
|
+
document.body.classList.add('nav-open');
|
56
|
+
|
57
|
+
// Clear search state when nav opens to prevent overlay conflicts
|
58
|
+
{%- if site.search_enabled != false %}
|
59
|
+
if (searchInput && document.body.classList.contains('search-active')) {
|
60
|
+
searchInput.value = '';
|
61
|
+
document.body.classList.remove('search-active');
|
62
|
+
document.documentElement.classList.remove('search-active');
|
63
|
+
mainHeader.classList.remove('nav-open');
|
64
|
+
}
|
65
|
+
{%- endif %}
|
48
66
|
} else {
|
49
67
|
siteNav.classList.remove('nav-open');
|
50
68
|
mainHeader.classList.remove('nav-open');
|
69
|
+
document.body.classList.remove('nav-open');
|
51
70
|
}
|
71
|
+
}
|
72
|
+
|
73
|
+
jtd.addEvent(menuButton, 'click', function(e){
|
74
|
+
e.preventDefault();
|
75
|
+
toggleNav();
|
52
76
|
});
|
53
77
|
|
54
|
-
|
78
|
+
if (closeButton) {
|
79
|
+
jtd.addEvent(closeButton, 'click', function(e){
|
80
|
+
e.preventDefault();
|
81
|
+
toggleNav();
|
82
|
+
});
|
83
|
+
}
|
84
|
+
|
85
|
+
// Close nav when clicking overlay
|
86
|
+
jtd.addEvent(mobileOverlay, 'click', function(e){
|
87
|
+
e.preventDefault();
|
88
|
+
if (document.body.classList.contains('nav-open')) {
|
89
|
+
toggleNav();
|
90
|
+
}
|
91
|
+
});
|
92
|
+
|
93
|
+
{%- if site.search_enabled != false %}
|
55
94
|
const searchInput = document.getElementById('search-input');
|
56
95
|
const searchButton = document.getElementById('search-button');
|
96
|
+
const mobileSearchButton = document.getElementById('mobile-search-button');
|
57
97
|
|
58
|
-
|
59
|
-
|
98
|
+
{%- if site.search.button %}
|
99
|
+
if (searchButton) {
|
100
|
+
jtd.addEvent(searchButton, 'click', function(e){
|
101
|
+
e.preventDefault();
|
60
102
|
|
61
|
-
|
62
|
-
|
63
|
-
|
103
|
+
mainHeader.classList.add('nav-open');
|
104
|
+
if (searchInput) {
|
105
|
+
searchInput.focus();
|
106
|
+
}
|
107
|
+
});
|
108
|
+
}
|
109
|
+
{%- endif %}
|
110
|
+
|
111
|
+
// Mobile search button functionality
|
112
|
+
if (mobileSearchButton) {
|
113
|
+
jtd.addEvent(mobileSearchButton, 'click', function(e){
|
114
|
+
e.preventDefault();
|
115
|
+
|
116
|
+
if (searchInput) {
|
117
|
+
mainHeader.classList.add('nav-open');
|
118
|
+
document.body.classList.add('search-active');
|
119
|
+
document.documentElement.classList.add('search-active');
|
120
|
+
searchInput.focus();
|
121
|
+
}
|
122
|
+
});
|
123
|
+
}
|
124
|
+
|
125
|
+
// Handle search input focus/blur to manage state
|
126
|
+
if (searchInput) {
|
127
|
+
jtd.addEvent(searchInput, 'focus', function(e){
|
128
|
+
document.body.classList.add('search-active');
|
129
|
+
document.documentElement.classList.add('search-active');
|
130
|
+
});
|
131
|
+
|
132
|
+
jtd.addEvent(searchInput, 'blur', function(e){
|
133
|
+
// Delay removal to allow for click events
|
134
|
+
setTimeout(function() {
|
135
|
+
if (!searchInput.value.trim()) {
|
136
|
+
document.body.classList.remove('search-active');
|
137
|
+
document.documentElement.classList.remove('search-active');
|
138
|
+
mainHeader.classList.remove('nav-open');
|
139
|
+
}
|
140
|
+
}, 150);
|
141
|
+
});
|
142
|
+
|
143
|
+
// Function to clear search state when closing nav
|
144
|
+
function clearSearchStateIfEmpty() {
|
145
|
+
if (!searchInput.value.trim()) {
|
146
|
+
document.body.classList.remove('search-active');
|
147
|
+
document.documentElement.classList.remove('search-active');
|
148
|
+
}
|
149
|
+
}
|
150
|
+
|
151
|
+
// Add search state clearing to nav close events
|
152
|
+
if (closeButton) {
|
153
|
+
jtd.addEvent(closeButton, 'click', function(e){
|
154
|
+
setTimeout(clearSearchStateIfEmpty, 50);
|
155
|
+
});
|
156
|
+
}
|
157
|
+
|
158
|
+
// Also clear search state when clicking overlay to close nav
|
159
|
+
jtd.addEvent(mobileOverlay, 'click', function(e){
|
160
|
+
setTimeout(clearSearchStateIfEmpty, 50);
|
161
|
+
});
|
162
|
+
}
|
64
163
|
{%- endif %}
|
65
164
|
}
|
66
165
|
|
data/assets/js/links.js
CHANGED
@@ -1,18 +1,17 @@
|
|
1
|
-
|
2
1
|
window.jtd.onReady(() => {
|
3
2
|
externalLinks()
|
4
3
|
})
|
5
4
|
|
6
5
|
// Find all anchor links on the page that reference external pages or static files and open them in a new tab
|
7
6
|
function externalLinks() {
|
8
|
-
const newTabExtensions = [
|
9
|
-
const links = document.getElementsByTagName(
|
7
|
+
const newTabExtensions = [".pdf", ".png", ".svg"]
|
8
|
+
const links = document.getElementsByTagName("a")
|
10
9
|
for (const link of links) {
|
11
|
-
const href = link.getAttribute(
|
10
|
+
const href = link.getAttribute("href")
|
12
11
|
if (href && link.hostname !== location.hostname) {
|
13
|
-
link.target = "_blank"
|
14
|
-
link.rel = "noopener"
|
15
|
-
} else if (href && newTabExtensions.some(ext => href.indexOf(ext) > 0)) {
|
12
|
+
link.target = "_blank"
|
13
|
+
link.rel = "noopener"
|
14
|
+
} else if (href && newTabExtensions.some((ext) => href.indexOf(ext) > 0)) {
|
16
15
|
link.onclick = function () {
|
17
16
|
window.open(this.href)
|
18
17
|
return false
|
data/assets/js/plantuml.js
CHANGED
@@ -1,4 +1,3 @@
|
|
1
|
-
|
2
1
|
window.jtd.onReady(() => {
|
3
2
|
initDiags()
|
4
3
|
})
|
@@ -8,20 +7,21 @@ async function initDiags() {
|
|
8
7
|
const defaultHeight = 400
|
9
8
|
|
10
9
|
const curPath = window.location.pathname
|
11
|
-
const diags = document.getElementsByClassName(
|
10
|
+
const diags = document.getElementsByClassName("plantuml-diagram")
|
12
11
|
|
13
12
|
for (const diag of diags) {
|
14
13
|
const src = diag.dataset.diagramSrc
|
15
|
-
const svgSrc = src.replace(
|
16
|
-
const diagCont = diag.getElementsByClassName(
|
17
|
-
const viewCont = diag.getElementsByClassName(
|
14
|
+
const svgSrc = src.replace(".iuml", ".svg")
|
15
|
+
const diagCont = diag.getElementsByClassName("plantuml-diagram-inner")[0]
|
16
|
+
const viewCont = diag.getElementsByClassName("plantuml-diagram-open")[0]
|
18
17
|
const width = diag.dataset.diagramWidth || defaultWidth
|
19
18
|
const height = diag.dataset.diagramHeight || defaultHeight
|
20
19
|
|
21
20
|
// Fetch the svg
|
22
21
|
const svgRes = await fetch(curPath + svgSrc)
|
23
22
|
if (!svgRes.ok) {
|
24
|
-
diagCont.innerHTML =
|
23
|
+
diagCont.innerHTML =
|
24
|
+
'<div class="error-msg">Failed to retrieve diagram</div>'
|
25
25
|
continue
|
26
26
|
}
|
27
27
|
|
@@ -31,11 +31,11 @@ async function initDiags() {
|
|
31
31
|
const svg = await svgRes.text()
|
32
32
|
|
33
33
|
diagCont.innerHTML = svg
|
34
|
-
const svgElement = diag.getElementsByTagName(
|
34
|
+
const svgElement = diag.getElementsByTagName("svg")[0]
|
35
35
|
|
36
36
|
svgElement.style.width = width
|
37
37
|
svgElement.style.height = height
|
38
|
-
svgElement.style.backgroundColor =
|
38
|
+
svgElement.style.backgroundColor = "#333"
|
39
39
|
|
40
40
|
const spz = svgPanZoom(svgElement, {
|
41
41
|
zoomEnabled: true,
|
@@ -44,10 +44,10 @@ async function initDiags() {
|
|
44
44
|
center: true,
|
45
45
|
dblClickZoomEnabled: false,
|
46
46
|
customEventsHandler: {
|
47
|
-
init: options => {
|
47
|
+
init: (options) => {
|
48
48
|
// Double click to toggle fullscreen
|
49
|
-
options.svgElement.addEventListener(
|
50
|
-
if (options.svgElement.style.position ===
|
49
|
+
options.svgElement.addEventListener("dblclick", () => {
|
50
|
+
if (options.svgElement.style.position === "fixed") {
|
51
51
|
options.svgElement.style.position = null
|
52
52
|
options.svgElement.style.left = null
|
53
53
|
options.svgElement.style.top = null
|
@@ -55,10 +55,10 @@ async function initDiags() {
|
|
55
55
|
options.svgElement.style.width = width
|
56
56
|
options.svgElement.style.height = height
|
57
57
|
} else {
|
58
|
-
options.svgElement.style.position =
|
59
|
-
options.svgElement.style.left =
|
60
|
-
options.svgElement.style.top =
|
61
|
-
options.svgElement.style.zIndex =
|
58
|
+
options.svgElement.style.position = "fixed"
|
59
|
+
options.svgElement.style.left = "20px"
|
60
|
+
options.svgElement.style.top = "20px"
|
61
|
+
options.svgElement.style.zIndex = "9999"
|
62
62
|
options.svgElement.style.width = getWidth() - 40
|
63
63
|
options.svgElement.style.height = getHeight() - 40
|
64
64
|
}
|
@@ -68,8 +68,8 @@ async function initDiags() {
|
|
68
68
|
options.instance.fit()
|
69
69
|
options.instance.center()
|
70
70
|
})
|
71
|
-
}
|
72
|
-
}
|
71
|
+
},
|
72
|
+
},
|
73
73
|
})
|
74
74
|
}
|
75
75
|
}
|
@@ -81,7 +81,7 @@ function getWidth() {
|
|
81
81
|
document.body.offsetWidth,
|
82
82
|
document.documentElement.offsetWidth,
|
83
83
|
document.documentElement.clientWidth
|
84
|
-
)
|
84
|
+
)
|
85
85
|
}
|
86
86
|
|
87
87
|
function getHeight() {
|
@@ -91,5 +91,5 @@ function getHeight() {
|
|
91
91
|
document.body.offsetHeight,
|
92
92
|
document.documentElement.offsetHeight,
|
93
93
|
document.documentElement.clientHeight
|
94
|
-
)
|
94
|
+
)
|
95
95
|
}
|
metadata
CHANGED
@@ -1,15 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: fni-docs-theme
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.6.
|
4
|
+
version: 0.6.4
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Patrick Marsceill
|
8
8
|
- Ken Hill
|
9
|
-
autorequire:
|
10
9
|
bindir: bin
|
11
10
|
cert_chain: []
|
12
|
-
date:
|
11
|
+
date: 1980-01-02 00:00:00.000000000 Z
|
13
12
|
dependencies:
|
14
13
|
- !ruby/object:Gem::Dependency
|
15
14
|
name: bundler
|
@@ -101,7 +100,6 @@ dependencies:
|
|
101
100
|
- - "~>"
|
102
101
|
- !ruby/object:Gem::Version
|
103
102
|
version: '3.1'
|
104
|
-
description:
|
105
103
|
email:
|
106
104
|
- patrick.marsceill@gmail.com
|
107
105
|
- rubygems@hill.ae
|
@@ -183,7 +181,6 @@ homepage: https://github.com/dealertrack/fni-docs-theme
|
|
183
181
|
licenses:
|
184
182
|
- MIT
|
185
183
|
metadata: {}
|
186
|
-
post_install_message:
|
187
184
|
rdoc_options: []
|
188
185
|
require_paths:
|
189
186
|
- lib
|
@@ -198,8 +195,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
198
195
|
- !ruby/object:Gem::Version
|
199
196
|
version: '0'
|
200
197
|
requirements: []
|
201
|
-
rubygems_version: 3.
|
202
|
-
signing_key:
|
198
|
+
rubygems_version: 3.6.9
|
203
199
|
specification_version: 4
|
204
200
|
summary: Fork of just-the-docs
|
205
201
|
test_files: []
|