feat: auto focus search bar when sidebar is shown (close #1269) (#1304)

feat: auto focus search bar when sidebar is shown
This commit is contained in:
Jason Chen 2023-03-08 08:02:51 +08:00 committed by GitHub
parent d1bafd66c8
commit 65850dfd03
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 0 deletions

View File

@ -32,6 +32,10 @@ export const toggleHomeSidebar = (show?: boolean) => {
if (show) {
sidebarEl.classList.add("show");
maskEl.classList.add("show");
// auto focus search bar when sidebar is shown
const inputEl = sidebarEl.querySelector("#mobile-search-bar") as HTMLInputElement;
inputEl?.focus();
} else {
sidebarEl.classList.remove("show");
maskEl.classList.remove("show");

View File

@ -54,6 +54,7 @@ const SearchBar = () => {
<input
className="flex ml-2 w-24 grow text-sm outline-none bg-transparent dark:text-gray-200"
type="text"
id="mobile-search-bar"
placeholder="Search memos"
ref={inputRef}
value={queryText}