MUD6 推广移动统一设计

client/src/pages/MobileReimbursementDetailPage.tsx

@@ -880,7 +880,7 @@ export function MobileReimbursementDetailPage() {
         <div className="mt-3 space-y-2">
           {detail.items.length ? (
             detail.items.map((item) => (
-              <article key={item.id} className="rounded-lg border border-zinc-200 px-3 py-3">
+              <article key={item.id} className="mobile-list-card">
                 <div className="flex items-start justify-between gap-3">
                   <div className="min-w-0">
                     <div className="truncate text-sm font-semibold text-zinc-900">{item.expenseType?.name ?? "费用"}</div>
@@ -934,7 +934,7 @@ export function MobileReimbursementDetailPage() {
         {detail.invoices.length ? (
           <div className="mt-3 space-y-2">
             {detail.invoices.map((invoice) => (
-              <article key={invoice.id} className="rounded-lg border border-zinc-200 px-3 py-3">
+              <article key={invoice.id} className="mobile-list-card">
                 <div className="flex items-start justify-between gap-3">
                   <div className="min-w-0">
                     <div className="truncate text-sm font-semibold text-zinc-900">{formatInvoiceTitle(invoice)}</div>
@@ -1025,7 +1025,7 @@ export function MobileReimbursementDetailPage() {
         {(detail.attachments ?? []).length ? (
           <div className="mt-3 space-y-2">
             {(detail.attachments ?? []).map((attachment) => (
-              <article key={attachment.id} className="rounded-lg border border-zinc-200 px-3 py-3">
+              <article key={attachment.id} className="mobile-list-card">
                 <div className="min-w-0">
                   <div className="truncate text-sm font-semibold text-zinc-900">{attachment.originalName}</div>
                   <div className="mt-1 text-xs text-zinc-500">