Skip to content

Commit d0ceb50

Browse files
olivier3lancolivier3lanc
committed
feat: upgrade LibDoc v0.5.3
1 parent 0f8dce1 commit d0ceb50

File tree

14 files changed

+109
-44
lines changed

14 files changed

+109
-44
lines changed

‎.eleventy.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ export default function(eleventyConfig) {
2323
eleventyConfig.addAsyncFilter("embed", libdocFunctions.filters.embed);
2424
eleventyConfig.addAsyncFilter("cleanup", libdocFunctions.filters.cleanup);
2525
eleventyConfig.addAsyncFilter("dateString", libdocFunctions.filters.dateString);
26+
eleventyConfig.addAsyncFilter("datePrefixText", libdocFunctions.filters.datePrefixText);
2627
eleventyConfig.addAsyncFilter("toc", libdocFunctions.filters.toc);
2728
// END FILTERS
2829

‎_data/libdocFunctions.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,9 @@ export default {
4444
const filename = src.split('/').slice(-1)[0].split('.')[0];
4545
return `${libdocUtils.slugify(filename)}-${id}-__${width}__.${format}`;
4646
},
47+
sharpOptions: {
48+
animated: true
49+
},
4750
// transform: (sharp) => {
4851
// sharp.trim();
4952
// },
@@ -107,6 +110,13 @@ export default {
107110
content = content.replaceAll(`</aside></p>`, `</aside>`);
108111
return content;
109112
},
113+
datePrefixText: async function(date) {
114+
let text = '';
115+
if (typeof date == 'string') {
116+
text = libdocMessages.lastModified[libdocConfig.lang];
117+
}
118+
return text;
119+
},
110120
dateString: async function(content) {
111121
let theDay = content.getDate().toString();
112122
if (theDay.length == 1) theDay = `0${theDay}`;

‎_includes/libdoc_page.liquid‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -301,8 +301,9 @@
301301
fs-2="xs">
302302
<span class="icon-calendar-dots fs-6"></span>
303303
<span ws-nowrap="sm,md">
304-
<span class="ws-nowrap">{{ libdocMessages.lastModified[pageLang] }}</span>
305-
{{ page.date|dateString }}
304+
{% comment %} <span class="ws-nowrap">{{ libdocMessages.lastModified[pageLang] }}</span> {% endcomment %}
305+
{{ date | datePrefixText }}
306+
{{ page.date | dateString }}
306307
</span>
307308
</p>
308309
{% endif %}

‎core/assets/css/ds__defaults.css‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,15 @@
44
--libdoc-damier: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAHElEQVR4AWP4jwOcwQFoo2FUAy4JXAbRRMOoBgCE0rCfubvZNQAAAABJRU5ErkJggg==');
55
--libdoc-soft-shadow: 0px 0px 10px rgba(0,0,0,0.1);
66
--libdoc-long-shadow:
7-
1px 1px 2px rgba(15, 49, 86, 0.08),
8-
5px 6px 9px rgba(15, 49, 86, 0.26),
9-
12px 13px 21px rgba(15, 49, 86, 0.34),
7+
1px 1px 2px rgba(49, 49, 49, 0.08),
8+
5px 6px 9px rgba(49, 49, 49, 0.26),
9+
12px 13px 21px rgba(49, 49, 49, 0.34),
10+
22px 24px 38px rgba(49, 49, 49, 0.42),
11+
34px 37px 59px rgba(49, 49, 49, 0.50);
12+
--libdoc-long-shadow-alt:
13+
1px 1px 2px rgba(15, 49, 86, 0.08),
14+
5px 6px 9px rgba(15, 49, 86, 0.26),
15+
12px 13px 21px rgba(15, 49, 86, 0.34),
1016
22px 24px 38px rgba(15, 49, 86, 0.42),
1117
34px 37px 59px rgba(15, 49, 86, 0.50);
1218
}
@@ -113,7 +119,7 @@ body {
113119
font-weight: 300;
114120
font-style: normal;
115121
font-size: var(--ita-fontSizes-5);
116-
font-variation-settings: "slnt" 0, "CASL" 0.5, "CRSV" 1, "MONO" 0, "wght" 330;
122+
font-variation-settings: "slnt" 0, "CASL" 0.5, "CRSV" 1, "MONO" 0, "wght" 360;
117123
}
118124
html,
119125
.o-auto {
@@ -569,7 +575,7 @@ main > pre {
569575
}
570576
main > pre > code {
571577
border-radius: 6px;
572-
box-shadow: var(--libdoc-long-shadow);
578+
box-shadow: var(--libdoc-long-shadow-alt);
573579
}
574580
main > pre > code::before {
575581
content: attr(class);

‎core/assets/js/ui.js‎

Lines changed: 23 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,17 @@ const libdocUi = {
2727
searchClearBtns: document.querySelectorAll('.search_form__clear_btn'),
2828
ftocHeadings: []
2929
},
30+
getTransferSize: function() {
31+
// https://jmperezperez.com/blog/page-load-footer/
32+
let result = 0;
33+
if (typeof performance == 'object') {
34+
result = performance.getEntriesByType('resource').reduce((a, r) => {
35+
return a + r.transferSize;
36+
}, 0);
37+
result = Math.round(result / 1024);
38+
}
39+
return result;
40+
},
3041
getCurrentScreenSizeName: function() {
3142
let response = '';
3243
Object.keys(libdocUi.defaults.screenSizes).forEach(function(name) {
@@ -285,6 +296,7 @@ const libdocUi = {
285296
_toggleFtocLargeDevices: function(evt) {
286297
if (libdocUi.el.ftocDetails.open) {
287298
libdocUi.updateUserPreferences({FTOCNormallyOpened: true});
299+
libdocUi.updateFtocList();
288300
} else {
289301
libdocUi.updateUserPreferences({FTOCNormallyOpened: false});
290302
}
@@ -322,6 +334,7 @@ const libdocUi = {
322334
});
323335
}
324336
libdocUi.updateSearchInputClearBtns();
337+
libdocUi.updateTransferSizeDisplay();
325338
},
326339
_navPrimaryCheckboxChange: function(evt) {
327340
libdocUi.updateNavPrimary();
@@ -404,7 +417,14 @@ const libdocUi = {
404417
}
405418
}
406419
},
407-
420+
updateTransferSizeDisplay: function() {
421+
const currentTransferSize = libdocUi.getTransferSize();
422+
if (currentTransferSize > 0) {
423+
document.querySelectorAll('.page-transfer-size-display').forEach(function(el) {
424+
el.innerHTML = `${currentTransferSize} kB`;
425+
})
426+
}
427+
},
408428
updateSearchInputClearBtns: function() {
409429
libdocUi.el.searchInputs.forEach(function(elInput) {
410430
const elClearBtn = elInput.form.querySelector('.search_form__clear_btn');
@@ -561,7 +581,7 @@ const libdocUi = {
561581
updateGTTBtns: function() {
562582
if (window.scrollY > libdocUi.el.mainHeader.clientHeight) {
563583
libdocUi.enableGTTLargeDevices();
564-
if (getComputedStyle(libdocUi.el.navPrimaryContainer) != 'none') {
584+
if (getComputedStyle(libdocUi.el.navPrimaryContainer).display != 'none') {
565585
libdocUi.disableGTTSmallDevices();
566586
} else {
567587
libdocUi.enableGTTSmallDevices();
@@ -616,7 +636,7 @@ const libdocUi = {
616636
},
617637
updateFTOCBtns: function() {
618638
if (libdocUi.el.tocMainOl !== null) {
619-
if (getComputedStyle(libdocUi.el.navPrimaryContainer) != 'none') {
639+
if (getComputedStyle(libdocUi.el.navPrimaryContainer).display != 'none') {
620640
libdocUi.el.navSmallDevicesFTOCBtn.disabled = true;
621641
} else {
622642
libdocUi.el.navSmallDevicesFTOCBtn.disabled = false;
@@ -873,7 +893,6 @@ const libdocUi = {
873893
libdocUi.fitSvgToItsContent(el)
874894
});
875895
document.body.addEventListener('touchstart', libdocUi.handlers._touchStart);
876-
// document.addEventListener('selectionchange', libdocUi.handlers._selectionChange);
877896
}
878897
}
879898
libdocUi.update();

‎docs/callbacks-personnalises/index.html‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -257,7 +257,8 @@ <h1 class="mt-3 mb-0 | lsp-5 fvs-wght-700 tws-balance " fs-10="md" fs-9="xs,sm">
257257
<p class="d-flex ai-center gap-2 | m-0 pr-2 | fvs-wght-400 fs-3 lsp-3 lh-3 | c-neutral-700 bc-primary-100" fs-2="xs">
258258
<span class="icon-calendar-dots fs-6"></span>
259259
<span ws-nowrap="sm,md">
260-
<span class="ws-nowrap">Dernière modification</span>
260+
261+
Dernière modification
261262
2025-04-24
262263
</span>
263264
</p>
@@ -368,8 +369,8 @@ <h1 class="mt-3 mb-0 | lsp-5 fvs-wght-700 tws-balance " fs-10="md" fs-9="xs,sm">
368369
&lt;/html&gt;</code>
369370
</pre>
370371
<div class="d-flex jc-center ai-center | pos-absolute top-0 left-0 | w-100 h-100 | sandbox__enable_wrapper" style="background-color: rgba(0,0,0,0.5)">
371-
<input type="checkbox" id="xZi5mgq5_code" value="" class="pos-absolute | opa-0 | sandbox__enable_switch">
372-
<label for="xZi5mgq5_code" class="d-flex ai-center gap-1 | p-5 | fvs-wght-500 tt-uppercase | bc-neutral-900 brad-2 cur-pointer">
372+
<input type="checkbox" id="SXiNuYVZ_code" value="" class="pos-absolute | opa-0 | sandbox__enable_switch">
373+
<label for="SXiNuYVZ_code" class="d-flex ai-center gap-1 | p-5 | fvs-wght-500 tt-uppercase | bc-neutral-900 brad-2 cur-pointer">
373374
<span class="icon-play"></span>
374375
Activer
375376
</label>
@@ -399,8 +400,8 @@ <h1 class="mt-3 mb-0 | lsp-5 fvs-wght-700 tws-balance " fs-10="md" fs-9="xs,sm">
399400
<div class="d-flex | pos-relative">
400401
<iframe src="/c-scrollspy.js/sandboxes/2/index.html" loading="lazy" class="w-100 h-500px | b-0 bc-neutral-100 | sandbox__iframe"></iframe>
401402
<div class="d-flex jc-center ai-center | pos-absolute top-0 left-0 | w-100 h-100 | sandbox__enable_wrapper" style="background-color: rgba(0,0,0,0.5)">
402-
<input type="checkbox" id="xZi5mgq5_iframe" value="" class="pos-absolute | opa-0 | sandbox__enable_switch">
403-
<label for="xZi5mgq5_iframe" class="d-flex ai-center gap-1 | p-5 | fvs-wght-500 tt-uppercase | bc-neutral-900 brad-2 cur-pointer">
403+
<input type="checkbox" id="SXiNuYVZ_iframe" value="" class="pos-absolute | opa-0 | sandbox__enable_switch">
404+
<label for="SXiNuYVZ_iframe" class="d-flex ai-center gap-1 | p-5 | fvs-wght-500 tt-uppercase | bc-neutral-900 brad-2 cur-pointer">
404405
<span class="icon-play"></span> Activer
405406
</label>
406407
</div>
@@ -425,7 +426,7 @@ <h1 class="mt-3 mb-0 | lsp-5 fvs-wght-700 tws-balance " fs-10="md" fs-9="xs,sm">
425426
<div class="w-100" d-none="sm,md"></div>
426427
<div class="pl-5 | bbwidth-1 bbstyle-dashed bcolor-neutral-500" w-100="sm,md"></div>
427428
<a href="https://github.com/ita-design-system/eleventy-libdoc" target="_blank" class="d-flex ai-center gap-2 | pl-2 pr-2 | fvs-wght-400 fs-2 lsp-3 lh-3 td-none ws-nowrap">
428-
11ty LibDoc 0.5.1
429+
11ty LibDoc 0.5.3
429430
</a>
430431
</nav>
431432
</footer>

‎docs/carrousel/index.html‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -257,7 +257,8 @@ <h1 class="mt-3 mb-0 | lsp-5 fvs-wght-700 tws-balance " fs-10="md" fs-9="xs,sm">
257257
<p class="d-flex ai-center gap-2 | m-0 pr-2 | fvs-wght-400 fs-3 lsp-3 lh-3 | c-neutral-700 bc-primary-100" fs-2="xs">
258258
<span class="icon-calendar-dots fs-6"></span>
259259
<span ws-nowrap="sm,md">
260-
<span class="ws-nowrap">Dernière modification</span>
260+
261+
Dernière modification
261262
2025-04-24
262263
</span>
263264
</p>
@@ -377,8 +378,8 @@ <h1 class="mt-3 mb-0 | lsp-5 fvs-wght-700 tws-balance " fs-10="md" fs-9="xs,sm">
377378
&lt;/html&gt;</code>
378379
</pre>
379380
<div class="d-flex jc-center ai-center | pos-absolute top-0 left-0 | w-100 h-100 | sandbox__enable_wrapper" style="background-color: rgba(0,0,0,0.5)">
380-
<input type="checkbox" id="sBlWpIRg_code" value="" class="pos-absolute | opa-0 | sandbox__enable_switch">
381-
<label for="sBlWpIRg_code" class="d-flex ai-center gap-1 | p-5 | fvs-wght-500 tt-uppercase | bc-neutral-900 brad-2 cur-pointer">
381+
<input type="checkbox" id="TYKcMLEw_code" value="" class="pos-absolute | opa-0 | sandbox__enable_switch">
382+
<label for="TYKcMLEw_code" class="d-flex ai-center gap-1 | p-5 | fvs-wght-500 tt-uppercase | bc-neutral-900 brad-2 cur-pointer">
382383
<span class="icon-play"></span>
383384
Activer
384385
</label>
@@ -408,8 +409,8 @@ <h1 class="mt-3 mb-0 | lsp-5 fvs-wght-700 tws-balance " fs-10="md" fs-9="xs,sm">
408409
<div class="d-flex | pos-relative">
409410
<iframe src="/c-scrollspy.js/sandboxes/3/index.html" loading="lazy" class="w-100 h-500px | b-0 bc-neutral-100 | sandbox__iframe"></iframe>
410411
<div class="d-flex jc-center ai-center | pos-absolute top-0 left-0 | w-100 h-100 | sandbox__enable_wrapper" style="background-color: rgba(0,0,0,0.5)">
411-
<input type="checkbox" id="sBlWpIRg_iframe" value="" class="pos-absolute | opa-0 | sandbox__enable_switch">
412-
<label for="sBlWpIRg_iframe" class="d-flex ai-center gap-1 | p-5 | fvs-wght-500 tt-uppercase | bc-neutral-900 brad-2 cur-pointer">
412+
<input type="checkbox" id="TYKcMLEw_iframe" value="" class="pos-absolute | opa-0 | sandbox__enable_switch">
413+
<label for="TYKcMLEw_iframe" class="d-flex ai-center gap-1 | p-5 | fvs-wght-500 tt-uppercase | bc-neutral-900 brad-2 cur-pointer">
413414
<span class="icon-play"></span> Activer
414415
</label>
415416
</div>
@@ -434,7 +435,7 @@ <h1 class="mt-3 mb-0 | lsp-5 fvs-wght-700 tws-balance " fs-10="md" fs-9="xs,sm">
434435
<div class="w-100" d-none="sm,md"></div>
435436
<div class="pl-5 | bbwidth-1 bbstyle-dashed bcolor-neutral-500" w-100="sm,md"></div>
436437
<a href="https://github.com/ita-design-system/eleventy-libdoc" target="_blank" class="d-flex ai-center gap-2 | pl-2 pr-2 | fvs-wght-400 fs-2 lsp-3 lh-3 td-none ws-nowrap">
437-
11ty LibDoc 0.5.1
438+
11ty LibDoc 0.5.3
438439
</a>
439440
</nav>
440441
</footer>

‎docs/core/assets/css/ds__defaults.css‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,15 @@
44
--libdoc-damier: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAHElEQVR4AWP4jwOcwQFoo2FUAy4JXAbRRMOoBgCE0rCfubvZNQAAAABJRU5ErkJggg==');
55
--libdoc-soft-shadow: 0px 0px 10px rgba(0,0,0,0.1);
66
--libdoc-long-shadow:
7-
1px 1px 2px rgba(15, 49, 86, 0.08),
8-
5px 6px 9px rgba(15, 49, 86, 0.26),
9-
12px 13px 21px rgba(15, 49, 86, 0.34),
7+
1px 1px 2px rgba(49, 49, 49, 0.08),
8+
5px 6px 9px rgba(49, 49, 49, 0.26),
9+
12px 13px 21px rgba(49, 49, 49, 0.34),
10+
22px 24px 38px rgba(49, 49, 49, 0.42),
11+
34px 37px 59px rgba(49, 49, 49, 0.50);
12+
--libdoc-long-shadow-alt:
13+
1px 1px 2px rgba(15, 49, 86, 0.08),
14+
5px 6px 9px rgba(15, 49, 86, 0.26),
15+
12px 13px 21px rgba(15, 49, 86, 0.34),
1016
22px 24px 38px rgba(15, 49, 86, 0.42),
1117
34px 37px 59px rgba(15, 49, 86, 0.50);
1218
}
@@ -113,7 +119,7 @@ body {
113119
font-weight: 300;
114120
font-style: normal;
115121
font-size: var(--ita-fontSizes-5);
116-
font-variation-settings: "slnt" 0, "CASL" 0.5, "CRSV" 1, "MONO" 0, "wght" 330;
122+
font-variation-settings: "slnt" 0, "CASL" 0.5, "CRSV" 1, "MONO" 0, "wght" 360;
117123
}
118124
html,
119125
.o-auto {
@@ -569,7 +575,7 @@ main > pre {
569575
}
570576
main > pre > code {
571577
border-radius: 6px;
572-
box-shadow: var(--libdoc-long-shadow);
578+
box-shadow: var(--libdoc-long-shadow-alt);
573579
}
574580
main > pre > code::before {
575581
content: attr(class);

‎docs/core/assets/js/ui.js‎

Lines changed: 23 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,17 @@ const libdocUi = {
2727
searchClearBtns: document.querySelectorAll('.search_form__clear_btn'),
2828
ftocHeadings: []
2929
},
30+
getTransferSize: function() {
31+
// https://jmperezperez.com/blog/page-load-footer/
32+
let result = 0;
33+
if (typeof performance == 'object') {
34+
result = performance.getEntriesByType('resource').reduce((a, r) => {
35+
return a + r.transferSize;
36+
}, 0);
37+
result = Math.round(result / 1024);
38+
}
39+
return result;
40+
},
3041
getCurrentScreenSizeName: function() {
3142
let response = '';
3243
Object.keys(libdocUi.defaults.screenSizes).forEach(function(name) {
@@ -285,6 +296,7 @@ const libdocUi = {
285296
_toggleFtocLargeDevices: function(evt) {
286297
if (libdocUi.el.ftocDetails.open) {
287298
libdocUi.updateUserPreferences({FTOCNormallyOpened: true});
299+
libdocUi.updateFtocList();
288300
} else {
289301
libdocUi.updateUserPreferences({FTOCNormallyOpened: false});
290302
}
@@ -322,6 +334,7 @@ const libdocUi = {
322334
});
323335
}
324336
libdocUi.updateSearchInputClearBtns();
337+
libdocUi.updateTransferSizeDisplay();
325338
},
326339
_navPrimaryCheckboxChange: function(evt) {
327340
libdocUi.updateNavPrimary();
@@ -404,7 +417,14 @@ const libdocUi = {
404417
}
405418
}
406419
},
407-
420+
updateTransferSizeDisplay: function() {
421+
const currentTransferSize = libdocUi.getTransferSize();
422+
if (currentTransferSize > 0) {
423+
document.querySelectorAll('.page-transfer-size-display').forEach(function(el) {
424+
el.innerHTML = `${currentTransferSize} kB`;
425+
})
426+
}
427+
},
408428
updateSearchInputClearBtns: function() {
409429
libdocUi.el.searchInputs.forEach(function(elInput) {
410430
const elClearBtn = elInput.form.querySelector('.search_form__clear_btn');
@@ -561,7 +581,7 @@ const libdocUi = {
561581
updateGTTBtns: function() {
562582
if (window.scrollY > libdocUi.el.mainHeader.clientHeight) {
563583
libdocUi.enableGTTLargeDevices();
564-
if (getComputedStyle(libdocUi.el.navPrimaryContainer) != 'none') {
584+
if (getComputedStyle(libdocUi.el.navPrimaryContainer).display != 'none') {
565585
libdocUi.disableGTTSmallDevices();
566586
} else {
567587
libdocUi.enableGTTSmallDevices();
@@ -616,7 +636,7 @@ const libdocUi = {
616636
},
617637
updateFTOCBtns: function() {
618638
if (libdocUi.el.tocMainOl !== null) {
619-
if (getComputedStyle(libdocUi.el.navPrimaryContainer) != 'none') {
639+
if (getComputedStyle(libdocUi.el.navPrimaryContainer).display != 'none') {
620640
libdocUi.el.navSmallDevicesFTOCBtn.disabled = true;
621641
} else {
622642
libdocUi.el.navSmallDevicesFTOCBtn.disabled = false;
@@ -873,7 +893,6 @@ const libdocUi = {
873893
libdocUi.fitSvgToItsContent(el)
874894
});
875895
document.body.addEventListener('touchstart', libdocUi.handlers._touchStart);
876-
// document.addEventListener('selectionchange', libdocUi.handlers._selectionChange);
877896
}
878897
}
879898
libdocUi.update();

0 commit comments

Comments
 (0)