Add dynamic typing animation to homepage description

Introduced a dynamic typing effect for the homepage description using the `Typed` library. Replaced hardcoded description text in `Index.razor` with a dynamically rendered `<span>` element. Added a constant for the description text and implemented `OnAfterRenderAsync` to invoke the typing animation on first render.

Included the `typed.umd.js` library in `index.html` and updated `receiver-signature.js` with a `startTyped` function to support typing animations. Registered `startTyped` in the public API for external use.

Enhanced the user experience with dynamic content rendering and improved maintainability by centralizing the description text. Also added a new theme file for improved styling.
This commit is contained in:
2026-06-01 11:32:27 +02:00
parent 6d254281f8
commit 161ec6491d
4 changed files with 30 additions and 5 deletions

View File

@@ -315,12 +315,22 @@ window.receiverSignature = (() => {
state.hasSignature = true;
}
function startTyped(elementId, text, typeSpeed) {
if (typeof Typed === 'undefined') return;
new Typed('#' + elementId, {
strings: [text],
typeSpeed: typeSpeed || 15,
showCursor: false
});
}
function getDataUrl(id) { const c = document.getElementById(id); const s = pads.get(id); return (c && s && s.hasSignature) ? c.toDataURL('image/png') : null; }
function getTypedDataUrl(id) { const c = document.getElementById(id); const s = typedSignatures.get(id); return (c && s && s.hasSignature) ? c.toDataURL('image/png') : null; }
function getImageDataUrl(id) { const c = document.getElementById(id); const s = imageSignatures.get(id); return (c && s && s.hasSignature) ? c.toDataURL('image/png') : null; }
// ?? Public API ??????????????????????????????????????????????????????????
return {
startTyped: startTyped,
installAnnotationCheckboxes: installAnnotationCheckboxes,
debugDumpViewerDom: debugDumpViewerDom,
initialize: initialize,