From a62538a0d081e3ac35e79af3229607f6785b15b1 Mon Sep 17 00:00:00 2001 From: Le Quang Thang Date: Thu, 13 Feb 2025 14:38:34 +0700 Subject: [PATCH 1/2] impr: support many items - Overflow the list of items - Scroll to the focused item on selected --- src/index.ts | 1 + src/styles/index.css | 3 +++ 2 files changed, 4 insertions(+) diff --git a/src/index.ts b/src/index.ts index 828c963..fd18d19 100644 --- a/src/index.ts +++ b/src/index.ts @@ -150,6 +150,7 @@ export default class HotKeyPad { items[this.currentIndex].removeAttribute("data-active") items[nextIndex].setAttribute("data-active", "") + items[nextIndex].scrollIntoView({ behavior: "smooth" }); }) // Listen for the search input diff --git a/src/styles/index.css b/src/styles/index.css index 05f2c0d..3d6f3f6 100644 --- a/src/styles/index.css +++ b/src/styles/index.css @@ -88,6 +88,9 @@ gap: 0.5rem; padding: 0.5rem 0; border-block: 1px solid var(--hotkeypad-border-container); + height: 60vh; + max-height: 640px; + overflow: auto; } #hotkeypad [data-section] { From 17c88d1ecf1307b7c6f0b07859d6889ed1e19a41 Mon Sep 17 00:00:00 2001 From: Le Quang Thang Date: Thu, 13 Feb 2025 14:54:41 +0700 Subject: [PATCH 2/2] format style --- src/styles/index.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/styles/index.css b/src/styles/index.css index 3d6f3f6..21432b4 100644 --- a/src/styles/index.css +++ b/src/styles/index.css @@ -89,8 +89,8 @@ padding: 0.5rem 0; border-block: 1px solid var(--hotkeypad-border-container); height: 60vh; - max-height: 640px; - overflow: auto; + max-height: 640px; + overflow: auto; } #hotkeypad [data-section] {