web-documentation 1.0.32 → 1.0.34

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "web-documentation",
3
- "version": "1.0.32",
3
+ "version": "1.0.34",
4
4
  "description": "Declarative multilanguage documentation website generator",
5
5
  "keywords": [
6
6
  "documentation",
@@ -50,7 +50,7 @@
50
50
  "watch": "weboptimizer build --watch"
51
51
  },
52
52
  "devDependencies": {
53
- "@aws-sdk/client-s3": "^3.1064.0",
53
+ "@aws-sdk/client-s3": "^3.1065.0",
54
54
  "@babel/eslint-parser": "^7.29.7",
55
55
  "@babel/runtime": "^7.29.7",
56
56
  "@eslint/js": "^10.0.1",
@@ -104,11 +104,11 @@
104
104
  "typescript-eslint": "^8.61.0",
105
105
  "ua-parser-js": "^2.0.10",
106
106
  "unzipper": "^0.12.3",
107
- "web-component-wrapper": "^0.0.595",
108
- "web-internationalization": "^2.0.38",
107
+ "web-component-wrapper": "^0.0.596",
108
+ "web-internationalization": "^2.0.39",
109
109
  "weboptimizer": "^3.0.24",
110
110
  "webpack-dev-server": "^5.2.4",
111
- "website-utilities": "^1.0.440"
111
+ "website-utilities": "^1.0.442"
112
112
  },
113
113
  "engines": {
114
114
  "node": ">=24",
@@ -244,6 +244,7 @@
244
244
  }
245
245
  }
246
246
  },
