From 9c7d6c14551e27cb3536f31af6d5414a7e3ea6f7 Mon Sep 17 00:00:00 2001 From: Trae Assistant Date: Sun, 4 Oct 2026 22:12:17 +0800 Subject: [PATCH] =?UTF-8?q?feat(ui):=20SVG=E5=9B=BE=E6=A0=87=E5=85=A8?= =?UTF-8?q?=E6=9B=BF=E6=8D=A2=20+=20Neo-Brutalist=E4=B8=BB=E9=A2=98?= =?UTF-8?q?=E5=8D=87=E7=BA=A7=20+=20=E6=95=B0=E6=8D=AE=E5=AF=BC=E5=87=BA?= =?UTF-8?q?=E5=8D=A1=E7=89=87=E7=B1=BB=E5=88=AB=E5=8B=BE=E9=80=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/index.html | 2 +- client/src/components/Button.tsx | 26 +- client/src/components/DataTable.tsx | 15 +- client/src/components/Icons.tsx | 124 ++++++++ client/src/components/Input.tsx | 2 +- client/src/components/Modal.tsx | 3 +- client/src/components/Select.tsx | 2 +- client/src/components/Textarea.tsx | 2 +- client/src/index.css | 67 ++++- client/src/pages/admin/Activities.tsx | 12 +- client/src/pages/admin/Export.tsx | 388 ++++++++++++++++++++------ client/src/pages/admin/Hours.tsx | 16 +- client/src/pages/admin/Layout.tsx | 59 ++-- client/src/pages/admin/Login.tsx | 5 +- client/src/pages/admin/Users.tsx | 18 +- client/src/pages/user/Dashboard.tsx | 8 +- client/src/pages/user/Index.tsx | 5 +- client/tailwind.config.ts | 81 +++++- 18 files changed, 657 insertions(+), 178 deletions(-) create mode 100644 client/src/components/Icons.tsx diff --git a/client/index.html b/client/index.html index d4f7c83..6391821 100644 --- a/client/index.html +++ b/client/index.html @@ -2,7 +2,7 @@ - + 义工时长管理系统 diff --git a/client/src/components/Button.tsx b/client/src/components/Button.tsx index a90f06d..46f3522 100644 --- a/client/src/components/Button.tsx +++ b/client/src/components/Button.tsx @@ -1,19 +1,31 @@ import { ButtonHTMLAttributes, ReactNode } from 'react'; interface Props extends ButtonHTMLAttributes { - variant?: 'primary' | 'secondary' | 'danger' | 'ghost'; + variant?: 'primary' | 'secondary' | 'danger' | 'ghost' | 'amber'; size?: 'sm' | 'md' | 'lg'; children?: ReactNode; } export default function Button({ variant = 'primary', size = 'md', className = '', children, ...rest }: Props) { - const base = 'inline-flex items-center justify-center font-medium border-2 transition-colors disabled:opacity-50 disabled:cursor-not-allowed'; - const sizeCls = size === 'sm' ? 'px-3 py-1.5 text-sm' : size === 'lg' ? 'px-6 py-3 text-lg' : 'px-4 py-2 text-base'; + const base = + 'inline-flex items-center justify-center font-bold border-2 border-black transition-all duration-150 disabled:opacity-50 disabled:cursor-not-allowed active:translate-x-[2px] active:translate-y-[2px] active:shadow-none'; + const sizeCls = + size === 'sm' + ? 'px-3 py-1.5 text-sm shadow-sm' + : size === 'lg' + ? 'px-6 py-3 text-lg shadow' + : 'px-4 py-2 text-base shadow'; const variantCls = { - primary: 'bg-black text-white border-black hover:bg-gray-800 hover:border-gray-800', - secondary: 'bg-white text-black border-gray-300 hover:bg-gray-100 hover:border-gray-400', - danger: 'bg-red-500 text-white border-red-500 hover:bg-red-600 hover:border-red-600', - ghost: 'bg-transparent text-black border-transparent hover:bg-gray-100', + primary: + 'bg-blue-600 text-white hover:bg-blue-700 hover:border-blue-800 shadow', + secondary: + 'bg-white text-black hover:bg-gray-50 hover:border-gray-700 shadow-sm', + danger: + 'bg-red-500 text-white hover:bg-red-600 hover:border-red-700 shadow', + ghost: + 'bg-transparent text-black border-transparent hover:bg-gray-100 shadow-none active:translate-x-0 active:translate-y-0', + amber: + 'bg-amber-400 text-black hover:bg-amber-500 shadow-amber', }[variant]; return (