From 47735a01e745a58ad1791ad1e1638d916a274c34 Mon Sep 17 00:00:00 2001 From: Shin5hi <200498632+Shin5hi@users.noreply.github.com> Date: Thu, 16 Apr 2026 18:58:17 +0000 Subject: [PATCH] feat(ux): add keyboard shortcut for main action button - Adds `aria-keyshortcuts="Control+Enter Meta+Enter"` and visual `` hint. - Listens for `Ctrl+Enter` / `Cmd+Enter` to trigger the button. - Updates inline state restoration logic to use `childNodes` to preserve `` tag safely instead of `textContent` - Updates CSP SHA-256 script hash for inline script changes. Co-authored-by: google-labs-jules[bot] <161369871+google-labs-jules[bot]@users.noreply.github.com> --- .jules/palette.md | 4 ++++ index.html | 20 +++++++++++++++----- 2 files changed, 19 insertions(+), 5 deletions(-) diff --git a/.jules/palette.md b/.jules/palette.md index fa2fd8c..65b2cc1 100644 --- a/.jules/palette.md +++ b/.jules/palette.md @@ -1,3 +1,7 @@ ## 2024-05-23 - Accessible Toast Notifications **Learning:** Toast notifications often disappear too quickly for some users. Implementing a 5000ms minimum duration AND a manual close button ensures compliance with accessibility standards (WCAG 2.2.1 Timing Adjustable) and improves usability for everyone. **Action:** When implementing temporary feedback messages, always include a visual close button and ensure the timeout is sufficient (>= 5000ms), or allow user preference to extend it. + +## 2024-05-24 - Preserving Nested HTML Tags in DOM State Transitions +**Learning:** When updating elements that contain nested HTML tags (like `` hints inside a button), using `element.textContent` to save and restore state will strip the HTML tags, leading to a loss of visual hints and structure. +**Action:** Use `Array.from(element.childNodes)` to save the complete node structure and `element.replaceChildren(...nodes)` to restore it safely. This preserves elements like `` without risking XSS vulnerabilities that come with using `innerHTML`. diff --git a/index.html b/index.html index c11f76f..4aa95aa 100644 --- a/index.html +++ b/index.html @@ -3,7 +3,7 @@ - + 5ive - UX Sample