247
+ "offline": null,
247
248
  "path": {
248
249
  "source": {
249
250
  "asset": {
package/source/index.css CHANGED
@@ -31,17 +31,26 @@ endregion */
31
31
  body {
32
32
  /* region constants */
33
33
  /** region color */
34
- --color1: #fff;
35
- --color2: #fbfbfc;
36
- --color3: #f7f7f9;
37
- --color4: #ddd;
38
- --color5: #cbcbcd;
39
- --color6: #797979;
40
- --color7: #333;
41
- --color8: #212121;
42
- --color9: black;
43
- --color10: #0090ff;
44
- --color11: #0069ba;
34
+ --background-color: white; /* pure white */
35
+ --header-background-color: #333; /* gray */
36
+ --header-background-gradient: linear-gradient(
37
+ to bottom, var(--header-background-color), var(--headline-color)
38
+ );
39
+ --header-font-color: var(--background-color);
40
+ --surface-color: #fcffff; /* blueish white */
41
+ --surface-border-color: #ddd; /* light gray */
42
+ --shadow-color: black;
43
+ --font-color: var(--header-background-color);
44
+ --headline-color: #212121; /* light black */
45
+ --link-color: #0078d4; /* blue */
46
+ --link-hover-color: #003a67; /* dark blue */
47
+ --footer-background-color: var(--surface-color);
48
+ --footer-background-gradient: linear-gradient(
49
+ to bottom, var(--background-color), var(--surface-color)
50
+ );
51
+ --footer-font-color: var(--font-color);
52
+ --footer-link-color: var(--link-color);
53
+ --footer-link-hover-color: var(--link-hover-color);
45
54
  /** endregion */
46
55
  /* endregion */
47
56
  /* region custom properties */
@@ -95,15 +104,10 @@ body {
95
104
  /* stylelint-enable at-rule-no-unknown */
96
105
  /* endregion */
97
106
  /* region global */
98
- /*
99
- NOTE: If we swap these lines to order alphabetical bodies background
100
- color does not get overwritten.
101
- */
102
- background-color: var(--color8);
103
- color: var(--color7);
107
+ color: var(--font-color);
104
108
 
105
109
  font-family: var(--wu-typography-font-family);
106
- font-size: 14px;
110
+ font-size: 19px;
107
111
 
108
112
  margin: 0;
109
113
  line-height: 1.5;
@@ -113,24 +117,69 @@ body {
113
117
  ::before {
114
118
  box-sizing: border-box;
115
119
  }
116
- /** region grid */
117
- .header__inner,
118
- .section__inner,
119
- .footer__inner {
120
+ /* endregion */
121
+ }
122
+
123
+ .wd-no-javascript {
124
+ .wu-window-loading-cover, .wd-header__inner__links__lang {
125
+ display: none;
126
+ }
127
+ }
128
+
129
+ .wu-scroll-to-top {
130
+ display: none;
131
+
132
+ font-size: 0.9rem;
133
+
134
+ right: 45px;
135
+ z-index: 4;
136
+
137
+ @media (--wu-extra-extra-small) {
138
+ @media (--wu-extra-small) {
139
+ @media (--wu-small) {
140
+ /* Bigger devices get a scroll top button. */
141
+ display: block;
142
+ }
143
+ }
144
+ }
145
+ }
146
+ /* NOTE: We need to combine with generic link color transition. */
147
+ .wd a.wu-scroll-to-top {
148
+ transition-property: bottom, opacity, color;
149
+ }
150
+
151
+ .wu-scroll-to-top.wu-scroll-up {
152
+ bottom: calc(2 * 34px);
153
+ }
154
+
155
+ .wu-scroll-to-top.wu-scroll-down {
156
+ bottom: 34px;
157
+ }
158
+
159
+ .wd {
160
+ lang-replacement,
161
+ lang-alternative:not([active]),
162
+ .wi-hide {
163
+ display: none !important;
164
+ }
165
+ /* region grid */
166
+ .wd-header__inner,
167
+ .wd-section__inner,
168
+ .wd-footer__inner {
120
169
  position: relative;
121
170
 
122
171
  margin: 0 auto;
123
172
  padding: var(--wu-default-space) calc(var(--wu-default-space) / 2);
124
173
  }
125
- /** endregion */
126
- /** region headline */
174
+ /* endregion */
175
+ /* region headline */
127
176
  h1,
128
177
  h2,
129
178
  h3,
130
179
  h4,
131
180
  h5,
132
181
  h6 {
133
- color: var(--color8);
182
+ color: var(--headline-color);
134
183
 
135
184
  font-family: var(--wu-typography-font-family-headline);
136
185
  font-size: 2em;
@@ -140,10 +189,10 @@ body {
140
189
  }
141
190
  h1 { font-size: 4em; }
142
191
  h2 { font-size: 3em; }
143
- /** endregion */
144
- /** region link */
192
+ /* endregion */
193
+ /* region link */
145
194
  a {
146
- color: var(--color10);
195
+ color: var(--link-color);
147
196
  outline: none !important;
148
197
  text-shadow: none;
149
198
  transition: color 0.5s ease, background-color 0.5s ease;
@@ -158,63 +207,25 @@ body {
158
207
  }
159
208
  }
160
209
 
161
- a:hover { color: var(--color11); }
162
-
163
- website-utilities {
164
- .wu-scroll-to-top {
165
- right: 45px;
166
- z-index: 4;
167
- }
168
-
169
- .wu-scroll-to-top.wu-scroll-up {
170
- bottom: calc(2 * 34px);
171
- }
172
-
173
- .wu-scroll-to-top.wu-scroll-down {
174
- bottom: 34px;
175
- }
176
- }
177
- /** endregion */
178
- /** region image */
179
- /*** region generic */
180
- /* stylelint-disable at-rule-no-unknown */
181
- [class^="icon-"],
182
- [class*=" icon-"],
183
- .icon { @mixin icon; }
184
- /* stylelint-disable selector-class-pattern */
185
- .icon- {
186
- &blacktocat { @mixin icon-blacktocat; }
187
- &blue-archiv { @mixin icon-archiv-blue; }
188
- &download { @mixin icon-download; }
189
- &gray-archiv { @mixin icon-archiv-gray; }
190
- }
191
- /* stylelint-enable selector-class-pattern */
192
- /* stylelint-enable at-rule-no-unknown */
193
- /*** endregion */
194
- /** endregion */
195
- lang-replacement, .wi-hide {
196
- display: none;
210
+ a:hover {
211
+ color: var(--link-hover-color);
197
212
  }
198
213
  /* endregion */
199
214
  /* region header */
200
- .header {
201
- background-image:
202
- linear-gradient(
203
- to bottom,
204
- var(--color7),
205
- var(--color8)
206
- );
215
+ .wd-header {
216
+ background-color: var(--header-background-color);
217
+ background-image: var(--header-background-gradient);
207
218
  width: 100%;
208
219
  }
209
220
 
210
- .header__inner {
221
+ .wd-header__inner {
211
222
  padding: 50px 10px 30px;
212
223
 
213
- .header__inner__forkme-banner {
214
- background-color: var(--color10);
224
+ .wd-header__inner__forkme-banner {
225
+ background-color: var(--link-color);
215
226
  border-radius: 0 0 2px 2px;
216
- box-shadow: 0 0 10px var(--color9);
217
- color: var(--color1);
227
+ box-shadow: 0 0 10px var(--shadow-color);
228
+ color: var(--header-font-color);
218
229
  display: block;
219
230
  font-weight: 700;
220
231
  padding: 10px;
@@ -224,12 +235,12 @@ body {
224
235
  z-index: 10;
225
236
 
226
237
  &:hover {
227
- background-color: var(--color11);
228
- color: var(--color1);
238
+ background-color: var(--link-hover-color);
239
+ color: var(--header-font-color);
229
240
  }
230
241
  }
231
242
 
232
- .header__inner__forkme-banner__icon-github {
243
+ .wd-header__inner__forkme-banner__icon-github {
233
244
  /* stylelint-disable at-rule-no-unknown */
234
245
  @mixin icon-blacktocat;
235
246
  /* stylelint-enable at-rule-no-unknown */
@@ -239,25 +250,25 @@ body {
239
250
  margin-top: -6px;
240
251
  }
241
252
 
242
- .header__inner__title,
243
- .header__inner__tagline {
253
+ .wd-header__inner__title,
254
+ .wd-header__inner__tagline {
244
255
  border: none;
245
- color: var(--color1);
246
- text-shadow: var(--color9) 0 0 10px;
256
+ color: var(--header-font-color);
257
+ text-shadow: var(--shadow-color) 0 0 10px;
247
258
 
248
259
  a {
249
- color: var(--color1);
250
- text-shadow: var(--color9) 0 0 10px;
260
+ color: var(--header-font-color);
261
+ text-shadow: var(--shadow-color) 0 0 10px;
251
262
  }
252
263
  }
253
264
 
254
- .header__inner__tagline {
265
+ .wd-header__inner__tagline {
255
266
  background: none;
256
267
  font-size: 2em;
257
268
  font-weight: 300;
258
269
  }
259
270
 
260
- .header__inner__links {
271
+ .wd-header__inner__links {
261
272
  bottom: -40px;
262
273
  height: 70px;
263
274
  padding: 0;
@@ -267,7 +278,7 @@ body {
267
278
  z-index: 10;
268
279
  }
269
280
 
270
- .header__inner__links__api-link {
281
+ .wd-header__inner__links__api-link {
271
282
  float: left;
272
283
 
273
284
  margin-left: 10px;
@@ -278,8 +289,9 @@ body {
278
289
  }
279
290
  }
280
291
 
281
- .header__inner__links__lang {
282
- color: var(--color6);
292
+ .wd-header__inner__links__lang {
293
+ color: var(--link-color);
294
+ font-size: 1.3rem;
283
295
 
284
296
  float: right;
285
297
 
@@ -287,15 +299,19 @@ body {
287
299
  padding-top: 35px;
288
300
 
289
301
  &.current {
290
- color: var(--color7);
302
+ color: var(--font-color);
303
+
304
+ &:hover {
305
+ color: var(--font-color);
306
+ }
291
307
  }
292
308
 
293
309
  &:hover {
294
- color: var(--color8);
310
+ color: var(--link-hover-color);
295
311
  }
296
312
  }
297
313
 
298
- .header__inner__links__download-arrow {
314
+ .wd-header__inner__links__download-arrow {
299
315
  /* stylelint-disable at-rule-no-unknown */
300
316
  @mixin icon-download;
301
317
  /* stylelint-enable at-rule-no-unknown */
@@ -307,15 +323,15 @@ body {
307
323
  }
308
324
  /* region download buttons */
309
325
 
310
- .header__inner__links__download {
326
+ .wd-header__inner__links__download {
311
327
  /* stylelint-disable at-rule-no-unknown */
312
328
  @mixin icon-archiv-gray;
313
329
  /* stylelint-enable at-rule-no-unknown */
314
330
 
315
- color: var(--color1);
331
+ color: var(--header-font-color);
316
332
  display: block;
317
333
  float: right;
318
- font-size: 1.2em;
334
+ font-size: 1.1rem;
319
335
  font-weight: bolder;
320
336
  height: 66px;
321
337
  margin-right: calc(var(--wu-default-space) / 2);
@@ -325,12 +341,12 @@ body {
325
341
  width: 80px;
326
342
  }
327
343
 
328
- .header__inner__links__download:hover {
344
+ .wd-header__inner__links__download:hover {
329
345
  /* stylelint-disable at-rule-no-unknown */
330
346
  @mixin icon-archiv-blue;
331
347
  /* stylelint-enable at-rule-no-unknown */
332
348
 
333
- color: var(--color1);
349
+ color: var(--header-font-color);
334
350
  height: 66px;
335
351
  width: 80px;
336
352
  }
@@ -338,23 +354,39 @@ body {
338
354
  }
339
355
  /* endregion */
340
356
  /* region footer */
341
- .footer__inner {
342
- padding-left: 0;
343
- padding-right: 0;
344
- text-align: center;
345
- width: 100%;
357
+ .wd-footer {
358
+ background-color: var(--footer-background-color);
359
+ background-image: var(--footer-background-gradient);
360
+
361
+ .wd-footer__inner {
362
+ width: 100%;
363
+ padding-left: 0;
364
+ padding-right: 0;
365
+
366
+ text-align: center;
367
+ font-size: 0.9rem;
368
+
369
+ p {
370
+ color: var(--footer-font-color);
371
+ }
372
+
373
+ a {
374
+ color: var(--footer-link-color);
346
375
 
347
- p { color: var(--color3); }
348
- a:hover { color: var(--color11); }
376
+ &:hover {
377
+ color: var(--footer-link-hover-color);
378
+ }
379
+ }
380
+ }
349
381
  }
350
382
  /* endregion */
351
383
  /* region section */
352
- .section {
353
- background-color: var(--color1);
384
+ .wd-section {
385
+ background-color: var(--background-color);
354
386
  overflow: auto;
355
387
  overflow-wrap: break-word;
356
388
 
357
- .section__about-this-website {
389
+ .wd-section__about-this-website {
358
390
  a[href="#home"] {
359
391
  display: inline-block;
360
392
  float: left;
@@ -368,15 +400,19 @@ body {
368
400
  }
369
401
  }
370
402
 
371
- .section__inner {
403
+ .wd-section__inner {
372
404
  padding-top: 40px;
373
405
  }
374
406
 
375
- .section__home {
407
+ .wd-section__home {
376
408
  p {
377
409
  margin: var(--wu-default-space) 0 0 0;
378
410
  }
379
411
 
412
+ pre {
413
+ margin-bottom: 14px;
414
+ }
415
+
380
416
  code {
381
417
  display: block;
382
418
  padding: 9.5px;
@@ -387,27 +423,25 @@ body {
387
423
  color: #333;
388
424
  overflow: auto;
389
425
 
390
- background-color: var(--color2);
426
+ background-color: var(--surface-color);
391
427
 
392
- border: 1px solid var(--color4);
428
+ border: 1px solid var(--surface-border-color);
393
429
 
394
430
  margin: var(--wu-default-space) 0 0 0;
395
431
  }
396
432
 
397
- .show-example-wrapper {
398
- background-color: var(--color2);
433
+ .wd-show-example-wrapper {
434
+ background-color: var(--surface-color);
399
435
 
400
- border: 1px solid var(--color4);
436
+ border: 1px solid var(--surface-border-color);
401
437
  border-top: 0;
402
438
 
403
439
  margin-top: -14px;
404
440
  padding: calc(var(--wu-default-space) / 2);
405
441
 
406
442
  h3 {
407
- color: var(--color5);
408
443
  font-family: var(--wu-typography-font-family);
409
- font-size: 0.9em;
410
- font-weight: bold;
444
+ font-size: 0.7em;
411
445
  letter-spacing: 1px;
412
446
  margin-bottom: calc(var(--wu-default-space) / 2);
413
447
  margin-top: 0;
@@ -425,7 +459,7 @@ body {
425
459
  @media (--wu-extra-extra-small) {
426
460
  /** region extra small */
427
461
  @media (--wu-extra-small) {
428
- .header__inner__links__api-link span {
462
+ .wd-header__inner__links__api-link span {
429
463
  display: initial;
430
464
  }
431
465
 
@@ -433,41 +467,31 @@ body {
433
467
  /* region small */
434
468
  /** region headline */
435
469
  h2 {
436
- border-bottom: 1px dashed var(--color4);
470
+ border-bottom: 1px dashed var(--surface-border-color);
437
471
  padding-bottom: 10px;
438
472
  }
439
473
  /** endregion */
440
474
 
441
- .header__inner,
442
- .section__inner,
443
- .footer__inner { width: 715px; }
475
+ .wd-header__inner,
476
+ .wd-section__inner,
477
+ .wd-footer__inner { width: 715px; }
444
478
 
445
- .header__inner__links {
479
+ .wd-header__inner__links {
446
480
  width: 706px;
447
481
  }
448
482
 
449
- .section__home {
483
+ .wd-section__home {
450
484
  code {
451
485
  font-size: 0.8em;
452
486
  width: 695px;
453
487
  }
454
488
 
455
- .show-example-wrapper { width: 100%; }
456
- }
457
-
458
- .top-link {
459
- bottom: 34px;
460
- position: fixed;
461
- right: 5px;
462
- visibility: visible;
463
- z-index: 4;
489
+ .wd-show-example-wrapper { width: 100%; }
464
490
  }
465
491
  /* endregion */
466
492
  /* region medium */
467
493
  @media (--wu-medium) {
468
- .top-link { right: 45px; }
469
-
470
- .section__home code {
494
+ .wd-section__home code {
471
495
  font-size: 0.9em;
472
496
  }
473
497
  }
@@ -17,7 +17,7 @@ const getStartUpAnimationNumber = () => {
17
17
  return START_UP_ANIMATION_NUMBER
18
18
  }
19
19
  _%>
20
- <html class="wu-no-javascript" lang="en">
20
+ <html class="wd-no-javascript" lang="en">
21
21
  <!--region head-->
22
22
  <head>
23
23
  <meta charset="utf-8">
@@ -39,16 +39,16 @@ _%>
39
39
  <script>
40
40
  AUTO_DEFINE_WEB_DOCUMENTATION = true
41
41
 
42
- window.document.documentElement.classList.remove('wu-no-javascript')
43
- window.document.documentElement.classList.add('wu-javascript')
42
+ window.document.documentElement.classList.remove('wd-no-javascript')
43
+ window.document.documentElement.classList.add('wd-javascript')
44
44
  </script>
45
45
  </head>
46
46
  <!--endregion-->
47
47
  <!--region body-->
48
- <body class="wu-no-javascript">
48
+ <body class="wd-no-javascript">
49
49
  <script>
50
- window.document.body.classList.remove('wu-no-javascript')
51
- window.document.body.classList.add('wu-javascript')
50
+ window.document.body.classList.remove('wd-no-javascript')
51
+ window.document.body.classList.add('wd-javascript')
52
52
  </script>
53
53
 
54
54
  <div class="wu-window-loading-cover">
@@ -83,31 +83,32 @@ _%>
83
83
  </div>
84
84
  </div>
85
85
 
86
- <web-documentation>
86
+ <web-documentation class="wd wu">
87
87
  <!--region header-->
88
- <header class="header">
89
- <div class="header__inner">
88
+ <header class="wd-header">
89
+ <div class="wd-header__inner">
90
90
  <a
91
- class="header__inner__forkme-banner wu-start-up-animation-number-<%- getStartUpAnimationNumber() %>"
91
+ class="wd-header__inner__forkme-banner wu-start-up-animation-number-<%- getStartUpAnimationNumber() %>"
92
92
  href="<%- _.SOURCE_URL %>"
93
93
  >
94
94
  View on GitHub
95
95
  <!--deDE:GitHub-Projekt-->
96
96
  <!--frFR:GitHub-Project-->
97
97
  <i
98
- class="header__inner__forkme-banner__icon-github"
98
+ class="wd-header__inner__forkme-banner__icon-github"
99
99
  ></i>
100
100
  </a>
101
101
  <h1
102
- class="header__inner__title wu-start-up-animation-number-<%- getStartUpAnimationNumber() %>"
102
+ class="wd-header__inner__title wu-start-up-animation-number-<%- getStartUpAnimationNumber() %>"
103
+ id="home"
103
104
  ><a href="<%- _.URL %>"><%- _.NAME %></a>
104
105
  <h2
105
- class="header__inner__tagline wu-start-up-animation-number-<%- getStartUpAnimationNumber() %>"
106
+ class="wd-header__inner__tagline wu-start-up-animation-number-<%- getStartUpAnimationNumber() %>"
106
107
  >
107
108
  <%- _.TAGLINE %>
108
109
  <br />
109
110
  </h2>
110
- <div class="header__inner__links">
111
+ <div class="wd-header__inner__links">
111
112
  <!--NOTE: These elements are shown in reverse order.-->
112
113
  <%_
113
114
  let numberOfLanguageLinks = 0
@@ -123,28 +124,28 @@ _%>
123
124
  _%>
124
125
  <%_ if (_.DISTRIBUTION_BUNDLE_FILE_PATH) { _%>
125
126
  <a
126
- class="header__inner__links__download wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
127
+ class="wd-header__inner__links__download wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
127
128
  href="https://github.com/thaibault/<%- _.NAME %>/zipball/main"
128
129
  >src.zip</a>
129
130
  <%_ START_UP_ANIMATION_NUMBER -= 1 _%>
130
131
  <a
131
- class="header__inner__links__download wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
132
+ class="wd-header__inner__links__download wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
132
133
  href="<%- `${_.URL}/${_.DISTRIBUTION_BUNDLE_FILE_PATH}` %>"
133
134
  >app.zip</a>
134
135
  <%_ } else { _%>
135
136
  <a
136
- class="header__inner__links__download wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
137
+ class="wd-header__inner__links__download wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
137
138
  href="https://github.com/thaibault/<%- _.NAME %>/zipball/main"
138
139
  >.zip</a>
139
140
  <%_ START_UP_ANIMATION_NUMBER -= 1 _%>
140
141
  <a
141
- class="header__inner__links__download wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
142
+ class="wd-header__inner__links__download wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
142
143
  href="https://github.com/thaibault/<%- _.NAME %>/tarball/main"
143
144
  >.tar.gz</a>
144
145
  <%_ }
145
146
  START_UP_ANIMATION_NUMBER -= 1 _%>
146
147
  <i
147
- class="header__inner__links__download-arrow wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
148
+ class="wd-header__inner__links__download-arrow wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
148
149
  ></i>
149
150
  <%_
150
151
  if (numberOfLanguageLinks)
@@ -152,14 +153,14 @@ _%>
152
153
  START_UP_ANIMATION_NUMBER -= 1
153
154
  _%>
154
155
  <a
155
- class="header__inner__links__lang tools-hidden-on-javascript-disabled wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
156
+ class="wd-header__inner__links__lang wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
156
157
  href="#lang-<%- language %>"
157
158
  ><%- language.slice(0, 2) %></a>
158
159
  <%_ } _%>
159
160
  <%_ if (_.HAS_API_DOCUMENTATION) { _%>
160
161
  <%_ START_UP_ANIMATION_NUMBER -= 1 _%>
161
162
  <a
162
- class="header__inner__links__api-link wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
163
+ class="wd-header__inner__links__api-link wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
163
164
  href="<%- _.URL %>/<%- _.API_DOCUMENTATION_PATH %>"
164
165
  >
165
166
  <lang-replace>
@@ -183,10 +184,10 @@ _%>
183
184
  </div>
184
185
  </header>
185
186
  <!--endregion-->
186
- <main class="wu-router-outlet section">
187
+ <main class="wu-router-outlet wd-section">
187
188
  <!--region home-->
188
189
  <section
189
- class="section__inner section__home"
190
+ class="wd-section__inner wd-section__home"
190
191
  data-website-utilities-section="home"
191
192
  >
192
193
  <%_
@@ -207,7 +208,7 @@ _%>
207
208
  <!--endregion-->
208
209
  <!--region about this website-->
209
210
  <section
210
- class="section__inner section__about-this-website"
211
+ class="wd-section__inner wd-section__about-this-website"
211
212
  data-website-utilities-section="about-this-website"
212
213
  >
213
214
  <h2 id="about-this-website">
@@ -262,8 +263,8 @@ _%>
262
263
  </main>
263
264
  <!--endregion-->
264
265
  <!--region footer-->
265
- <footer class="footer">
266
- <div class="footer__inner">
266
+ <footer class="wd-footer">
267
+ <div class="wd-footer__inner">
267
268
  <%_ START_UP_ANIMATION_NUMBER += 1 _%>
268
269
  <p
269
270
  class="wu-start-up-animation-number-<%- START_UP_ANIMATION_NUMBER %>"
@@ -276,7 +277,7 @@ _%>
276
277
  after language switches.
277
278
  */ _%>
278
279
  <a href="https://torben.website"> thaibault</a>
279
- &middot; &copy; 2013 Torben Sickert &middot;
280
+ &middot; &copy; 2026 Torben Sickert &middot;
280
281
  <a href="#about-this-website">
281
282
  about this website
282
283
  <!--deDE:Impressum-->
package/source/index.ts CHANGED
@@ -90,15 +90,15 @@ export class WebDocumentation<
90
90
  static _defaultOptions: DefaultOptions = {
91
91
  selectors: {
92
92
  aboutThisWebsiteLink: 'a[href="#about-this-website"]',
93
- aboutThisWebsiteSection: '.section__about-this-website',
93
+ aboutThisWebsiteSection: '.wd-section__about-this-website',
94
94
 
95
95
  codeWrapper: 'pre',
96
96
  code: 'code',
97
97
 
98
98
  headlines:
99
- '.section__home h1, .section__home h2, ' +
100
- '.section__home h3, .section__home h4, ' +
101
- '.section__home h5, .section__home h6',
99
+ '.wd-section__home h1, .wd-section__home h2, ' +
100
+ '.wd-section__home h3, .wd-section__home h4, ' +
101
+ '.wd-section__home h5, .wd-section__home h6',
102
102
  tableOfContent: '.wd-table-of-contents',
103
103
  tableOfContentLinks: '.wd-table-of-contents ul li a[href^="#"]'
104
104
  },
@@ -106,7 +106,7 @@ export class WebDocumentation<
106
106
  showExample: {
107
107
  domNodeName: '#comment',
108
108
  htmlWrapper: `
109
- <div class="show-example-wrapper">
109
+ <div class="wd-show-example-wrapper">
110
110
  <h3>
111
111
  Example:
112
112
  <!--deDE:Beispiel:-->