หน้ารายการ: แยกฟอร์มอัปโหลดเป็น section "เพิ่มเอกสาร" ของตัวเอง (เดิมอยู่ใต้หัว "เอกสาร" ดูเหมือนส่วนเดียวกับรายการ) + บอกชนิดไฟล์ที่รองรับใต้ฟอร์ม (PDF, JPG, PNG, TIFF — ไม่เกิน 100MB ต่อไฟล์) + การ์ดไฟล์กลับเป็นปุ่ม "Annotate" แทนลิงก์กางเต็มการ์ด (ย้อน M4 ตาม feedback) เป้าจิ้ม 36px + focus ring
Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
parent
1ecb8efcea
commit
bc8ba83deb
2 changed files with 15 additions and 9 deletions
21
app/page.tsx
21
app/page.tsx
|
|
@ -1,6 +1,6 @@
|
|||
import Link from "next/link";
|
||||
import { asc } from "drizzle-orm";
|
||||
import { ChevronRight, FileImage, FileText } from "lucide-react";
|
||||
import { FileImage, FileText } from "lucide-react";
|
||||
|
||||
import { db } from "@/db";
|
||||
import { files } from "@/db/schema";
|
||||
|
|
@ -45,13 +45,17 @@ export default async function HomePage() {
|
|||
|
||||
<UserPicker />
|
||||
|
||||
<section className="mt-8">
|
||||
<h2 className="text-sm font-semibold text-slate-700">เพิ่มเอกสาร</h2>
|
||||
<UploadFileForm />
|
||||
</section>
|
||||
|
||||
<div className="mt-8 flex items-baseline justify-between">
|
||||
<h2 className="text-sm font-semibold text-slate-700">เอกสาร</h2>
|
||||
{rows.length > 0 && (
|
||||
<span className="text-xs tabular-nums text-slate-500">{rows.length} ไฟล์</span>
|
||||
)}
|
||||
</div>
|
||||
<UploadFileForm />
|
||||
|
||||
{rows.length === 0 ? (
|
||||
<div className="mt-3 rounded-xl border border-dashed border-slate-300 bg-white/60 p-10 text-center">
|
||||
|
|
@ -68,7 +72,7 @@ export default async function HomePage() {
|
|||
{rows.map((f) => (
|
||||
<li
|
||||
key={f.id}
|
||||
className="group relative flex items-center gap-3 rounded-xl border border-slate-200 bg-white p-4 shadow-sm transition hover:border-primary/30 hover:shadow-md"
|
||||
className="group flex items-center gap-3 rounded-xl border border-slate-200 bg-white p-4 shadow-sm transition hover:border-primary/30 hover:shadow-md"
|
||||
>
|
||||
<div className="flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-primary/10">
|
||||
{imageFormatFromUrl(f.pdfUrl) ? (
|
||||
|
|
@ -88,14 +92,13 @@ export default async function HomePage() {
|
|||
{new Date(f.createdAt).toLocaleString("th-TH")}
|
||||
</span>
|
||||
</span>
|
||||
<ChevronRight aria-hidden className="h-4 w-4 shrink-0 text-slate-400" />
|
||||
{/* M4 (UX audit 2026-09-16): ลิงก์กางเต็มการ์ด — จอสัมผัสจิ้มตรงไหนก็เข้าได้
|
||||
(เดิมปุ่ม "Annotate" ~30px อย่างเดียว และเป็นภาษาอังกฤษใน UI ไทย) */}
|
||||
{/* ปุ่มเข้า annotate แทนลิงก์กางเต็มการ์ด (M4) ตาม feedback — เป้าจิ้ม 36px (H4) */}
|
||||
<Link
|
||||
href={`/annotate/${f.id}`}
|
||||
className="absolute inset-0 rounded-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-1"
|
||||
aria-label={`เปิด ${f.title}`}
|
||||
/>
|
||||
className="shrink-0 rounded-md bg-primary px-4 py-2 text-sm font-medium text-white transition hover:opacity-90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-1"
|
||||
>
|
||||
Annotate
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue