usememos/memos
1
1
Fork 0
mirror of https://github.com/usememos/memos.git synced 2024-12-20 09:41:58 +03:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source 
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/src/components/HomeSidebar.tsx
View File

@ -32,6 +32,10 @@ export const toggleHomeSidebar = (show?: boolean) => {
if (show) { if (show) {
sidebarEl.classList.add("show"); sidebarEl.classList.add("show");
maskEl.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 { } else {
sidebarEl.classList.remove("show"); sidebarEl.classList.remove("show");
maskEl.classList.remove("show"); maskEl.classList.remove("show");

1
web/src/components/SearchBar.tsx
View File

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