motaju/msgapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

123

Browse Source
This commit is contained in:
mota
2025-11-02 15:13:03 +09:00
parent b10d41532b
commit fadd402e63
31 changed files with 1105 additions and 192 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/app/components/BoardToolbar.tsx
View File

@@ -45,8 +45,19 @@ export function BoardToolbar({ boardId }: { boardId: string }) {
};
return (
<div className="flex items-center justify-between px-0 py-2">
<div className="flex items-center gap-2">
<div className="px-0 py-2 flex flex-col gap-2 md:flex-row md:items-center md:justify-between">
{/* 검색바: 모바일에서는 상단 전체폭 */}
<form action={onSubmit} className="order-1 md:order-2 flex items-center gap-2 w-full md:w-auto">
<select name="scope" aria-label="검색대상" className="h-8 px-2 rounded-md border border-neutral-300 bg-white text-sm shrink-0" defaultValue={scope}>
<option value="q">제목+내용</option>
<option value="author">작성자</option>
</select>
<input name="text" defaultValue={defaultText} placeholder="검색어를 입력해 주세요." className="h-8 w-full md:w-72 px-3 rounded-md border border-neutral-300 text-sm placeholder:text-neutral-400 focus:outline-none focus:ring-2 focus:ring-neutral-300" />
<button type="submit" className="h-8 px-3 rounded-md bg-neutral-900 text-white text-sm hover:bg-neutral-800 shrink-0">검색</button>
</form>
{/* 필터: 모바일에서는 검색 아래쪽 */}
<div className="order-2 md:order-1 flex items-center gap-2">
<select aria-label="정렬" className="h-8 px-2 rounded-md border border-neutral-300 bg-white text-sm" defaultValue={sort} onChange={onChangeSort}>
<option value="recent">최신순</option>
<option value="popular">인기순</option>
@@ -58,14 +69,6 @@ export function BoardToolbar({ boardId }: { boardId: string }) {
<option value="1m">1개월</option>
</select>
</div>
<form action={onSubmit} className="flex items-center gap-2">
<select name="scope" aria-label="검색대상" className="h-8 px-2 rounded-md border border-neutral-300 bg-white text-sm" defaultValue={scope}>
<option value="q">제목+내용</option>
<option value="author">작성자</option>
</select>
<input name="text" defaultValue={defaultText} placeholder="검색어를 입력해 주세요." className="h-8 w-56 md:w-72 px-3 rounded-md border border-neutral-300 text-sm placeholder:text-neutral-400 focus:outline-none focus:ring-2 focus:ring-neutral-300" />
<button type="submit" className="h-8 px-3 rounded-md bg-neutral-900 text-white text-sm hover:bg-neutral-800">검색</button>
</form>
</div>
);
}